Description

You will need to scroll at least 80 px in order for the sticky header to appear. To login in admin area use standard cs-cart path /admin.php and standard cs-cart user/pass - admin,admin

Cs-cart Sticky Header & footer

When scrolling on a page, usually the menu and other important elements placed inside the header are not visible anymore. Using this sticky header you can choose to display the same, or a different header when the user scrolls.

The sticky header and footer can be displayed on full width, or fluid grid. If you are using a fixed width, use the fluid setting. This will take the exact same width as your cs-cart.

You can customize the distance in pixels which will trigger the header. The default is 80px, this means when a user will scroll 80 pixels from top, the header will appear. The header will disappear in case the user will scroll back up within the 80px distance from top.

Exactly the same thing will happen with the footer, this will disappear if the user reaches the bottom of the page. Additionally the footer has the option to hide/show by any user, and this will remain as selected until further actions.

By default, 2 more grids will appear in your "Layouts/ Default location" with the following classes:

Header: sticky-header-wrapper

Footer: sticky-footer-wrapper

Those grids will contain default blocks from cs-cart. (logo, search, cart for header, copyright and payment methods for footer )

You can use inside the header and footer ANY cs-cart block you want, it can be your logo, search, minicart, account, or any other blocks. Also, you can create other grids inside and restructure it.

In our demo, we added another grid on top to display a custom html information and the quick links.

From addon settings you can customize the appearance individually for your header and footer. Tool-tips are present for all settings to explain them.