# Articles Slider {% embed url="" %} The **Articles Slider** section turns your blog articles into an engaging, swipeable carousel that draws attention and keeps visitors scrolling. Pick any blog from your store and it'll automatically pull in up to 16 articles, then display them in a smooth slider that shows multiple cards at once (you can set exactly how many appear on desktop, tablet, and mobile—even using decimals like 4.5 to create that "peeking" effect that encourages scrolling). The slider comes with optional navigation arrows that you can position above or below the content, plus you can add an optional heading at the top, enable autoplay with custom timing, make it loop seamlessly, or allow visitors to drag through articles on touch devices. All of this is fully customizable through the Theme Editor—no coding needed—and it works perfectly with any Shopify 2.0 theme like Dawn or Horizon. It's ideal for showcasing featured blog posts, highlighting recent articles, or creating any content marketing section where you want that dynamic, interactive browsing experience that gets people engaged. ### Setup Instructions {% stepper %} {% step %} **Install the App** Visit the Shopify App Store and install Flexi Slider Sections. Start your free trial to access all features and sections.
{% endstep %} {% step %} **Install Section** Open the Flexi app and navigate to the sections library. Search for "Articles Slider" and click "Add to Theme" to install it instantly.
{% endstep %} {% step %} **Add to Your Store** Go to your Shopify admin → Online Store → Themes → Customize. Click "Add section" and select "Articles Slider" from the available sections.
{% endstep %} {% step %} **Set Section Width** In the section settings, choose your preferred layout: * **Full width**: Spans the entire page width * **Fixed width**: Set a custom maximum width (320px - 1440px) * **Theme width**: Use your theme's default container width
{% endstep %} {% step %} **Add Content** Click "Add block" to add product groups. Each group can contain multiple products with customizable layouts including titles, prices, images, and buttons. {% endstep %} {% step %} **Customize & Style** Fine-tune your slider with the built-in settings: * Adjust background colors or add background images * Control spacing and padding * Set slider behavior (auto-play, loop, arrows) * Customize typography and colors {% endstep %} {% endstepper %} {% hint style="info" %} #### Why Use Flexi Sections? **Designed to Feel Native**\ Flexi sections are built to inherit your theme’s structure and styles, so they blend in naturally instead of feeling bolted on. Spend less time overriding CSS and more time shipping polished layouts that feel intentional. **Prebuilt, Not Prescriptive**\ Each section provides a production-ready foundation without locking you into rigid layouts. Configure content, spacing, and structure to match your client’s needs—without rebuilding the same patterns from scratch. **Theme-First Customization**\ All styling and layout adjustments happen through the Shopify Theme Editor. Tweak typography, spacing, alignment, and behavior using familiar theme controls, just like native sections. **Built for Performance & SEO**\ Flexi sections are optimized for real storefronts, not demos. Lightweight markup and thoughtful defaults help keep pages fast, stable, and search-friendly across devices. **Works Across Any Shopify Theme**\ Flexi sections work with any Shopify 2.0 theme, including Dawn, Horizon, and custom builds. Test safely on duplicate themes and ship with confidence. **Easy to Maintain Over Time**\ Once a section is in place, it’s easy to manage. Update content, swap images, or adjust layout directly in the Shopify admin—no fragile custom code or one-off fixes to maintain later. **Built for Reuse Across Projects**\ Flexi is designed for builders shipping real work. Reuse the same section patterns across client projects to stay consistent, move faster, and avoid unnecessary technical debt. {% endhint %} --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://flexi-library.gitbook.io/flexi-slider-sections/sections/blog-articles/articles-slider.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.