> ## Documentation Index
> Fetch the complete documentation index at: https://strapi-suite.littlebox.pt/llms.txt
> Use this file to discover all available pages before exploring further.

# Slug

> Learn how to create slugs and connect them to the frontend using the API

The slug is a URL that clearly and user-friendly identifies the content of a page.
It’s important because it improves user experience, makes links easier to share, and helps with SEO by allowing search engines to understand what the page is about.

## Settings

**Step 1**: Access the Strapi admin panel.\
**Step 2**: Go to the <i>Littlebox Strapi Suite</i>.\
**Step 3**: Select "Slug".\
**Step 4**: Click "Settings".

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-8.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=ab612e406939b9625b551917340091fd" width="3012" height="1706" data-path="images/slug-add-component-step-8.png" />

**Show language slug**\
Defines whether the default language appears in the URL.
For example, if the default language is `en` and the parameter is set to `false`, the URL will be `domain.com/news`.
If the parameter is set to `true`, the URL will be `domain.com/en/news`.

**Home page**\
Defines which document is used as the home page.
The content of this document is injected into the template defined within it.
Read more about [templates](/backend/guides/page-attributes#template). In the list of slugs, the document set as the homepage will display an identification tag.

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-9.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=05aa1222472949f370e0bed4440f1371" width="2754" height="288" data-path="images/slug-add-component-step-9.png" />

**Home page slug strategy**\
Defines which strategy to use for the homepage slug. The following strategies are available:

* `Language` Every document has a slug. When a document is set as the homepage, the system ignores the slug defined
  for that document and uses the language slug instead. For example, if the document with the slug `/news` is set as the homepage,
  the system does not add the slug for the default language, so accessing the root domain `domain.com` will open it.
  For other languages, the system adds the language slug, such as `domain.com/pt`, which opens the "news" document
  as the homepage in Portuguese.
* `Content` The system uses the slug set in the document assigned as the homepage.

## How to create a slug?

**Step 1**: Access the Strapi admin panel.\
**Step 2**: Go to the <i>Content-Type Builder</i>.\
**Step 3**: Select the collection or single type that will be exposed to the frontend through the API.\
**Step 4**: Click "Add another field to this component".\
**Step 5**: Go to the <i>Custom</i> tab.\
**Step 6**: Select the "Littlebox Slug" field.\
**Step 7**: Fill in the following settings:

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-1.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=86ecd44435923d9c1eb0f3f6886d9a7f" width="824" height="396" data-path="images/slug-add-component-step-1.png" />

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-2.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=ebb86590381a82856ab0c297a9679180" width="826" height="356" data-path="images/slug-add-component-step-2.png" />

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-3.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=0e29f3636b2a2be5a153236a017f5377" width="826" height="352" data-path="images/slug-add-component-step-3.png" />

**Step 8**: Click "Add another field to this component" again.\
**Step 9**: Select the "Text" field.\
**Step 10**: Fill in the following settings:

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-4.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=bf99db4206512ade7594611f869a21a0" width="826" height="499" data-path="images/slug-add-component-step-4.png" />

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-5.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=5323a99c0ed9ae84fe9a99f65ce4e40f" width="825" height="566" data-path="images/slug-add-component-step-5.png" />

The document now includes a slug field.
The slug can be attached to the title field, so it updates automatically when the title changes. To do this, click the icon next to the `Edit` button.

<img style={{ borderRadius: '0.5rem' }} src="https://mintcdn.com/littlebox/-V-36Cf2XSVdHw_h/images/slug-add-component-step-6.png?fit=max&auto=format&n=-V-36Cf2XSVdHw_h&q=85&s=d633f05edf8e2b3892723c16731e8010" width="1164" height="214" data-path="images/slug-add-component-step-6.png" />

When the `Edit` button is clicked and changes are saved, the slug is detached from the title, and the two fields become independent.

<img style={{ borderRadius: '0.5rem' }} src="https://mintlify.s3.us-west-1.amazonaws.com/littlebox/images/slug-add-component-step-7.png%3Fv2" />

## API

### Get data for pages

To get the data from the frontend, use your preferred HTTP client:

```bash theme={null}
curl -X GET "/api/littlebox-strapi-suite/modules/pages?slug=<SLUG>"
```

```json theme={null}
{
    "document": {
        "id": 26,
        "documentId": "i111r5p3pa73r6tm71b7lh86",
        "title": "Littlebox Suite helped me build websites faster",
        "slug": "news/littlebox-suite-helped-me-build-websites-faster",
        "createdAt": "2025-04-13T21:32:18.148Z",
        "updatedAt": "2025-04-13T21:50:12.142Z",
        "publishedAt": "2025-04-13T21:50:12.161Z",
        "locale": "en",
        "localizations": [
            {
                "id": 27,
                "documentId": "i111r5p3pa73r6tm71b7lh86",
                "title": "Littlebox Suite ajudou-me a construir sites mais rápido",
                "slug": "pt/noticias/littlebox-suite-ajudou-me-a-construir-sites-mais-rapido",
                "createdAt": "2025-04-13T21:37:55.693Z",
                "updatedAt": "2025-04-13T22:05:35.160Z",
                "publishedAt": "2025-04-13T22:05:35.185Z",
                "locale": "pt"
            }
        ]
    }
}
```

<Tip>
  The default language won't show up in the URL slug if the `SHOW LANGUAGE SLUG` setting is turned off in the slug module settings.
</Tip>

### Get data for homepage

To get the data from the frontend, use your preferred HTTP client:

```bash theme={null}
curl -X GET "/api/littlebox-strapi-suite/modules/pages/home?properties=attributes"
```

```json theme={null}
{
    "document": {
        "id": 53,
        "documentId": "un6hqh6smm657hwf0n06xm72",
        "title": "Home PT",
        "slug": "",
        "createdAt": "2025-04-14T19:38:34.673Z",
        "updatedAt": "2025-04-14T22:19:21.242Z",
        "publishedAt": "2025-04-14T22:19:21.270Z",
        "locale": "pt",
        "localizations": [
            {
                "id": 59,
                "documentId": "un6hqh6smm657hwf0n06xm72",
                "title": "Home EN",
                "slug": "en",
                "createdAt": "2025-04-14T22:19:29.371Z",
                "updatedAt": "2025-04-14T23:45:50.177Z",
                "publishedAt": "2025-04-14T23:45:50.210Z",
                "locale": "en"
            },
            {
                "id": 61,
                "documentId": "un6hqh6smm657hwf0n06xm72",
                "title": "Home EU",
                "slug": "en-eu",
                "createdAt": "2025-04-15T10:49:50.490Z",
                "updatedAt": "2025-04-15T10:49:51.244Z",
                "publishedAt": "2025-04-15T10:49:51.263Z",
                "locale": "en-EU"
            }
        ]
    },
    "attributes": {
        "template": "default",
        "priority": "0.5",
        "frequency": "weekly"
    }
}
```

<Tip>
  To return the page content, add the value "content": `properties=attributes,content`
</Tip>

<CardGroup cols={2}>
  <Card title="Frontend" icon="code" href="/frontend/introduction">
    Learn how our frontend streamlines integration with Strapi by automating repetitive tasks.
  </Card>

  <Card title="Hosting" icon="code" href="/hosting/plans">
    Explore our hosting solutions for staging and production environments.
  </Card>
</CardGroup>