Product Title into two lines with different font size. Debut Theme

Store Design
1

Hi all,

Is there a way to split the Product Title into two lines that have different size fonts?

The top line with the larger text and the second one even a little smaller than in the example attached?

I’m getting stuck on design issues when I need to be adding products, so any help would be really appreciated.

DeeJay

2

@DeeJay

Please share your store URL!

Thanks!

3

Hi @DeeJay ,

It’s not good if you just use the title, you can change it with metafield. Just follow these steps:

Step 1: Go to Settings > Metafields > Products > Add definition. https://i.imgur.com/CXoetyE.png

Step 2: Setup the information you want and select “Content type” as text. https://i.imgur.com/Q4QIVuj.png

Step 3: Copy the code and paste it under each product item in the collection. https://i.imgur.com/cISZXE6.png
Ex: {{ product.metafields.my_fields.subtitle }}

Step 4: Go to products and enter information. https://i.imgur.com/d13bONa.png

Then you can use subtitle as a title in the 2nd line.

Hope it helps

If you find my answer helpful for you, please mark it as a solution. Thank you so much

4

@LitExtension Thanks for your help on this.

I successfully got to add a line of text in the product page metafield but its not showing up on the published page so I must have missed a step.

DeeJay_0-1631015332866.png
DeeJay_0-1631015332866.png822×256 6.79 KB

It’s there in the metafield but not coming up on a preview - not under the Title or in fact anywhere on the page.

5

Hey @DeeJay .

Thanks for reaching out.

I appreciate the screenshots that you have added to your post as that is super helpful! Looking into the Debut theme, we may be able to allow our internal themes team to take a closer look at this customization. As the Debut theme is designed and supported by Shopify, we can use free design time for Shopify themes to see if we can make Product title display with two lines with different font sizes.

Since we cannot authenticate you for the store in question over our public forums. I would suggest reaching out to a Support Advisor by logging into your store through our Contact Us page. This will allow us to securely verify you as the store owner before discussing the changes you would like to see on the store.

Let me know if you have any additional questions.

6

Thanks for this Ollie. I appreciate the advice and will follow up on that lead.

Dee Jay

7

Hi Ollie,

I’ve done several circuits of Shopify help, but can’t seem to locate where to access a support advisor or the free design time. Can you provide some direction.

Dee Jay

8

Hi @DeeJay ,

Go to sections/product-template.liquid file, find ‘product-single__title’ and add code here: https://i.imgur.com/7kBY42V.png

Ex: {{ product.metafields.my_fields.subtitle }} => add code: https://i.imgur.com/sK5VysV.png

Hope it is clear to you.

If you find my answer helpful for you, please mark it as a solution. Thank you so much and good luck,

9

Hey @DeeJay .

Thanks for the quick response!

Once you successfully login to the store using our Contact Us page, you will directed to the Help Center. You can then type in the search bar what you would like assistance with. Once you hit enter, you should be able to located the Get Support option below the search results.

Let me know if you have any additional questions.