Items per Row
The Items per Row option is available in any grid-based module (modules that can have multiple items in them, like Products, Banners, Blocks, etc). and also apply to the product listing from the category page (or other category-type layouts like Specials, Search, etc).
The option can be set as a reusable variable in Journal > Variables > Items per Row or used as "Custom" values on any specific option.
The Items per Row allows you to indicate however many items shall be displayed per row at any given screen width. In a fluid responsive layout, the Items per Row dictate the width of the item. If you have 1 item per row it will expand to fill the entire width of the row so the single item would be 100% in width. 2 items per row would make each 50% in width since two equal items would occupy the row, 3 items per row would make each item one-third wide, 4 items per row 25%, 20 items per row would make the item only 5% in width, and so on.
Products per row for the global product listing on category-type layouts are set in Journal > Skins > Edit > Product Listing > Products per Row.
Space Between
For each rule, there is also a spacing option that adds spacing between the items/products. This spacing is a variable defined in Journal > Variables > Spacing (Value), but you can also type a custom value in each field without having to use a variable. Different values can be applied per breakpoint rule, in cases where you might need the items closer together on smaller screens.
The option also allows for different Items per Row based on page layout structure, whether a layout has side columns enabled or not. Normally you're just interested in the first "No Columns" section if the page does not have side columns enabled or the modules are added in the Top or Bottom positions.
An example of a page with no side columns would be a typical home page, like Opencart's demo home page, notice no side columns enabled with 4 products (items) per row: https://storage.journal-theme.com/s/yZTpsd5WjsrFHgC
An example of a page with a side column enabled would be the typical category layout, with a module in the side column, notice here on Opencart's category page the left side column is enabled and only 3 products per row are in the main content area: https://storage.journal-theme.com/s/a925NwKEBTHNwX8
This is the control the Items per Row option offers, to indicate however many items to have per row in any given layout or screen width situation.
In Journal, you can activate the side columns positions in any layout in Journal > Layouts > [Any layout] > Active Positions > CL (Column Left) or CR (Column Right) as explained here: https://storage.journal-theme.com/s/DypjA9N8fKM683q
Please see our docs on Items per Row for more info: https://docs.journal-theme.com/docs/options/items-per-row/
Since Items per Row depend on your layouts configuration make sure to also go over the layouts docs to understand how positions work: https://docs.journal-theme.com/docs/layouts/layouts/
Variable or Custom use
The Items per Row can be set as a variable in Journal > Variables > Items per Row. This can be handy when you need the same rules to apply in multiple modules, and/or in the global product listing in Journal > Skins > Edit > Product Listing > Products per Row.
If you don't wish to use a variable choose "Custom" in your Items per Row option, as seen here: https://storage.journal-theme.com/s/S2ZbLes4oEW2RG5
A typical variable called "Products per Row" could indicate all possible scenarios for your products display, with breakpoint rules in each section so that when this variable is used in multiple places like various Products modules or in the global product listing, the products behave as expected regardless of the layout/position scenario, and of course of the screen width.
A typical Items per Row variable used for product listing would look like this, but of course, any values should reflect your specific use case: