How can I change the font of the top Caption in the "Image with Text" Section?

[aliebn]

In the Image with Text section, how can I change the font of the top Caption? 

See image below as reference; the text I want to change is highlighted in the blue box. Right now, I can change it to either "subtitle" or "uppercase" format as provided in the template, but I can't change the font. I also want to space the text a bit higher since it sits too close to the Heading. 

Is this possible? 

[jonrin0213]

Hi @aliebn 

Please share your store URL so that I can find the solution.

[rifat_ShopiDevs]

Hi,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
.image-with-text__text--caption {
    margin-bottom: 10px !important;
    font-family: your font family !important;
}
</style>​

if you share store url then i can add font family here

Hope this can help you also, don't forget to Like it and Mark it as Solution!

Best Regards,

Rifat

[Made4uo-Ribe]

Hi @aliebn 

Would you mind sharing your store URL? Thanks!

[Vinsinfo]

@aliebn Please follow the below steps to change the font of the top caption in the "Image with text" section in the dawn theme. Let me know whether it is helpful for you.

1. From admin go to "Online Store" -> "Themes".

2. Click "Edit code" button from the current theme.

3. Go to "component-image-with-text.css" file and paste the below code in the bottom of the file.

.image-with-text__text--caption {
  font-size: 20px;
  margin-bottom: 12px;
  font-family: serif;
}

FYI: Adjust the font size, font family and margin-bottom values as per your need.

If the solution doesn't works for you, please share your store URL to check further.

Result will be like,

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

[PageFly-Amelia]

Hi @aliebn 

This is Amelia from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code. 

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

.caption-with-letter-spacing--medium {

    font-family: 'Inter' !important;

    font-size: 20px !important;

}

Hope that my solution works for you.

Best regards,

Amelia | PageFly