Add banner, Remove banner from Home Page, Advance Grid

The Advanced Grid module is a very powerful grid system that allows you to import other modules (Banners and Revolution Sliders) and display them in various grid plit formats.

With a default installation, Top slider + Banner beside it or banners below slider has been pulled and placed to home page using Advance Grid. The Advanced Grid module will display a list with the available modules that can be imported into the grid.

The image dimensions used in the grid must be precise in order to display properly. To help you create precise dimensions we have implemented a feature that shows them in the storefront whenever you hover over the Advanced Grid module. You’ll see them in red in the upper/left corner. These dimensions are only visible to you if you’re logged into the admin so other people don’t see them.

The Advanced Grid module can be added to any layout in the following positions:

  • Top
  • Content Top
  • Content Bottom
  • Bottom

To create an Advanced Grid module access it and click on the Create New button on the Add to Layout page, then refer to the explanations below to understand what they do. For an explanation of the Add to Layout page click here.

  • 1 Module Name – This is the module name that will appear on the Add to Layout page.
  • 2 Height – You must declare a module height in order to have other modules stacked in rows. Modules can occupy the entire height (100%) or can be divisible by 25%, 33%, 50%, 66% and 75%. .
  • 3 Spacing – This adds margins between columns and rows. Try to stick with 20 as your spacing as that’s the common margin throughout the theme.
  • 4 Disable on Mobile – Optionally disable the module on mobile devices.

Top / Bottom Settings
  • 1 Background – Background Settings for the Top or Bottom container holding the module.
  • 2 Fullwidth - Can make the module fullwidth to extend to 100% of the browser width, past the limits of the site container.
  • 3 Margin – Optionally add top and bottom margins to the module.

These options only apply if you add the module to the Top or Bottom positions.
Column / Module
  • 1 Column Width – Indicate how much space should this column occupy from the total available. The total available is your site width (Settings > Global > General > Layout > Site Width) Note that columns within the Advanced Grid module must match a total of 100%. For example if you choose 75% on one column you must choose 25% for the second one (in case you want just 2). In case you want 3 or 4 columns just make sure they all add up to 100%.
  • 2 Status - Turn the section on/off.
  • 3 Sort Order – Move sections before or after other sections.

  • 1 Module - This is where you choose your separately created modules (Banners or Revolution Sliders).
  • 2 Module Height – Indicate the height this module should occupy. Remember that you had to declare a module height in the general options. This procentual height is based on that height.
  • 4 Disable on Mobile – Optionally disable the module on mobile devices.
  • 5 Status - Turn the section on/off.
  • 6 Sort Order – Move sections before or after other sections.

Save and Add to Layout.