Remove Burger (One Page)

Add this code to Page Header Code Injection and click Save

(If your site doesn’t support Code Injection, you can add code via Code Block)

<!-- Remove burger (One Page) -->
<style>
.header-burger {
  display: none;
}
</style>

Burger Color (One Page)

Add this code to Page Header Code Injection and click Save

(If your site doesn’t support Code Injection, you can add code via Code Block)

<!-- burger color on one page -->
<style>
/* Change burger color */
.burger-inner>div {
background-color: #f1f !important;
}
/* change burger X color */
body.header--menu-open .burger-inner>div {
background-color: #f1f !important;
}
</style>

Add these codes to CSS Custom Box and click Save.

Burger Color

/* Change burger color */
.burger-inner>div {
  background-color: #f1f !important;
}

Burger X Color

/* change burger X color */
body.header--menu-open .burger-inner>div {
  background-color: #f1f !important;
}

Burger Icon to word “Menu”

/* Change burger icon to word Menu */
/* burger icon to Menu */
.burger-box:after {
    content: "MENU";
    width: 60px;
    height: 40px;
    display: block;
    color: #000;
    font-size: 20px;
    font-weight: bold;
    visibility: visible;
    margin-top: auto !important;
    margin-bottom: auto !important
}
.burger-box div {
    display: none
}

And you will have

Add text next to Burger

/* Add text next to burger */
div.header-burger:before {
    content: "Menu";
    position: relative;
    top: -10px;
    font-size: 18px;
}

And you will have

Change position of Logo – Burger

/* Change position of burger - logo */
div.header-display-mobile {
    flex-direction: row-reverse;
}
.header-title-text {
    text-align: right;
}

And you will have

Make button appear next to Burger

/* Make button appear next to burger */
@media screen and (max-width:991px) {
  .header-actions.header-actions--right, .header-actions-action.header-actions-action--cta {
    display: flex !important;
}
.header-title-nav-wrapper {
    flex: 1 0 30% !important;
}
a.btn {
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 14px !important;
}
}

And you will have