How to customize Product title element

📖 In this article, we are going to learn more about what is Product Title element and how to use to work with its elements to make your product list look just the way you want it to.

âš  This article only works for Boost AI Search & Discovery V3 new Theme settings. To find out which version of our app your store's current theme is installed with, please follow this article.

On this page

About product title element

Product Title is a mandatory element to display for your product. Most themes will have this element added by default. For example:

How to edit Product Title element

How to access Product Title’s settings

  1. From the app's admin, go to Integration menu > select Shopify Integration > Find [Target Theme] > Select Edit Visual Design.

  1. Under the General settings section > Select Product Item section.
  2. Click the Dropdown icon of Product Item section > Select Product Information section > Select Product title.
  3. Drag and drop the Product title and then start using it.

Styling configuration

Color

Color settings - this parameter allows you to choose the color for the text, background, or border.

Open the color picker, click the color swatch for the content type color you want to change.

  • To set a specific hex color code, click on the text field to enter the color.
  • To set the color to transparent, click the icon ˆ to change to the rgba code format, and then change the value of the 'a' in ‘rgba’ code to 0.

Click Save button to save all the changes you have made.


Font

The changes you make on this Font setting is implemented into your Theme’s code, however, if they do not reflect on our editor’s Preview, there could be two reasons:

  • Your Shopify Store’s Theme settings > Typography does not have the font added.
  • Your browser/device does not have the font installed.

For further information and support on this matter, please visit this article or contact our support team at support@boostcommerce.net.

  • Font family: You can change the font family for your text label from the drop-down list. We are using the Shopify Library Font.

With every font, you can configure the following parameters:

  • Font style: Select your preferred font style from the drop-down list
  • Font size: Use the slider or input your preferred size in pixels

For example:

Click Save button to save all the changes you have made.


Text

Text transform: You can change the text transform here. There are 4 options to choose including:

  • - : None
  • AG: Uppercase
  • ag: Lowercase
  • Ag: Capitalize

Click Save button to save all the changes you have made.


You can check more information about the STYLING tab here.

Tutorial video

Watch our tutorial video to learn how to customize the Product Title element:



If you need any further assistance, please do not hesitate to contact us at support@boostcommerce.net.