Kalles 4.0
Search…
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

ADVANCE OPTIONS
  • 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.
HEADING OPTIONS
  • You are allowed to change Font family, Font-size, Line height, Font weight, Letter spacing, Heading margin for the heading of each block.
TEXT CONTENT OPTIONS
  • You can Font size and Font weight for the content.
  • There are Heading, Text, Link, Link hover, Border color options for you to change.

DESIGN OPTIONS

  • 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.
From The4
Hope you success!!