Prestige Theme Integration - FSB

Step 1: Select the placeholder option

  1. Select the last option under the "position" setting in the bar configuration in the App
  2. Scrolling to the very end, and click the "Save" button to save the change

Step 2: Add the bar

  1. Go to Admin > Online Store > Themes
  2. Click the "Actions" button on the right-hand side, and select "Edit code"
  3. Find header.liquid and open it
  4. Add following code at the beginning of the file and Save the changes.

<div id="fsb_placeholder"></div>

 

 

Step 3: Add CSS

  1. Find theme.scss.liquid from the left-hand side file list and open it
  2. Add following codes at the very end of the file and save the changes.
#fsb_background{ z-index: 9 !important; }

 

 

Issue

  1. When selecting any sticky position option, the bar covers the website sticky header when scrolling.
  2. The bar covers the mobile menu.

Notes

  1. The sticky option of the app works for this theme as well. There is no different when it is selected.
  2. After integrating this solution, the bar becomes part of the website sticky header and will always be sticky.
  3. Any non-sticky position option works with this theme out of the box.