Footer Documentation
The footer section is designed with a modern dark layout that enhances brand visibility while providing essential navigation and contact information. It is divided into multiple structured areas for better usability and customer engagement.
Newsletter Subscription
At the top of the footer, a newsletter subscription section encourages users to subscribe using their email address to receive updates, promotions, and discount offers. The subscription form includes:
- Email input field
- Subscribe button
- Privacy & Terms notice
This section helps improve customer retention and email marketing engagement.
Newsletter Block Settings
The newsletter block is used to collect customer email subscriptions.
Heading
Controls the newsletter title text.
Example:
Subscribe our newsletter to receive updates about discounts
Heading Size
Available heading sizes:
- H1
- H2
- H3
- H4
- H5
Rich Text
Allows adding additional text such as:
- Privacy Policy notice
- Terms of Use information
- Promotional descriptions
Text Style
Supports:
- Body
- Subtitle
Text Size
Controls the newsletter description text size.
Button Style
Available styles:
- Primary
- Secondary
Button Type
Controls button appearance:
- With icon & text
- None
Newsletter Appearance Settings
Inherit Color Scheme
Uses the parent footer color scheme automatically.
Corner Radius
Controls border radius of the newsletter form elements.
Newsletter Padding
Custom spacing controls:
Right
Top
Bottom
Left
Color scheme
| Settings | Description |
| Color scheme | You can change the color of the footer. Its color scheme is based on your main theme “Color Settings“ |
Footer Section Settings
Background Image
Allows uploading a custom background image for the footer section to enhance branding and visual appearance.
Media Overlay
Adds a dark overlay above the background image to improve text readability.
Layout Width
Controls the overall width of the footer section.
Available options:
- Page Width
- Full Width
Color Scheme
Selects the predefined color scheme used for the footer background, text, buttons, and links.
Section padding settings
| Settings | Description |
| Desktop: Padding top | The section’s top inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the desktop. |
| Desktop: Padding bottom | The section’s bottom inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the desktop. |
| Tablet: Padding top | The section’s top inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the mobile. |
| Mobile: Padding bottom | The section’s top inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the mobile. |
| Mobile: Padding top | The section’s top inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the mobile. |
| Mobile: Padding bottom | The section’s bottom inner space height is determined. From 0 to 200 px, will be incremented by 2px. It will affect the desktop. |
Footer Navigation
The main footer area is organized into four columns:
Quick Menu
Contains important store navigation links such as:
- Home Page
- All Products
- Contact Us
- About Us
- Fashion
- News
Help & Support
Provides access to customer support and policy-related pages:
- Privacy Policy
- Refund Policy
- Terms & Conditions
- Collections
- Articles
Best Selling
Highlights featured or trending products to improve product discoverability and conversions.
Contact Information
Displays business contact details including:
- Email address
- Phone number
- Social media icons (Facebook, Instagram, YouTube, TikTok)
Menu Block Settings
The menu block displays navigation links inside the footer.
Heading
Controls menu title.
Example:
- Quick Menu
- Help & Support
- Best Selling
Heading Size
Available options:
- H1
- H2
- H3
- H4
- H5
Typography Branding
A large background typography element (“FAITH”) is used as a visual branding component to create a bold and premium aesthetic appearance.
Lettermark Logo
The Lettermark Logo block lets you add individual SVG letters or shapes that together create a large branded typography design.
The Logo block is used to create the large decorative branding typography displayed inside the footer section. This feature allows merchants to build fully custom oversized footer branding using SVG-based lettermark logos.
SVG Icon
Paste custom SVG code directly into the SVG field. Each block represents a single letter or graphic element.
Example uses:
- Brand initials
- Large typography branding
- Decorative footer graphics
- Custom vector-based shapes
Multiple Logo Blocks
Multiple Lettermark Logo blocks can be added to create complete words or custom footer compositions.
Example:
- F
- A
- I
- T
- H
These individual SVG blocks combine visually to create the large “FAITH” branding typography shown in the footer.
Responsive SVG Rendering
All SVG elements scale responsively and remain sharp on all screen sizes and retina displays.
Custom Branding Layout
The logo blocks help create a premium and modern footer appearance by combining oversized typography with navigation and contact information.
Add / Remove Blocks
- Add Block → Adds a new SVG letter or shape
- Remove Block → Deletes the selected logo element
This system provides full flexibility for creating unique footer branding designs inside the Shopify theme editor.
Bottom Footer Bar
The bottom section includes:
- Copyright information
- Country & language selector
- Supported payment method icons
This area provides localization support and builds trust through payment gateway visibility.
Design Features
- Dark premium color scheme
- Responsive multi-column layout
- Large typography branding
- Rounded newsletter input design
- Social media integration
- Mobile-friendly structure
- Clean spacing and visual hierarchy
This footer is fully optimized for modern Shopify fashion and lifestyle stores, combining branding, navigation, customer support, and conversion-focused elements in a single section.
Country/Region Selector (Multi-Currency)
| Settings | Description |
| Enable country/region selector | You can enable/disable multi-currency from the footer. NOTE: To add a country/region, go to your payment settings |
How to setup Payments in your store
Please follow the instructions-
- From your Shopify admin, go to Settings > Payments.
- In the Shopify Payments section, click Manage.
Go to the page to get more details, Learn more
How do you show Payment Icons on Shopify?
| Settings | Description |
| Show payment icons | If you enable it, the payment icon will appear in the footer. Warning: You must need to set up payment methods in your store. |