Streamline Theme - Add ICON to Announcement bar.

Solved
Marvist
Excursionist
17 0 3

Hey Shopify Community

 

I am trying to add a shipping icon to my announcement bar. I have tried to find anything helpful but wasn't successful.

https://barberry-fitness-apparel.myshopify.com/

PW: aoniye


The announcement bar says "Free shipping and returns" and I would like to add a couple of icons there. 


What are the steps to take?

Thanks for your attention. 

0 Likes
PeanutButter
Shopify Partner
330 65 136

Can you describe in a little more detail what you want? 
do you want the icon just next to the FREE SHIPPING AND RETURNS text?
do you have an specific icon you want to use?

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
0 Likes
PeanutButter
Shopify Partner
330 65 136

Is this what you wanted?

Screen Shot 2021-01-25 at 22.54.34.png

I left changes in Streamline By Peanuts v0.2

Let me know what you think

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
Marvist
Excursionist
17 0 3

Thank you for your quick response. 

The font style, font size, spacing between the letters etc. in the announcement bar looks great in Streamline By Peanuts v.02

So to illustrate in detail what the text should say and the icons I would like, I have coded it in the debut theme (I cannot seem to figure out how to do this in Streamline theme). 

 

Announcement bar.PNG

Do you think that would be possible?

Again; thanks so much for your help with this! 

0 Likes
PeanutButter
Shopify Partner
330 65 136

hi @Marvist sorry, I have been really busy the last days.  Do you still need this done?

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
0 Likes
Marvist
Excursionist
17 0 3

Hi @PeanutButter 

Yes please! 

0 Likes
PeanutButter
Shopify Partner
330 65 136

ok! will try to get this done tomorrow!

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
0 Likes
PeanutButter
Shopify Partner
330 65 136

@Marvist I have a question about the image you sent with what you want.  How would that show in mobile? The 3 texts with 3 icons are not gonna fit in 1 line in mobile

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
0 Likes
Marvist
Excursionist
17 0 3

@PeanutButter That is a very good question. 

I think there may be two solutions.

1. (best solution, but maybe difficult to code?) announcement bar as in attached photos, where the text and the icons are switching every 2 seconds. 

2. remove/hide the announcement bar in the mobile version. 

What do you think?

 111.PNG112.PNG113.PNG

0 Likes
PeanutButter
Shopify Partner
330 65 136

hi @Marvist,

your themes uses Slick Carousel for the slideshow, which can be used for looping the the Announcement bar messages in mobile.

I will try implement this for you over the weekend

 

Peanut Butter Collective | Shopify Experts
- Was my reply helpful? Please Like and Accept Solution.
- Want to customize and improve your store? Hire us.
- Feel free to contact me us hello@peanutbutter.es
0 Likes