> For the complete documentation index, see [llms.txt](https://helpdesk.smaply.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://helpdesk.smaply.app/journey-maps/cards/how-to-use-slider-cards.md). # How to use slider cards A slider card holds one or more sliders, each a handle on a track between two end labels you set, so you can show where a step lands between, say, Unhappy and Happy, or Low effort and High effort. Add more than one to keep related ratings for the same step on a single card.

One slider card holding two sliders. The first, titled Sentiment, has its handle a little past the middle between Unhappy and Happy. The second, titled Perceived effort, has its handle left of centre between Effortless and Hard work. — A slider card holding two sliders

To add one, hover an empty cell and click **+ Add card**, then choose **Slider**. **Slider** sits under **BASIC CARDS** in the picker. A new slider card starts with a single slider, no title, empty labels, and its handle at the middle of the track. Cards created before this change keep their original handle position, which is why an older slider card in the same lane can still show its handle at the far left.

Three slider cards in a Sliders lane. The left card holds two sliders, Sentiment and Perceived effort. The middle card is an older empty slider with its handle resting at the far left of the track. The right card is a newly added slider with its handle at the middle of the track and no title or labels set yet. — A newly added slider starts at the middle of the track

*** #### How to add and edit sliders A card's sliders are configured from the toolbar, not the card details panel. Each slider has its own title and its own pair of end labels. {% stepper %} {% step %} **Open Edit sliders** Select the card and click **Sliders** on the floating toolbar.

A selected slider card holding one slider titled Sentiment, with its floating toolbar showing Display and Sliders buttons, followed by card header, fill, show card details, delete, and overflow. — Display and Sliders on the slider card toolbar

{% endstep %} {% step %} **Fill in each slider's title and labels** The **Edit sliders** popover lists the card's sliders. Type into **Slider title** to name what it measures, and into **Start label** and **End label** to set the text at the left and right ends of that slider's track.

The Edit sliders popover with one slider: a Slider title field reading Sentiment, and Start label and End label fields reading Unhappy and Happy, with an Add slider link below. — Edit sliders, with one slider configured

{% endstep %} {% step %} **Add more sliders, reorder, or delete** Click **+ Add slider** to add another. Use the drag handle at the left of a slider's row to reorder it, which also reorders the sliders on the card face. Each slider gets its own delete control once the card holds two or more, so you can always remove one without leaving the card empty. A card needs at least one slider.

The Edit sliders popover with two sliders, Sentiment and Perceived effort, each with a drag handle and a delete icon, and an Add slider link below. — A delete icon appears per slider once there's more than one

{% endstep %} {% endstepper %} There's no numeric scale or point count to configure for a slider: each one is a single handle between the two labels you set. *** #### How to choose a display style Click **Display** on the floating toolbar to switch how every slider on the card renders. The style applies to the whole card, not per slider: * **Standard** - a filled track with a round handle * **Dot** - an empty track with a square marker * **Progress** - a filled bar with no handle

The Display menu open with three options: Standard, Dot, and Progress. Standard is selected. — Display: Standard, Dot, or Progress

The same two-slider card rendered in Dot style: each slider shows an empty track with a small square marker at the value, no fill. — The same card in Dot style

The same two-slider card rendered in Progress style: each slider shows a filled bar with no handle, ending where the value sits. — The same card in Progress style

*** #### How to set a slider's value Drag a slider's handle along its track to the point that represents the step. The handle only responds to dragging while its card is selected, so click the card first if a drag doesn't seem to do anything. Each slider's position saves as you go and moves independently of the others on the same card. *** #### What slider cards share with other cards The sliders, their titles, labels, and display style are what's specific to a slider card. Everything else on it is shared with every other card type: * Accent colour, background style, and card header (the fill control and the buttons after it on the toolbar) * Duplicate, expand, shrink, and delete from the three-dot menu * Multi-select with Shift+click * Card details panel for personas, tags, and comments

The slider card details panel showing only the universal Personas, Card tags, and Comments (0) sections. — The details panel holds the universal sections only

See [How to add and edit cards](/journey-maps/cards/how-to-add-and-edit-cards.md) for the canonical walkthrough of these mechanics. *** #### Related topics

Title	Description	Target
How to add and edit cards	Parent how-to for shared card mechanics: toolbar, details panel, colours, and headers.	/pages/DI00pTOdaJmOwltHKgIa
How to use text cards	Add narrative notes alongside a rating and format the text.	/pages/icqgg4Jls9Iv7VWRvRls
How to use stage cards	Mark the phases of a journey that your sliders score against.	/pages/YeVZqUkvqujOSrFxYHsT
How to add and manage lanes	Add a lane to hold your slider cards, or any other lane type.	/pages/cEW7pumNPGKdJ65EEAz7
How to bulk edit cards	Select multiple cards and apply tags, personas, or colours in one go.	/pages/D239Y2x0Gzcz0VuWHA1p

--- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## 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, and the optional `goal` query parameter: ``` GET https://helpdesk.smaply.app/journey-maps/cards/how-to-use-slider-cards.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. 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.