Skip to content

component

CMS Tag Rail

By ulz song

Details

Summary

CMS Tag Rail lays a collection along one horizontal track of fixed-ratio cards and narrows it with tag chips: a chip press swaps a class, hidden cards leave the track and the rest…

Description

CMS Tag Rail lays a collection along one horizontal track of fixed-ratio cards and narrows it with tag chips: a chip press swaps a class, hidden cards leave the track and the rest close up. Scrolling is the browser's own — a drag, a sideways wheel, or arrow keys on the focused track — and every card snaps to the left edge; side arrows nudge it and a dot per group jumps there. Pick several tags at once and choose whether a card carries any of them or every one; each chip carries its count, a polite line reads the total showing, and a slot per card binds a CMS collection. - **One snapping track.** Cards ride one row and snap to the left edge. - **Three ratios.** Square, 4:5 or 16:9 sets every built-in card face. - **Chips that stack.** Several tags stay on at once, matching any or every tag. - **One class swap.** A chip press swaps classes; the rest is CSS. - **Counts on the chips.** Each chip carries its count; a line reads the total. - **CMS slots.** One slot per card binds a collection; a slotted card keeps its height. - **Arrows, dots and keys.** Arrows nudge the track, dots jump to a group, keys move it. - **Styled by you.** Cards per view, peek, gap, radius, font, colours, size and labels. What you control • Items as an array: title, caption, tags as a comma list, image with alt text, link and a tint for the empty face • Card slots for the CMS path, paired one to one with the items • Cards per view, peek, ratio, gap, radius, match mode, initial tags, the All chip, arrows and dots • Font, five colours, text size, max width, alignment, the count wording, the placeholder lines and labels Limits: one rail per section, one ratio for the built-in card faces (a slotted card keeps its own height), images from your project or CMS, and about eighty cards.

Introduction

Snap carousel filtered by chips

Rank history

Daily rank per list, from the first snapshot — lower is better.

110012001300130389/89/99/119/139/15
  • All · #2158