How to change font size of breadcrumbs on mobile device

Solved

How to change font size of breadcrumbs on mobile device

carla_5
Excursionist
58 0 6

Hi there

 

I am using Dawn Theme. 

 

I would like to change the font size of my breadcrumbs on my mobile device so that can fit into one single line. 

 

I have attached a picture showing what it currently looks like. 

 

If someone can please assist me, thank you. 🙂

WhatsApp Image 2024-04-03 at 11.33.09_114d2208.jpg

Accepted Solutions (2)
Moeed
Shopify Partner
5516 1496 1787

This is an accepted solution.

Hey @carla_5 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

<style>
.breadcrumbs a {
    font-size: 10px !important;
}
</style>

RESULT:

Moeed_0-1712139049289.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Moeed
Shopify Partner
5516 1496 1787

This is an accepted solution.

Above </body> in line number 403 add another </style> then it should be good.

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Replies 9 (9)

Moeed
Shopify Partner
5516 1496 1787

Hey @carla_5 

 

Can you share your Store URL and Password if enabled?

 

Best Regards,

Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


carla_5
Excursionist
58 0 6

Hi there, thanks for the reply.

 

Password: saipru

URL: https://9a0bad-3.myshopify.com/

Moeed
Shopify Partner
5516 1496 1787

This is an accepted solution.

Hey @carla_5 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

<style>
.breadcrumbs a {
    font-size: 10px !important;
}
</style>

RESULT:

Moeed_0-1712139049289.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


carla_5
Excursionist
58 0 6

Hi there, it is still not working on my side. 

Moeed
Shopify Partner
5516 1496 1787

Hey @carla_5 

 

Can you share a screenshot where you added the code?

 

Best Regards,

Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


carla_5
Excursionist
58 0 6

Hi sure 🙂

 

Screenshot 2024-04-03 122116.png

Moeed
Shopify Partner
5516 1496 1787

This is an accepted solution.

Above </body> in line number 403 add another </style> then it should be good.

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications


carla_5
Excursionist
58 0 6

THANK YOU SO MUCH 🙂

Moeed
Shopify Partner
5516 1496 1787

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

- Need a Shopify Specialist? Chat on WhatsApp

- Custom Design | Advanced Coding | Store Modifications