Article Title Element

About Article Title Element

The Article Title Element is used exclusively within the Article List Element. It allows you to present the titles of blog articles with various styles and interaction options.

Whether you want to display full titles, truncate them to a specific number of lines, or enhance SEO with proper HTML tags, this element offers all the necessary settings.

How to Add an Article Date Element to Your Page?

Step 1: Access the GemPages Dashboard > Pages, then click on your target page to locate the editor.

Step 2: From the left sidebar, search for the Article Date Element and drag & drop it to the preferred position on your page.

Step 3: Click on the element to open its settings for further customization.

Configure the Article Title Element Settings tab

The Article Title Element comes with multiple customization options to match your design and functional needs:

Article Source

Click on the box to configure the article sources in the Article List element.

Text style

Configure the button text your way, including:

• Style: Choose the heading
• Font: Select a font style that matches your brand identity.
• Size: Adjust the font size to make the heading prominent.
• Color: Pick a color that complements your design.
• Align: Adjust your text alignment to left, center, right, or justify.

Click Show more to expand the full settings in the Text style section:

• Font Weight: Control how thick or thin the text appears.
• Line Height: Adjust the space between lines for better readability.
• Letter Spacing: Create a more modern or compact look by changing the space between letters.
• Transform: Convert the text to uppercase, lowercase, or capitalize the first letter of each word.
• Shadow: Add a text shadow to give your headings depth.

Effect

Hover: Change the text’s color when your users hover over the title for a dynamic and interactive effect.

Link

By default, in the Link section, the after-click action is set to “Go to article”. You can change it to “Scroll to” and insert the target section as preferred. 

Display option

Control how much of the article title is displayed.

• Yes: Limit the title to a specific number of lines. This is useful for maintaining a clean layout with long titles.
• No: Display the full title without any truncation.

SEO

HTML Tag: Optimize your page’s SEO by selecting the appropriate HTML tag for the title.

• H1–H6: Use semantic heading structure to improve search engine rankings.
• Div: For non-semantic purposes, the title doesn’t need to be indexed as a heading.

Configure the Advanced tab for the Article Date Element

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