Solved

Edit blog tags in Brooklyn theme

prettyflacko
Tourist
6 0 2

Hey guys,

I am using tags on my blog to credit the authors of the images that I download from various sources to support my articles.  Unfortunately, the tags look horrible, especially in mobile view. 

  • When I copy paste the necessary content for crediting authors, the tags are displayed in capital letters only. How can I avoid that?
  • Also, is there any way to align these tags to the left?
  • And last but not least, how can I adjust the font size? At the moment they are way too big and it's a distraction.

Please see attached image on how they look in mobile view right now.

Thanks for your help in advance!

IMG_9330.PNG

Accepted Solution (1)
diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@prettyflacko, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

 

.tags--article *{
    font-size: 15px !important;
}

@media (max-width: 767px){
    .tags--article *{
        font-size: 14px !important;
}
}

.tags--article{
    text-align: left !important;

}

.tags--article a{
    text-transform: unset !important;
}

@media (max-width: 767px){
    .tags--article li{
        display: block;
    overflow-wrap: break-word;
}
}

 


You can adjust the values as per your wish:

15px = font size on desktop
14px = font size on mobile

Please let me know whether it works.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

View solution in original post

Replies 4 (4)

LitExtension
Shopify Partner
4860 1001 1132

Please send your site and if your site is password protected, please send me the password. I will check it for you

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify
prettyflacko
Tourist
6 0 2

www.evidentstreetwear.com.au

password: kietha0912

Thank you in advance!

diego_ezfy
Shopify Partner
2935 562 883

This is an accepted solution.

@prettyflacko, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

 

.tags--article *{
    font-size: 15px !important;
}

@media (max-width: 767px){
    .tags--article *{
        font-size: 14px !important;
}
}

.tags--article{
    text-align: left !important;

}

.tags--article a{
    text-transform: unset !important;
}

@media (max-width: 767px){
    .tags--article li{
        display: block;
    overflow-wrap: break-word;
}
}

 


You can adjust the values as per your wish:

15px = font size on desktop
14px = font size on mobile

Please let me know whether it works.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

prettyflacko
Tourist
6 0 2

It worked perfectly, thank you so much!!