Solved

How Can I Use Different Font Sizes In Custom Liquid? (Dawn)

milkandcookies
Tourist
368 0 41

Hi, 

How can I use 18px for the 1st sentence and 12px for the 2nd & 3rd sentences?

 

milkandcookies_0-1707256014635.png

 

https://d10cbe-2.myshopify.com/products/signature-25-pack-pop-box

thanks in advance!

Accepted Solution (1)

StephensWorld
Shopify Expert
1138 124 289

This is an accepted solution.

How to code font sizes: https://www.w3schools.com/css/css_font_size.asp 

 

You'd basically just need to create the text via HTML, but then add classes to each of your paragraphs or headings code. Then you can add some custom CSS to your site so that it knows how big to make the font based on the class being used. 

 

Example HTML:

 

<h1 class="custom-heading">Step 2:</h1>
<p class="custom-text">Pick Quantity</p>
<p class="custom-text">25 50 75</p>

 

Example CSS:

 

h1.custom-heading {
  font-size: 18px;
}

p.custom-text {
  font-size: 12px;
}

 

★ Did my post help? If yes, then please like and accept solution. ★

Hire me for your Shopify project @ stephens.world | support@stephensworld.ca

View solution in original post

Replies 2 (2)

StephensWorld
Shopify Expert
1138 124 289

This is an accepted solution.

How to code font sizes: https://www.w3schools.com/css/css_font_size.asp 

 

You'd basically just need to create the text via HTML, but then add classes to each of your paragraphs or headings code. Then you can add some custom CSS to your site so that it knows how big to make the font based on the class being used. 

 

Example HTML:

 

<h1 class="custom-heading">Step 2:</h1>
<p class="custom-text">Pick Quantity</p>
<p class="custom-text">25 50 75</p>

 

Example CSS:

 

h1.custom-heading {
  font-size: 18px;
}

p.custom-text {
  font-size: 12px;
}

 

★ Did my post help? If yes, then please like and accept solution. ★

Hire me for your Shopify project @ stephens.world | support@stephensworld.ca

manan123
Tourist
76 1 0

Hey can you please help me

I'm using dawn theme for my store but when i chose another variant on product page the buy now button gets disappeared please help me to solve this ....

 

my website url is --- https://mansaroverfurnishings.com/