# (Squarespace) Add an additional text under Navigation Text

**URL:** <https://community.elfsight.com/t/squarespace-add-an-additional-text-under-navigation-text/45979>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [April 2, 2024, 2:22pm UTC](https://community.elfsight.com/t/squarespace-add-an-additional-text-under-navigation-text/45979 "2024-04-02T14:22:52Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [April 2, 2024, 2:22pm UTC](https://community.elfsight.com/t/squarespace-add-an-additional-text-under-navigation-text/45979/1 "2024-04-02T14:22:52Z")

</div>

Suppose you want to add some additional text under Navigation, like this:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/3/8/38a69508286670420fe4c9e0028a709c41cd928c.png)

You can use this code to Website \> Website Tools \> Custom CSS

```auto
nav>div.header-nav-item>a:after, div.header-menu-nav-wrapper>div a:after {
    display: block;
    text-align: center;
    font-size: 12px;
}
nav>div.header-nav-item>a {
    text-align: center;
}
/* align text on mobile */
div.header-menu-nav-wrapper>div a:after {
    text-align: left;
}
nav>div.header-nav-item:nth-child(1)>a:after, div.header-menu-nav-wrapper>div:nth-child(1) a:after {
    content: "Asia";
}
nav>div.header-nav-item:nth-child(2)>a:after, div.header-menu-nav-wrapper>div:nth-child(2) a:after {
    content: "Content + SEO";
}
nav>div.header-nav-item:nth-child(3)>a:after, div.header-menu-nav-wrapper>div:nth-child(3) a:after {
    content: "Buy Now";
}
nav>div.header-nav-item:nth-child(4)>a:after, div.header-menu-nav-wrapper>div:nth-child(4) a:after {
    content: "Brand";
}
nav>div.header-nav-item:nth-child(5)>a:after, div.header-menu-nav-wrapper>div:nth-child(5) a:after {
    content: "Us";
}
nav>div.header-nav-item:nth-child(6)>a:after, div.header-menu-nav-wrapper>div:nth-child(6) a:after {
    content: "+1.234.5678";
}

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/9/5/95135835158e2254556135f1aeccff7d9504774a.png)

Result

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/3/8/38a69508286670420fe4c9e0028a709c41cd928c.png)

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/c/1/c1f1652e82e6ddc26e6aac3ffc4b1d37b3102a7b.png)