Bottom Bar

Kalles 4 Bottom Bar allows users to create a more flexible and professional "Footer bottom" with a new block called "Col (Parent)". Let's follow this article to get more information about configuring Bottom Bar on Kalles 4.

1. Bottom Bar Settings


  • Border top: Enable/disable border-top option. Moreover, you can also choose border position between In container and Full width.

  • Space horizontal/ vertical items: You can change this for both Desktop and Mobile versions.


  • You are allowed to change Font family, Font-size, Line height, Font weight, Letter spacing, Heading margin for the heading of each block.


  • You can Font size and Font weight for the content.

  • There are Heading, Text, Link, Link hover, Border color options for you to change.


  • Layout: You can choose among Container, Wrap container, Full width.

  • Background: Allow to change color and gradient for background.

2. Bottom Bar Content

2.1. Col (Parents)

Col (Parent) is a new block which added to help us build a more flexible bottom bar. As in the Kalles ver 3.x.x, we can not add many block in a column. However, in Kalles 4, we can do it with Col (Parent).

  • Heading: You can add a heading for Col (Parent). If you don't like showing heading, please leave it blank.

  • Menu: You are also allowed to add a Menu. Moreover, you can change Menu style, Item width (Desktop, Tablet, Mobile), Content Align, and Padding Inner.

  • Options on mobile: There are some options that you can change only for Mobile devices including Heading mobile, Content align, Padding inner.

2.2. Text

  • Text input: You are allowed to enter any text here. Please use <br> to break line and there is an option to enable/disable line break on mobile devices.

  • Style: You can change Font-family, Text color, Font-size, Line-height, Font-weight, Letter Spacing, Margin bottom for Text on bottom bar.

  • There are two options for you to make Text shadow and Italic font.

  • Mobile options: There are many option for mobile version separetely, including Hidden on mobile, Font-size, Line-height, Letter-spacing.

2.3. HTML

  • You can add any HTML here to show in the Bottom bar. There is also an option to hide this block on Mobile version.

2.4. Image (Child)

  • Image (Child): You can upload an image there.

  • Image link: Add a link here to show when your customers click on the image. Leave it blank to direct to the homepage.

  • Image width: You can change it for both Desktop and Mobile.

  • Margin bottom: You can also change it for both Desktop and Mobile.

2.5. Payment

  • SVG list: There are available list here for you. You can add more or delete some of them.

  • Moreover, you can change SVG height, Margin bottom (both Mobile and Desktop), and hide this block on mobile.

2.6. Menu

  • Menu: Here you can upload a menu.

  • Menu style: There are 2 types of menus for you to choose from.

  • Margin bottom: You are allowed to change it both on Desktop and Mobile.

2.7. Social

  • Title: You can fill in any title for Social here.

  • Social mode: There are two modes that you can choose from, including Follow and Share.

  • Social styles: You are allowed to choose styles from 1 to 4. Moreover, in some styles, you can adjust Border-radius, Social color, Space horizontal/vertical (both desktop and mobile), and Margin bottom (both desktop and mobile).

  • Copyright: You can enter any HTML on that position.

  • Margin bottom: You can change this both for Desktop and Mobile devices.

[Private offer] Unsen Partner Plan

Exclusively for Unsen users, you can get EComposer - Theme Partner Plan for ZERO and start making beautiful, high-converting store pages today:

  • FREE 100% EComposer Standard plan for 6 months (save you $114)

  • Build ANY Shopify pages: Landing page, Sales Funnel page, Lead pages, & other custom pages tailored for your marketing campaigns.

  • Create advanced sections & add to Unsen with ease

  • Save up to 50 pages/sections

  • 100+ professional, stunning pre-designed templates

  • Anyone can build pages with live drag-drop editor

How to claim offer: Install EComposer HERE. Then open chatbox icon in EComposer dashboard and leave a message with subject “Unsen+EComposer” to upgrade for free.

Cheers, The4.

Last updated