Skip to main content

Articles

With the Featured articles section (which you can find in the list under the preset 'Blog articles'), you can easily display the newest or most important posts from your blog in an attractive slider. Please note: this section is specifically designed to be used on the Homepage. This is the perfect way to share your expertise and inspire visitors as soon as they enter your webshop.

General Layout & Background​

You can fully style the background and the frame of this section to your liking:

  • Color scheme: Choose a fitting color scheme for the background and text color of the section.
  • Section display (Type): Determine whether the background spans the full width of the screen (Full width / Edge-to-edge) or if the whole is placed in a neat frame (Box / Container).
  • Height & Background height: Choose whether the section automatically grows with the content (Auto) or work with a fixed height (Fixed). If you choose a fixed height, you can use a handy slider to set the percentage (0-100%) the background color covers. You can set this separately for desktop and mobile, which is ideal for creative overlapping designs.

Spacing (Whitespace)​

Ensure the section perfectly aligns with the rest of your homepage:

  • Margin (Outer space): Manage the distance directly outside the section at the top and bottom.
  • Padding (Inner space): Manage the distance inside the section for the top and bottom.

For each setting, you can choose between the default spacing of the theme, or remove this space completely (None).

Source & Slider Settings​

Here you determine which articles are shown and how the visitor can browse through them:

  • Select blog: Link the specific Shopify blog (for example "News" or "Inspiration") from which the articles should be fetched.
  • Number of slides (Slides per view): Determine exactly how many article cards are visible at the same time. You can fine-tune this specifically for:
    • Desktop: Choose 3, 4, 5, or 'auto'.
    • Tablet & Mobile: Choose full or 'half' views here (such as 1.5 or 2.5). A half view is a well-known design trick to subtly show visitors that they can swipe further.
  • Display options: Enable pagination (the clickable dots below the slider), let the cards playfully alternate up and down (Alternate offset), or determine whether the slider can fall outside the container frame (Carousel overflow).

Text & Buttons​

Guide your visitors with a clear introduction and action buttons:

  • Text & Alignment: Enter a title and an accompanying text. You can adjust the size, font weight, and the HTML tag of the title. Then determine whether you want to align these texts left, centered, or right.
  • Action buttons (Buttons): You can place up to two buttons below your text (e.g., "Read all articles" and "To the shop").
    • For both buttons, you can set your own text, a link, and an optional FontAwesome icon (such as an arrow).
    • Check Secondary button style to give the button an outlined, transparent appearance instead of a fully solid colored button.
    • Do you only want one button or no buttons at all? Then simply leave the text fields empty.