URGENT Change Product Tab Font to Custom Font

URGENT Change Product Tab Font to Custom Font

duart2023
Explorer
58 1 22

Hi,

 

I have installed 'Easy Tabs - Product Tabs' app for my product pages & tabs for descriptions, sizing and materials under the custom liquid code - {% render 'product-description-tabs', product: product %} on each product page.

 

Instead of the current 'mono' font, I would like for the heading of each tab to show as my custom font of 'Font-family: 'Resial Bold Condensed'


Website URL: https://duoarthouse.com.au/

Replies 7 (7)

Dan-From-Ryviu
Shopify Partner
9136 1828 1863

Hi @duart2023 
Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings. 

.easytabs-container .easytabs-accordion-item .easytabs-header-text { font-family: 'Resial Bold Condensed'; }

 

- Helpful? Like and Accept solution! ‌Support me: Buy coffee
- Ryviu - Reviews & QA app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

Moeed
Shopify Partner
4892 1292 1566

Hey @duart2023 

 

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>
.easytabs-container .easytabs-accordion .easytabs-accordion-item {
    font-family: 'Resial Bold Condensed' !important;
}
</style>

RESULT:

Moeed_0-1723709175542.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
- Your Coffee Tip and my code, A perfect blend. ❤️
duart2023
Explorer
58 1 22

@Moeed Thank you!! Is there any way to make the headings slightly bigger? 

duart2023
Explorer
58 1 22

Hi @Moeed  Are you able to please confirm if there is any way to make the custom font size slightly bigger in the code above? 

Sangeetanahar
Excursionist
298 19 41

Hellio @duart2023 

Go to online store ----> themes ----> actions ----> edit code ---->Find theme.liquid file...> Add the following code in the bottom of the file above </body> tag

<style>
.easytabs-container .easytabs-accordion .easytabs-accordion-item {
    font-family: 'Resial Bold Condensed' !important;
}
</style>

I have sent you the code, if it works then it works, if not then please message me and I will do it again.

If this was helpful, hit the like button and accept the solution.
Thanks

- Buy me a Pizza

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me -sangeetarahuldhiman@gmail.com - Skype: live:sangeetarahuldhiman -Whatsapp: +917009811712
Checkout Some Free Sections Here
duart2023
Explorer
58 1 22

Hi @Sangeetanahar  Is there any way to make the headings slightly bigger? It appears too small on desktop and mobile view.

duart2023
Explorer
58 1 22

Hi @Sangeetanahar  Just wanted to follow up on the above. I'd love to be able to make the heading font size slightly larger.