Footer top

Overview:

The Footer Top section is designed to display brand information, navigation links, social media icons, payment methods, and promotional footer content above the main footer area. It supports logo blocks, brand descriptions, navigation menus, responsive layouts, color schemes, and spacing controls to create a structured and informative footer experience.


Blocks Configuration

Logo Block:

The Logo block displays the brand logo inside the footer top section.

Logo Settings

Setting Description
Logo Image Uploads the logo displayed in the footer section.
Desktop Logo Width Controls the logo width on desktop devices.
Mobile Logo Width Controls the logo width on mobile devices.

Spacing

Setting Description
Bottom Margin (Desktop) Adds spacing below the logo block on desktop devices.
Bottom Margin (Mobile) Adds spacing below the logo block on mobile devices.

Description Block:

The Description block displays brand information or supporting content.

Content:

Setting Description
Description Text Displays rich text content such as company introduction, store information, or promotional messaging.

Typography;

Setting Description
Text Size Controls the size of description text such as Large, Medium, or Small.
Text Weight Adjusts the font thickness ranging from Thin (100) to Black (900).
Text Case Changes the text transformation style such as Uppercase, Lowercase, Capitalize, or Default.
Font Family Allows switching between Default and Heading font family styles.
Text Color Style Applies predefined color styling to the description text.

Spacing;

Setting Description
Bottom Margin (Desktop) Adds spacing below the description block on desktop devices.
Bottom Margin (Mobile) Adds spacing below the description block on mobile devices.

The Menu block displays navigation links inside the footer top section.

Setting Description
Menu Selects the Shopify navigation menu displayed in the footer.

Typography:

Setting Description
Text Size Controls the size of menu text such as Large, Medium, or Small.
Text Weight Adjusts the font thickness ranging from Thin (100) to Black (900).
Text Case Changes the text transformation style such as Uppercase, Lowercase, Capitalize, or Default.
Font Family Allows switching between Default and Heading font family styles.

Spacing:

Setting Description
Bottom Margin (Desktop) Adds spacing below the menu block on desktop devices.
Bottom Margin (Mobile) Adds spacing below the menu block on mobile devices.

Section Configuration

Setting Description
Show Payment Icons Displays supported payment method icons inside the footer.
Show Social Icons Displays social media profile icons in the footer.
Enable Follow on Shop Enables the Follow on Shop feature for supported Shopify stores.

Layout:

Setting Description
Container Layout Determines whether the section uses Contained, Contained Content, or Full Width layout.
Container Width Controls the maximum width of the footer container on desktop devices.

Color Scheme:

Setting Description
Section Color Scheme Applies a predefined color palette to the footer top section background and content.

Inner Spacing:

These settings control spacing inside the footer section.

Setting Description
Top Padding (Desktop) Adds spacing inside the top area of the section on desktop devices by default 58px.
Bottom Padding (Desktop) Adds spacing inside the bottom area of the section on desktop devices by default 0px.
Left Padding (Desktop) Controls inner left spacing on desktop devices by default 70px.
Right Padding (Desktop) Controls inner right spacing on desktop devices by default 70px.
Top Padding (Mobile) Adds spacing inside the top area of the section on mobile devices by default 35px.
Bottom Padding (Mobile) Adds spacing inside the bottom area of the section on mobile devices by default 0px.
Left Padding (Mobile) Controls inner left spacing on mobile devices by default 12px.
Right Padding (Mobile) Controls inner right spacing on mobile devices by default 12px.

Outer Spacing:

These settings control spacing outside the footer section.

Setting Description
Top Margin (Desktop) Adds spacing outside the top area of the section on desktop devices.
Bottom Margin (Desktop) Adds spacing outside the bottom area of the section on desktop devices.
Left Margin (Desktop) Controls outer left spacing on desktop devices.
Right Margin (Desktop) Controls outer right spacing on desktop devices.
Top Margin (Mobile) Adds spacing outside the top area of the section on mobile devices.
Bottom Margin (Mobile) Adds spacing outside the bottom area of the section on mobile devices.
Left Margin (Mobile) Controls outer left spacing on mobile devices.
Right Margin (Mobile) Controls outer right spacing on mobile devices.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us