Hello, Our Apps Users
We’ve noticed that some users are experiencing issues with Shopify free apps when using the Horizon (new update) theme and a few other Shopify free themes.
However, this issue does not occur with the Shopify Dawn theme, Shopify core premium themes, or ThemeForest themes.
If you are facing this issue on the Horizon theme or any newly updated Shopify free theme, please review the screenshots we’ve shared and follow the guideline below.
Why This Issue Happens:
In the Horizon new update theme (and some other Shopify free themes), when you add an app block, it is automatically wrapped inside a Section container.
This Section applies automatic CSS and admin UI styles, which may conflict with the app’s layout. As a result, app content such as FlipBooks or iframe-based apps may appear squeezed, misaligned, or broken.
This is a theme-level layout behavior, not an app bug.
How to Fix the Issue (Solution)
Please follow these steps carefully:
1. Go to Online Store → Themes → Edit code
2. Open the Sections folder
3. Find the file named apps.liquid
– If the file exists, open it and paste the provided code into it
– If the file does not exist, create a new file named apps.liquid and paste the code into it
4. Save the file
5. Go back to Theme Customization
6. Add the app block again
After completing these steps, everything should display correctly.
Summary :
– This issue is related to the Horizon / Shopify free theme layout behavior
– It is not an app bug
– Dawn, Shopify premium themes, and ThemeForest themes work without any issues
– Following the steps above will resolve the problem
If you still face issues after following this guide, please share updated screenshots and we will be happy to assist further.
Create file name : apps.liquid and past it
<div class="{% if section.settings.include_margins %}page-width{% endif %}">
{% for block in section.blocks %}
{% render block %}
{% endfor %}
</div>
{% schema %}
{
"name": "Apps",
"tag": "section",
"class": "section",
"settings": [
{
"type": "checkbox",
"id": "include_margins",
"default": true,
"label": "Include page margins"
}
],
"blocks": [
{ "type": "@app" }
],
"presets": [
{ "name": "Apps" }
]
}
{% endschema %}
Friends2a Technology Jewellery Pro
F2 Jewellery Pro – Installation & Setup Guide
This document provides a complete step-by-step guide to install and configure the F2 Jewellery Pro app in Shopify. The app includes 4 main blocks:
1. NavMenu Property Search Filter
2. Collection Filters
3. Home & Other Pages Filter
4. Jewellery Builder
Step 1: Install App & Enable Theme
- Go to Shopify Admin → Apps
2. Install “F2 Jewellery Pro”
3. Go to Online Store → Customize
4. Select your live theme (e.g., Dawn)
Step 2: NavMenu Property Search Filter (Home Page)
Add Block:
– Customize → Home page
– Click Add Section → Apps
– Select Jewellery NavMenu Finder
Menu Setup (Important):
Structure:
Product Type → Material Type → Price Range
Example:
Bracelets & Bangles → Diamonds → Under £1000, £1000-£2000, etc.
Settings:
– Dropdown 1: Product Type
– Dropdown 2: Material Type
– Dropdown 3: Price Range
– Button: Search
Step 3: Collection Filters
Add Block:
– Customize → Default Collection
– Add block → Filter-Collection Pages
Settings:
– Filter Heading: Filter Products
– Items per page: 24
– Enable: Price, Metal, Stone, Gender, Size
– Price Range: Min 0, Max 5000
Step 4: Home & Other Pages Filter
Add Block:
– Customize → Home page or other pages
– Add block → Filter-Other Pages
Settings:
– Set Fallback Collection (Important)
– Enable all filters (Price, Metal, Stone, Gender, Size)
Step 5: Jewellery Builder (Product Page)
Add Block:
– Customize → Default Product
– Add block → F2 Jewellery Builder
Features:
– Ring Size selection
– Metal type selection
– Stone type selection
– Engraving (optional)
Output:
– Selected options show automatically
– Data appears in Cart and Checkout
Step 6: Cart & Checkout
Cart and Checkout will display:
– Ring Size
– Metal Type
– Stone Type
– Engraving text
Common Mistakes to Avoid
– Incorrect menu structure will break NavMenu
– Missing fallback collection will break filters
– Builder not added to product page = no customization
– Filters disabled = no sidebar filters
If you need Support, please message us on WhatsApp. We will give you a response just in one minute. Or mail to us, Amzadhossen420360@gmail.com Or Contact Our Support Website : https://friends2a-technology.com/fhopify/contact-us/
Friends2a Jewellery Finder helps jewelry stores create advanced product filtering using Shopify navigation. Easily build multi-level dropdowns for product type, material, and price range to improve product discovery and user experience. Customers can quickly find rings, bracelets, and other jewelry items within specific criteria. Fully compatible with Online Store 2.0 and customizable without coding.
🟡 Features (SEO Optimized)
Feature 1
Multi-level jewelry product filtering systemFeature 2
Filter by product type, material, and price rangeFeature 3
Navigation-based dynamic dropdown searchFeature 4
Works with Shopify Online Store 2.0 themesFeature 5
Fully customizable without coding
