8 Simple Steps to add Shipping Truck Icon in the Announcement Bar in Shopify - Made4uo - Great Gift Deals
WOW Shopify with AI
files/Channels_-_Growth_Social_Static_Affiliates_Affiliates-Merchants__320x480_7724dbcb-6bd4-46ed-8a59-93eb2012e8b0.png

8 Simple Steps to add Shipping Truck Icon in the Announcement Bar in Shopify

See Other Products

Hi, 

Follow the steps below. No need to have coding experience.

 

 1. Go to Shopify (make sure you are in admin). Then Online Store > Themes > Actions > Edit Code

2. Open theme liquid

3. Find the end of the head. It should be like this "</head>"

4. Place the code right above the "</head>"

 <script src="https://kit.fontawesome.com/f7cf0a6419.js"></script>


//place this script above the closing head tag
</head> // <---- This is the ending head tag

5. Then, open the Section folder and click header.liquid

6. Find announcement-bar__message

7. Replace this code:
<p class="announcement-bar__message">{{ section.settings.message_text | escape }}</p>

To this code:

 <p class="announcement-bar__message"><i class="fas fa-shipping-fast"></i> {{ section.settings.message_text | escape }} </p>



You should also replace after the "endfor" code with this code

{% endfor %}<p class="announcement-bar__message"><i class="fas fa-shipping-fast"></i> {{ section.settings.message_text | escape }} </p>

8. Click SAVE both the theme.liquid and the header.liquid

 

Click if you want different icons.

 

Let me know if you have questions and I will try to answer. 

 

Thank you!!!(",)

 

Copied!
Back to blog

2 comments

hello in my shopify store in the header I can’t find announcement but there is a special section called announcement.liquid is the procedure the same?

simone

Hello! Thank you so much for making these videos. I am a real noob, but managed so easily to use your content!

I was wondering if you know how to connect products – i will explain.
I have the same necklace in gold and silver. I want both of the variants to appear on both “necklesses” and “all jewelry” in the menu. At the same time I want to show both options when entering one of the products. So when you press gold, you will only see photos of gold, and the info for gold, and when pressing silver, the oposite.

I hope I explained my self ok.

Crossing fingers that you can help!

Thank you so much :-)

Vilde F

Leave a comment