How can I change the menu style to buttons in the Dawn theme?

[hanbal]

Hi

I want to change the Menu button style of my Shopify Dawn theme, and want to change the current menu to a button style,

See attached image which I want.

And for the current style please check my store link.

Store Link : https://olanzu.myshopify.com/

Password : 123456

Please guide.

Thanks

[GemPages · Accepted solution]

Hello @hanbal ,

It's GemPages support team and glad to support you today.

I would like to give you a recommendation to support you so kindly follow steps below:

1. Go to Online Store > Theme > Edit code of your current theme

2. Open your theme.liquid theme file

3. Paste the below code before </head>

<style>
.header__menu-item span {
    border: 1px solid #e20d2e;
    border-radius: 30px;
    padding: 5px 15px;
    color: #e20d2e;
    text-transform: uppercase;
    font-size: 16px;
}

.header__active-menu-item {
    background: #e20d2e;
    color: #fff !important;
    text-decoration: none;
}

.header__icon .icon {
    color: #e20d2e;
}
</style>

Let us know how it works for you.

Best regards,
GemPages Support Team

[hanbal]

Thanks

[GemPages]

I am glad that my solution is helpful to you 😍.