How to change the font of my product title only on product page

[hushbug]

Hi,

I uploaded my own font to my assets and would like it to be the font of my product title on all of my product pages. I would also like to change the header menu + dropdown to the same font (every other page shows the menu with the correct font except for my product pages).

Here is my website. I’m using the Colorblock theme.

[PageFly-Victor]

Hi

This is Victor from PageFly - Shopify Page Builder App

It will require some custom code to be added to your theme.liquid file to accomplish this

In case you want to change the font style for the product title on the product page only, please use this code

{% if template.name == 'product' %}

{% endif %}

The code above only triggers when it is a product page

Hope this can help you solve the issue

Best regards,

Victor | PageFly

[GemPages]

Hello @hushbug ,

Glad to support you today.

To can change the font on the Header menu, dropdown and Product title, you can check out my suggestion below to make it:

1. Go to Edit code on Online Store:

2. Add my code above the tag on file Theme.liquid:

{% if template.name == 'product' %}

{% endif %}

I hope you find the answer helpful. If you need further support, do not hesitate to reach out to us.

Kind & Best regards,
GemPages Support Team.

[Litos]

Hi @hushbug ,

Please go to theme.liquid file and add code here:

Code:

@font-face {
        font-family: 'Chomsky';
        src: url({{ 'Chomsky.woff' | asset_url }}) format('woff2');
        font-weight: normal;
        font-style: normal;
        font-display: swap;
}

it will help you to import font face, then you can call it at base.css file

Hope it helps!

[ZestardTech]

Hello there,

1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset >base.css and paste this at the bottom of the file:

.product__info-container .product__title h1 {
    font-family: 'Malabar';
}