Product Description Element 

What is a Product Description Element?

The Product Description Element in GemPages is a dynamic element designed specifically for product content.

• This element automatically pulls data from the Product Source and displays the corresponding product description.
• It can only be dragged and dropped inside the Product Element.

How to Add the Product Description Element in GemPages

Since this element can only exist within a Product Module, you’ll need to start there:

1. Drag and drop a Product Module from the left sidebar into your page.

You’ll see several default product elements appear automatically (title, image, price, and description).

2. If the Product Description Element was removed or if you’d like to add it again:

• Locate Product Description in the left sidebar.
• Drag and drop it into the Product Module area.

Click on the element to open its Setting Panel on the left side. You’ll see two tabs: Settings and Advanced.

Configure the Settings Tab

The Settings Tab controls how the Shopify product description looks on your storefront.

1. Product Source

Connects the element to the product data from your Shopify store.

2. Text

Customize how your description is displayed:

• Styles: Choose a heading style for the description text.
• Size: Adjust the text size for readability.
• Font: Select the font family to match your branding.
• Color: Change the text color.
• Alignment: Align text left, right, center, or justified.
• Font Weight: Control text thickness (regular, bold, etc.).
• Line Height: Adjust spacing between lines for better readability.
• Letter Spacing: Increase or decrease the spacing between characters.
• Text Transform: Convert text to uppercase, lowercase, or capitalize.
• Shadow: Apply text shadow for extra styling.

3. View More Option

This setting is useful for long Shopify product descriptions, allowing you to collapse or expand content.

On/Off: Enable or disable the ability to expand the description.

Settings if Enabled:

• Text Color: Customize the color of the “Show More” text.
• Max Lines: Define the number of lines displayed before the “Show More” option appears.
• Show More Label: Enter the text for the “Show More” button (e.g., “Read More”).
• Show Less Label: Enter the text for collapsing (e.g., “Read Less”).
• Icon: Enable or disable icons for the labels.

Configure the Advanced Tab

For more advanced customization, please navigate to the Advanced tab and follow the instructions in this article.

How to Change the Product Description?

To update your Shopify product description, follow these steps:

• Go to your Shopify Dashboard > Products, and click on the product you want to edit.

• Edit the product description (you can add text, images, bullet points, etc.) as you prefer.

For example, to add a busted list for the product description, click on the three-dot icon > busted-list icon.

• Click Save to record your changes.

Return to GemPages and click Sync under the Product Source section. The updated description will appear in the Product Description Element.

Best Practices for Shopify Product Descriptions

To make the most of the Product Description element, keep these tips in mind:

• Write clear and detailed descriptions that highlight product benefits.
• Use headings, bullet points, and short paragraphs for readability.
• Include keywords your customers are searching for.
• Add lifestyle or instructional images if relevant.
• Keep the tone consistent with your brand.