Apploy lets you add mobile-only sections and blocks to your Shopify theme. These blocks appear inside your mobile app but stay hidden on the web storefront, giving you full freedom to design app-exclusive content, offers, and experiences.
This guide shows you how to create and use them.
Prerequisites
Apploy theme extension MUST be enabled on your Shopify theme.
Your Apploy plan has App Exclusive Design feature.
What Are App-Exclusive Blocks?
App-exclusive blocks are normal Shopify sections with a small condition that ensures they only render inside the Apploy mobile app.
Use them for:
Mobile-only banners
App-exclusive discounts
Special content for loyal users
Custom product highlights
Sticky CTAs
Any UI element meant only for the mobile app
Step 1: Create a New Section in Your Theme
Go to Online Store → Themes.
Click Edit code.
Under the /sections folder, click Add a new section.
Name it:
app-exclusive-banner.liquid
Add your HTML/Liquid content inside this file.
Step 2: Add the “App-Only” Visibility Condition
Wrap your content inside this condition:
{% if cart.attributes['_ApployExclusive'] == "Yes" %}
<!-- Your app-exclusive content here -->
{% endif %}
{% schema %}
{
"name": "App Exclusive Banner",
"class":"apploy-exclusive", // do not remove this class
"settings": [
{
"type": "image_picker",
"id": "banner",
"label": "Banner image"
},
{
"type": "text",
"id": "title",
"label": "Title"
}
],
"presets": [
{
"name": "App Exclusive Banner"
}
]
}
{% endschema %}
Apploy automatically sets the cart attribute _ApployExclusive = Yes when the website is loaded inside the mobile app.
This attribute is never set on the web storefront, so the block stays hidden there.
Step 3: Add the Section to a Page
Open the Theme Editor.
Navigate to the page where you want to show the app-only content.
Click Add Section.
Search for your Apploy Exclusive section.
Add and customize it.
This section will appear only in your mobile app.
Step 4: Preview in the Mobile App
Open your Apploy app and refresh the page.
You’ll see the new block rendered inside the app.
Example: App Exclusive Policies
// sections/app-exclusive-policies.liquid
{% if cart.attributes['_ApployExclusive'] == "Yes" %}
<div class="apploy-exclusive-policies">
<p class="apploy-policies-label">App Policies</p>
<nav class="apploy-policies-links" aria-label="App exclusive policies">
{% if section.settings.privacy_url != blank %}
<a href="{{ section.settings.privacy_url }}" target="_blank" rel="noopener" class="apploy-policy-link">Privacy Policy</a>
{% endif %}
{% if section.settings.shipping_url != blank %}
<a href="{{ section.settings.shipping_url }}" target="_blank" rel="noopener" class="apploy-policy-link">Shipping</a>
{% endif %}
{% if section.settings.tos_url != blank %}
<a href="{{ section.settings.tos_url }}" target="_blank" rel="noopener" class="apploy-policy-link">Terms of Service</a>
{% endif %}
</nav>
</div>
<style>
/* Minimal mobile-friendly inline styling */
.apploy-exclusive-policies {
padding: 12px 16px;
text-align: center;
font-size: 14px;
}
.apploy-policies-label {
margin: 0 0 6px;
font-weight: 600;
}
.apploy-policies-links {
display: inline-flex;
gap: 12px;
flex-wrap: wrap;
justify-content: center;
}
.apploy-policy-link {
text-decoration: none;
padding: 6px 8px;
border-radius: 8px;
font-size: 13px;
background: rgba(0,0,0,0.04);
}
.apploy-policy-link:hover,
.apploy-policy-link:focus {
text-decoration: underline;
}
</style>
{% endif %}
{% schema %}
{
"name": "Apploy Exclusive Policies",
"class":"apploy-exclusive",
"settings": [
{
"type": "url",
"id": "privacy_url",
"label": "Privacy policy URL (app-only)"
},
{
"type": "url",
"id": "shipping_url",
"label": "Shipping policy URL (app-only)"
},
{
"type": "url",
"id": "tos_url",
"label": "Terms of Service URL (app-only)"
}
],
"presets": [
{
"name": "Apploy Exclusive Policies"
}
]
}
{% endschema %}
Tips for Better App-Exclusive Content
Keep content minimal and mobile-friendly.
Use lightweight images.
Avoid heavy scripts.
Promote app-only deals using push notifications.
Always test on an unpublished theme first.