- Kaptai Rasta Matha, Chittagong 4221
- Mon – Fri: 8:00AM – 6:00PM
- AmzadHossen420360@gmail.com
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.
<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 %}
Step 1: Install the App
1. Go to the Shopify App Store and click Install App
2. Approve the installation in your Shopify admin.
3. After installation, the app will be available under Apps → Friends2a GDPR Cookie Banner.
Step 2: Open the Theme Editor
1. In your Shopify Admin, go to Online Store → Themes → Customize
2. The Theme Editor will open for your active Shopify theme.
Step 3: Add the Cookie Banner Block
1. In the Theme Editor’s left sidebar, scroll and click Add section
2. Choose Apps → Friends2a GDPR Cookie Banner
3. You will see three different design layouts available:
Cookie Banner – Design 1
Cookie Banner – Design 2
Cookie Banner – Design 3
4. Select your preferred layout to display on your storefront.
Step 4: Configure Your Cookie Banner
1. Click on the added banner block to open customization options.
2. You can modify:
Banner Text – Customize the message shown to users.
Button Label & Link– Set button text (e.g., Accept Cookies) and add a link to your privacy or cookie policy.
Position – Choose top or bottom placement.
Text Size and Color – Adjust to match your store’s design.
Background Color – Choose a banner color that complements your theme.
3. Each design layout can be fully customized for colors, fonts, and button styles.
Step 5: Save & Preview
1. After making changes, click Save (top-right corner of the Theme Editor).
2. Visit your storefront to preview the live Cookie Banner.
3. The banner will appear according to your selected layout and customization settings.
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/
Feature 1:
Three customizable cookie banner layouts (top or bottom display)
Feature 2:
Edit banner text, button label, colors, and background easily
Feature 3:
Ensure GDPR and cookie law compliance with zero coding setup
Feature 4:
Fully responsive design — looks perfect on desktop, tablet, and mobile
Feature 5:
Instant theme integration — add directly from theme editor, no code needed
Feature 6:
Customizable text size and fonts to match your brand style
