Buy me a coffee

Left Menu – Middle Logo – Right Menu

#1. Change header layout to Left Menu – Middle Logo like below


#2. Paste this code to Code Injection > Footer

<script src=""></script>
  $('.header-display-desktop nav.header-nav-list').clone().appendTo('.header-display-desktop .header-actions.header-actions--right');

This code will duplicate the Left Menu and add it to the Right Menu, and you will have.


#3. Paste this code to Custom CSS Box

/* Hide item 1, 2 from right menu */
.header-display-desktop .header-actions--right .header-nav-list .header-nav-item:nth-child(-n+2) {
    display: none;
/* Hide item 3, 4 from left menu */
.header-display-desktop .header-title-nav-wrapper .header-nav-list .header-nav-item:nth-child(n+3) {
    display: none;
/* add space between item 3, 4 in right menu */
  .header-nav-item:nth-child(n+3) {
    margin-right: 1.5vw;

This code will hide items 3, 4 from the Left Menu.

And hide items 1, 2 from the Right Menu.

And add space between items 3, 4 in the Right Menu

You will have



#4. To fix the right menu disappearing on other pages, you can use this code to Custom CSS Box 

/* Fix right menu disappear on other pages */
.header-nav-item a {
    opacity: 1 !important;

#5. To move the menu closer logo, paste this code to the Custom CSS Box 

/* Move menu closer logo */
.header-actions.header-actions--right {
    justify-content: flex-start !important;
.header-nav-wrapper {
    text-align: right;
.header-nav nav.header-nav-list>div {
    margin-right: 0 !important;
    margin-left: 2.7vw !important;


Ask me a question, free

If your site is private or in trial, just setup password and share url. See how to:
Please check your email carefully. Recently I got a lot of questions with wrong emails.

If you haven't heard from me within 24 hours please check your junk/spam folder