[V6] (C) Desc Element

About the (C) Desc Element

The (C) Desc element is a child element of a Collection page and only works as part of a Collection page. This element helps synchronize the collection description between your Shopify admin and the GemPages dashboard.

Add the (C) Desc Element to Your Collection Page

From the GemPages dashboard > Collection Pages, open the template you want to edit. You can find the (C) Desc element on the left side-bar of the Editor, under the Collection section, or you can search for it directly from the Search bar.

Down below are the steps to add the (C) Desc Element to your collection page:

Step 1: Select a collection you want to feature. From the settings of the Product List element, click on Pick a collection and choose one from the pop-up list.

Alt text: Pick a collection you want to feature on your GemPages dashboard
Step 2: In the settings tab of the Product List element, turn on the dynamic product listing to enable automatic data synchronization.

Step 3: Drag and drop the (C) Desc Element from the left sidebar to your preferred position on your collection page.

Click on the element to view its configurations in the left sidebar, including Settings and Design tabs. There, you can make changes to the typography, alignment, extra class name, and design of the element.

Configure the Settings Tab

1. Typography

You can determine the display of the text inside the input field.

• Text Styles: There are two options you can select from the dropdown menu: Custom or Set up Global Styles. If you choose the former, you can scroll down and further customize the typography. If you choose the latter, the text styles will follow your settings in the Global Styles feature.

• Font Size: Use the slider or input your preferred size in pixels.
• Line Height: Use the slider or input your preferred line height in pixels
• Letter Spacing: Use the slider or input your preferred letter spacing in pixels

• Text Color: Enter the code of the color that you want to apply to your text..
• Font: Choose a font from the dropdown menu or click on Open Font Manager to explore more font options. In case you want to add a custom font, check out this guidance.
• Text Transform: Transform the text to Uppercase, Lowercase, or Capitalize. Or select None to uncapitalize all your text.
• Font Style: Transform the text to Bold, Italic, or Underlined. You can apply all of these styles to your text simultaneously.

2. Alignment

This parameter allows you to determine how the element is positioned on your page. There are three options to choose including: left-aligned, centered, and right-aligned.

3. Extra class name

This section is exclusively designed for developers or tech-savvy users. If you wish to further customize the element with coding, please use this field to add a class name and refer to it in the CSS file.

Configure the Design Tab

To style how the element looks, please navigate to the Design tab and follow the instructions in this article.

And that’s pretty much it. Remember to Save and Publish your page to apply the updates to your live store.