A sticky footer bar is a new free feature of Woostify. This feature allows you to display a float responsive sticky footer containing the important sections (such as shop pages, specific single product page, cart page, and/or checkout page) at the bottom of your WooCommerce site. This is a useful function for any online shop because it helps customers easily and conveniently navigate to the places you target, giving customers a better shopping experience and resulting in a higher conversion rate.
How to use Woostify Sticky Footer Bar in your WooCommerce store?
To enable this function, in your WordPress dashboard, click on Apperance > Customize.
You then are driven to the customizer interface. There is a list of customization options. Just select Layout as below:
Then, you can see a list of options to customize you shop layout, find Sticky Footer Bar to start editing it.
In here, there are 2 main sections for you to edit, including General and Design.
1. General
In General section, you can easily customize the WordPress Sticky Footer Bar with the following options:
- Enable: by turning on this option, the WordPress Sticky Footer Bar will be displayed at the page bottom and work on your online shop.
- Hide when scroll: tick this option if you want to hide the sticky bar when scrolling down the site. It only appears when you scroll up.
- Hide on Product Single Page: tick this option if you want to hide the sticky footer on all single product pages.
- Hide on Cart Page: tick this option if you want to hide the sticky footer on the cart page.
- Hide on Checkout Page: tick this option if you want to disable the sticky footer on the checkout page.
Besides, you can choose to display the sticky footer on the devices you desire namely Desktop, Mobile, or both of them.
In addition to the configuration options above, you can make further changes on the sections appearing on the footer bar in the item section.
1.1. Type
Here, you can select the type of the item as follows:
- Custom: This option allows you to change the link of the item.
- Wishlist: The products you put on the wishlist.
- Cart: The cart page.
- Shortcode: This option allows you to add custom shortcodes.
- Search: This option allows you to include a form for customers to search for any products in your store.
1.2. Icon
In the Icon section, you can easily choose and change the icon of the item by clicking in the Select button. Or you can remove the icon by hitting the Clear button.
1.3. Name & Link
In this area, you can type the name of the item and add the link to the place you want to drive your customers.
NOTE: The link can only be changed if you set Custom type for the item. With other types, you can’t change the link section.
2. Design
In this section, you can change the color of the background, icon, hover, and text. Beside, you can also edit the size of text, icon and the bar. Furthermore, this option also lets you customize the space between these items.
After customizing all things, you need to check the sticky footer bar on various screen sizes: desktop, tablet, and mobile. If there is any error, you can make further changes to make it fit the target devices. When they are Ok, click the Publish button to save your changes.
Once finishing, you can visit the shop and check how Woostify sticky footer bar works on your site.
Introducing WoostifyBlocks beta - Our new plugin for Gutenberg page builder is ready to test