Listing Elements¶
These elements display a listing's own data. They're available on Vehicle Details Page (VDP) and Search Result Item (SRI) templates, unless noted as VDP-only. Back to the element index.
Options vs Style
Elements with visual controls split their settings into two tabs below: Options (what the element shows or does) and Style (typography, colours, borders, spacing). Elements with no styling show a single options table.
Listing Title¶
[dms_listing_title] · VDP, SRI - the listing's title.
| Option | What it does |
|---|---|
| Permalink | Link the title through to the listing's detail page. |
| Heading Title | The HTML heading tag, H1-H6 (default H2). |
| Style group | Controls |
|---|---|
| Title Typography | Typography |
Listing Price¶
[dms_listing_price] · VDP, SRI - the listing's price.
| Option | What it does |
|---|---|
| Sold Text | Text that replaces the price with a "sold" banner. Leave blank to always show the price. |
| Show Final Price | Show the final price including this listing's fees and discounts, instead of the base price. |
| Prefix Text | Text shown before the price (e.g. "From"). |
| Inline Prefix Text | Put the prefix and price on the same line. |
| Equal Width | Give the prefix and price equal width. |
| Show Original Price | If the listing has an original price, show both (was/now). |
| Custom Price Text | Text shown when the listing has no price set. |
| Style group | Controls |
|---|---|
| Price | Price Alignment, Price Typography |
| Prefix | Prefix Typography |
| Original Price | Alignment, Typography |
| No Price | Custom Text Alignment, Typography |
Listing Price Table¶
[dms_listing_price_table] · VDP, SRI - a price breakdown table with fees and discounts.
| Option | What it does |
|---|---|
| Table Rows | Build the rows: each has a Row Label, a Row Value (which price/fee/discount to show), an optional bottom border, and a strikethrough option. |
| Hide Repeating Data | If the price and sale price are the same, hide the duplicate price and discount rows. |
| Direction | Stack rows vertically or lay them out horizontally. |
| Gap Between Rows | Spacing between rows. |
| Row Alignment | Vertical alignment of rows when horizontal. |
| Custom Text Condition + Custom Text | When the condition is met, show your custom text instead of the difference and price. |
| Style group | Controls |
|---|---|
| Container | Background, Border, Border Radius, Padding |
| All Rows | Background, Text Color, Border, Border Radius, Box Shadow, Padding |
| Price / Sale Price / Difference Row | Background, Text Color, Border, Border Radius |
| Label | Typography, Color |
| Value | Typography, Color, Spacing Above Value |
| Custom Text | Typography, Color |
Listing Image¶
[dms_listing_image] · VDP, SRI - a single listing image.
| Option | What it does |
|---|---|
| Image Display | How the image is displayed. |
| Image ID | Which image to show by position (1 = first, 2 = second, and so on). |
| Image Size | The image size to use. |
| Image Link | What happens when the image is clicked. |
| Arrow Visibility + Previous/Next Arrow Icon | Show navigation arrows on hover or always, with custom icons. |
| Image Hover Preview Max | How many images a shopper can preview by hovering. |
| Lazy Load Image | Defer loading until the image is near the viewport. |
| Grayscale Sold Image | Show the image in grayscale when the listing is sold. |
| Sold Image Text | Text overlaid on the image for sold listings. |
| Style group | Controls |
|---|---|
| Image | Image Border Radius |
| Arrows | Background Color, Icon Color (normal / hover / active) |
Listing Slideshow¶
[dms_listing_slideshow] · VDP - a slideshow of the gallery images.
| Option | What it does |
|---|---|
| Layout | The slideshow layout (vertical thumbnail rail or horizontal thumbnail strip). |
| Code Image | Show custom-HTML gallery items in the slideshow. |
| Main Image Size / Thumbnail Image Size | Image sizes for the main image and thumbnails. |
| Aspect Ratio | Proportions of the main image frame (3:2, 4:3, 5:4, 16:9, square). The whole slideshow scales to this shape at any width, so the layout stays tidy in wide or narrow columns instead of stretching to whatever the first photo's dimensions are. The thumbnail rail is capped to the frame height and scrolls when the listing has more photos. |
| Show All Photos + Text | Show a "view all photos" thumbnail with custom text. |
| Image Category Filter (Navigation: Category Filter tab) | Show tabs that filter the photos by image category. Only appears when the listing has photos in two or more categories. Choose the position and the "All" tab label, and turn on Show Photo Counts to print the number of photos inside each tab. |
| Style group | Controls |
|---|---|
| Show All Photos | Typography |
Image Category¶
[dms_listing_image_category] · VDP - all images from a single gallery category (e.g. Exterior).
| Option | What it does |
|---|---|
| Image Category | Which gallery category to pull images from. |
| Image Display | How the images are displayed. |
| Image Offset | Skip this many images from the start. |
| Image Size | The image size to use. |
| Show Videos & HTML | Include video and custom-HTML gallery items, not just photos. |
| Autoplay First Video | Start the first video automatically. |
| Navigation | Mouse-wheel scrolling, arrow visibility, and arrow icons/size/buttons. |
| Responsive Display | Slides shown, minimum screen size, and spacing at different breakpoints. |
| Display Caption + Caption Alignment | Show and position image captions. |
| Style group | Controls |
|---|---|
| Image | Fill Image Area, Image Border Radius |
| Pagination | Bullet Width/Height, Anchor, Offset, Border Radius, Colours (normal / active / hover) |
Listing Video¶
[dms_listing_video] · VDP, SRI - the listing's video. No options; it simply outputs the video set on the listing.
Listing Overview¶
[dms_listing_overview] · VDP, SRI - the listing's description/overview text.
| Option | What it does |
|---|---|
| Character Limit | Trim the text to this many characters. |
| Ellipsis | Add a trailing "..." when trimmed. |
| Style group | Controls |
|---|---|
| Typography | Typography |
Listing Info Table¶
[dms_listing_info_table] · VDP, SRI - a table of the listing's category info.
| Option | What it does |
|---|---|
| Hide Blank Values | Skip rows where the listing has no value. |
| Add Colon | Add a colon after each label. |
| Show Category Icon + Colour / Size | Show each category's icon beside its row. |
| Style group | Controls |
|---|---|
| Row | Table Row Border |
| Category | Category Typography |
| Value | Value Typography |
Category Table¶
[dms_listing_categories] · VDP, SRI - the listing's assigned categories and terms.
| Option | What it does |
|---|---|
| Display Categories | Show all categories, or only the ones you choose. |
| Categories | Which categories to show (when not showing all). |
| Number of Columns | How many columns the table uses. |
| Display Style | The table's layout style. |
| Multiple Value Output | How categories that allow several options (like features) are printed: comma separated, or as a list with each option on its own line. |
| No Gap | Remove the spacing between items. |
| Show Category Icon + Colour / Size | Show each category's icon. |
| Style group | Controls |
|---|---|
| Category Label | Label Typography |
| Category Value | Value Typography |
Listing Map¶
[dms_listing_map] · VDP, SRI - a map for the listing's location.
| Option | What it does |
|---|---|
| Location Category | Which category holds the listing's location. |
| Map Height | The map's height. |
Listing Tabs¶
[dms_listing_tabs] · VDP, SRI - the tab bar for the listing's detail tabs (the tabs configured on the inventory type).
| Option | What it does |
|---|---|
| Tab Style | The visual style of the tab bar. |
| Tab Height | The height of the tabs. |
| Style group | Controls |
|---|---|
| Tab | Background, Border, Margin, Border Radius |
| Hover Tab | Background, Border, Border Radius |
| Selected Tab | Background, Border, Border Radius |
| Tab Title / Content | Typography |
| Checkbox List | List Columns, Icon, Icon Colour/Size |
Listing Tab Content¶
[dms_listing_tab_content] · VDP, SRI - the content of a single detail tab.
| Option | What it does |
|---|---|
| Tab Content | Which tab's content to show. |
| Include Title | Show the tab's title above its content. |
| Hide if Empty | Hide the element when the tab has no content. |
| Style group | Controls |
|---|---|
| Title | Title Typography |
| Text | Text Typography |
Listing Badge¶
[dms_listing_badge] · VDP, SRI - the listing's badge(s).
| Option | What it does |
|---|---|
| Style | The badge display style. |
| Position | Where the badge sits. |
Listing Button¶
[dms_listing_button] · VDP, SRI - a button that opens a form or links out.
| Option | What it does |
|---|---|
| DMS Form | The form this button opens (e.g. a "request info" form). |
| Text | The button label. |
| Button Alignment / Fullwidth Button | Align the button, or make it span the full width. |
| Icon (+ colour, size) | An optional icon on the button. |
| Link | Where the button goes when it's a link (supports DMS Dynamic Tags). |
| Modal Window (+ Modal Title, Modal Content) | Open content in a popup instead of navigating. |
| Style group | Controls |
|---|---|
| Button | Background, Border, Border Radius, Padding (normal / hover / active) |
| Typography | Typography (normal / hover / active) |
Comparison Checkbox¶
[dms_listing_comparison] · VDP, SRI - a checkbox that adds the listing to a comparison. Checking it anywhere on the site (VDP, an SRI card in a home page scroller, etc) shows a single floating "Compare" bar in the footer, linking to your comparison page.
| Option | What it does |
|---|---|
| Text | The label shown beside the checkbox. |
| Comparison Page | The page the floating compare bar links to. Leave blank to keep the checkbox without the floating bar. |
| Disable Floating Toolbar | Turns off the floating compare bar sitewide. |
| Style group | Controls |
|---|---|
| Typography | Typography |
Conditional Display¶
[dms_conditional_display] · VDP, SRI - show text based on a condition.
| Option | What it does |
|---|---|
| Condition | The condition to evaluate against the listing. |
| Condition True Text | Shown when the condition is met. |
| Condition False Text | Shown when it isn't. |
Breadcrumbs¶
[dms_breadcrumbs] · VDP - breadcrumb navigation on the detail page.
| Option | What it does |
|---|---|
| SRP Page | The results page the breadcrumbs link back to. |
| Category Breadcrumb Items | Which categories appear as breadcrumb steps. |
| Style group | Controls |
|---|---|
| Style | Style, Boxed Border, Boxed Arrow Colour, Hover Colour |
| Typography | Typography |
SRP Navigation¶
[dms_srp_navigation] · VDP - Previous/Next listing and a "back to results" link. Only shows when the shopper arrived from a Search Results Page.
| Option | What it does |
|---|---|
| Back Link Text | Label for the "back to results" link. |
| Previous / Next Button Text | Labels for the prev/next listing buttons. |
| Viewing Text | The "viewing X of Y" wording. |
| Style group | Controls |
|---|---|
| Container | Background, Padding, Border Radius, Border |
| Back Link | Typography (normal / hover) |
| Position Text | Typography |
| Next/Prev Buttons | Text Colour, Background (normal / hover), Padding, Border Radius |
Next: Search Results Page Elements, Form Elements, or Global & Standalone Elements.