You can use Custom Position to manually place the free shipping bar anywhere on your site.
✅ Step 1: Open the Hoppy Free shipping app.
1️⃣ Go to Shopify Admin → Apps → Hoppy Free shipping app.
2️⃣ You will see multiple placement options for your Free shipping Bar. Select the shipping type and then navigate to the Placement tab
Product Page 🛍️– Show the shipping bar on all product pages to encourage more purchases.
Top/Bottom bar🔝🔽 – Choose to display the bar at the top or bottom of the page.
Cart page 🛒 – Display the bar on the cart page to remind customers about free shipping.
✅ Step 2: Placement of the Free Shipping Bar
3️⃣ To place the Shipping Bar in a custom location, select Custom Position in the Placement tab settings. This will unlock two options:
🔹 Option 1: Using App Block (Recommended for Beginners)
This method uses the Shipping Bar ID to place the shipping bar.
📌 Steps to Add Shipping Bar Using App Block:
First, Copy the Shipping Bar ID.
Go to Shopify Admin → Online Store → Themes.
Click on Customize to open the Theme Editor.
Navigate to the page and the section where you want to add the Shipping Bar. Click on Add Section → Scroll to Apps → Select Free Shipping Bar.
Paste your Shipping Bar ID in the right-hand settings panel.
🔹 Option 2: Using Custom Liquid (Advanced)
This method requires adding a code snippet to your theme using Custom Liquid.
📌 Steps to Add Shipping Bar Using Custom Liquid:
First, copy the Code snippet📄.
Go to Shopify Admin → Online Store → Themes.
Click on Customize to open the Theme Editor🔍.
Navigate to the page and section where you want to add the Shipping Bar. Click on Add Section → Search for Custom Liquid → Click on it📌.
Paste your Shipping Bar Code Snippet into the Custom Liquid editor🎯.
✅ Step 3: Save and Test Your Placement
4️⃣ Click Save in Shopify's Theme Editor.
5️⃣ Visit your store and check if the badges appear in the correct position.
6️⃣ If the Shipping Bar is not visible, try:
Clearing your browser cache.
Checking if Custom Positioning is enabled in the Free Shipping Bar app.
Refreshing your store page.
🔥 Great job! Your Shipping Bars are now positioned just the way you want! 🚀