Landing pages are created by utilizing a customization of the HikaShop view template for category/listing.php. The customization is to add a special module position within the template. That module position is named "category_landing_top". Modules containing the content of the various landing page sections are then created and assigned this category_landing_top as the module position and assigned to the appropriate page(s).

Landing Page modules

Each landing page may involve one or multiple modules. If multiple modules are used, their display order is determined by the module ordering as set in the administrator.

There are a few specific settings that are needed to apply the landing page CSS styling to each landing page.

• Module tab
  • Show title: Hide
  • Position: category_landing_top
• Advanced tab
  • Include 'landing' in the Module class suffix.
  • Include 'something-specific' to uniquely identify each landing page (e.g. 'landing first floor-boxes' where 'floor-boxes' is the unique phrase) NOTE: 'floor-boxes' is not the same as 'floor boxes', so be sure not to use spaces unless you really mean to.
  • Make sure you include a space before and after 'landing' as needed to isolate it from other class keywords.
• Assignments tab
  • (adjust as necessary depending on whether the Regular Labs Advanced Module Manager is installed - it is NOT installed as of this writing)
  • Same as other module: none
  • Matching method: any
  • Show assignments: selected
  • URL: (set this for the page URL) (e.g. /fsr-products/category/floor-boxes

There are some specific sections (first and last) that need different/additional settings

• First - The 'first' designator is only needed IF there will be 
  • Advanced tab
    • Include 'first' in the Module class suffix (e.g. ' landing first')
• Last
  • Advanced tab
    • Include 'last' in the Module class suffix (e.g. ' landing last')

Content

As always, NEVER paste text from a Microsoft Word or other WYSIWYG text editor directly into the Joomla article edit window. Instead, use the "Paste as Plain Text" button in the editor (the icon is a clipboard with a 'T' in front). Then style your content within the Joomla article edit window as needed.

• Headings
  • Heading text style should be set as H3.
  • Parts of the heading text that should be colored green should be specified as 'span' in the styling selector.
  • The gradient that is displayed via CSS is applied to each H3 element. So if there are multiple H3 blocks of text within one module they will each have the gradient applied.
• Paragraph text
  • Normal paragraph text will, by default, be wrapped in HTML paragraph tags. Images embedded WITHIN a paragraph will be styled differently than those styles as indicated below.
• Images
  • Inserted images will also be inserted in paragraph tags by default. The images should be changed from paragraph to 'div' styling using the style dropdown selector in the editor. This is critical to styling the images.
• Special issues
  • Internal page links - In some cases it is desired to create a button to jump over some content. One example is to go straight to the bottom of the page where the actual products are listed. Insert the following code:
    • The following code will place a button within the content of a landing page section module.
      • <p class="button_paragraph"><a class="button button-3" href="#floor_box_options">Select your floor box option</a></p>
      • NOTE: This code must be uniquely modified (e.g. floor_box_options and the link text 'Select your floor box option') to match the anchor tag noted below.
    • The following code needs to be added to the bottom of whichever module is the last one for EACH landing page. Because that will be just ABOVE the HikaShop category items list.
      • <p><a name="floor_box_options"></a></p>
      • NOTE: The 'floor_box_options' name should be unique for each landing page.