> For the complete documentation index, see [llms.txt](https://docs.themeupstudio.com/travio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.themeupstudio.com/travio/custom-pages/destinations-page.md).

# Destinations Page

Live preview: <https://travio.themeupstudio.com/destinations/>

This guide explains how the Destinations page works, what data it uses, and how to customize it.

### Route and Template

* URL: `/destinations/`
* Route source: `routes.yaml`
* Template file: `destinations.hbs`
* Page data source: `data: page.destinations`

Create a Ghost page with slug `destinations` so page header/title content can render correctly.

<div data-with-frame="true"><figure><img src="/files/B84p4lXyVCmUXmlrZjhM" alt=""><figcaption><p>Destinations page content source</p></figcaption></figure></div>

***

### What the Destinations Page Does

The Destinations page is a curated taxonomy directory based on your custom destination slug list.

It includes:

1. Page header (from `page.destinations`)
2. Grid/list of destination cards
3. Tag image or initials fallback
4. Post count per destination
5. Pagination / Load More behavior
6. Bottom CTA section

***

### Core Setting That Powers This Page

#### @custom.destinations (Theme → Site Wide)

This is the primary controller for `/destinations/`.

* Type: comma-separated tag slugs
* Example: `paris,tokyo,bali,rome`

Only tags listed here are treated as destination taxonomy for this page and related destination UI across the theme.

If this setting is empty or slugs are invalid, destination cards may not render as expected.

<div data-with-frame="true"><figure><img src="/files/MiV7KWWd97Scd21qDYN2" alt=""><figcaption><p>Destination tag slugs in settings</p></figcaption></figure></div>

***

### Data Source and Card Content

Destination cards are built from Ghost tags matching `@custom.destinations`.

Each card typically uses:

* Tag name
* Tag feature image (if available)
* Fallback initials if image is missing
* Tag post count
* Link to tag archive (`/tag/{slug}/`)

***

### Template and Card Structure

* Main template: `destinations.hbs`
* Card partial: `partials/cards/card-destination.hbs`

If you want to customize visual style (overlay, image ratio, count placement, typography), edit `card-destination.hbs`.

***

### Pagination / Load More

Destinations page supports progressive loading.

Behavior:

* Initial set is rendered from server response
* Load More fetches and appends additional destination cards
* End state shows localized “No more destinations” text

***

### Relationship with Other Pages

The destination taxonomy list affects multiple areas, not only `/destinations/`:

* Homepage destination section
* Header destination dropdown
* Archive/article/author/videos filter options
* Tag archive variant logic (`tagDestination` context)

So keep this list clean and intentional.

***

### Best Practices for Destination Setup

1. Use stable, readable slugs (`new-york, south-korea, etc.`)
2. Add feature images for all destination tags
3. Keep destination tags purely geographic (avoid mixing experiences/general tags)
4. Remove deprecated destination slugs from custom setting to avoid empty cards
5. Ensure destination tags are actually assigned to posts

***

### Common Issues

* No destination cards: `@custom.destinations` is empty or slugs don’t match real tags.
* Cards show initials only: destination tags are missing feature images.
* Counts look too low: destination tags are not widely assigned to posts.
* Header text missing: `destinations` page slug not created.
* Pagination stops quickly: total matching destination tags is small.

***

### Quick Setup Checklist

1. Create page slug `destinations`
2. Populate `@custom.destinations` with valid tag slugs
3. Add feature images to destination tags
4. Tag relevant posts properly
5. Test `/destinations/`, load more, and card links to `/tag/{slug}/`