Changes in the menu (right aligned + change icons to words)

oliverun
New Member
10 0 0
Hi how are you? I wanted to ask you two questions:
 
1. How can I put the menu of my website (showcase theme) aligned to the right?
2. How can I replace the glass and cart icons with the words SEARCH and CART?
 
I attach two files with the current menu and the desired one 🙂
 
Thank you!
Replies 7 (7)

Ahsan_ANC
Shopify Partner
1362 246 309

Hi @oliverun,
You can try this code for menu alignment 


1. Go to Online Store-> Theme->Edit code
2. Asset-> styles.css ->paste the below code at the bottom of the file.

 

@media only screen and (min-width: 768px){
.site-control.nav-inline-desktop .site-control__inline-links{
margin-left: auto;
}
}

  

To change the icon please go to the heade.liquid file and find the code that says like that 

{% render 'icon-NAME-OF-ICON' %}

 

you can replace that code with the Words you want. 

If you are comfortable with code editing you can share the header.liquid code here so I can edit that.

 

Contact for any custom design? Skype : ahsananc
>Was your question answered? Mark it as an Accepted Solution!
Feel Free to Contact Me at my Email: anc2277@gmail.com


To enhance and customize Shopify search and filter, I use Boost Product Filter & Search
oliverun
New Member
10 0 0

Hello, thank you very much for your answers. I am going to put them into practice to see if I can make the changes. Thank you very much for your time.

oscprofessional
Shopify Partner
15830 2369 3071

Hello @oliverun 

Please could you share your Site URL so that I can review it?

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
oliverun
New Member
10 0 0

Hello, thank you very much for your answers. Here is my website, www.uncommonnomads.com password: marisaestaoculta, thank you very much for your time.

oscprofessional
Shopify Partner
15830 2369 3071

Hello @oliverun 

I have checked your second query 

2. How can I replace the glass and cart icons with the words SEARCH and CART?

 

Go to the online store >Theme>Edit code>Assets >styles.css

 

 

.site-control .site-control__inner .nav-search svg {
    display: none !important;
}
.site-control .site-control__inner svg {
    display: none !important;
}
.site-control .cart div {
    display: none !important;
}
.site-control.icons .site-control__inner a .text-link {
    display: block !important;
}
.site-control .cart {
    right: 10px !important;
}
.site-control .site-control__inner a, .site-control .site-control__inner .disclosure__toggle {
    display: unset !important;
}

 

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
oliverun
New Member
10 0 0

I think we almost have it, the issue is that it gets out of order and we lose the language selector icon (the little arrow), I would like to keep it, I attach a screenshot. Thanks a lot 🙂

oscprofessional
Shopify Partner
15830 2369 3071

Hello @oliverun 

Please add proper this property:-

.site-control .cart div {
    display: none !important;
}
.site-control.icons .site-control__inner a .text-link {
display: contents !important;
}

if it will be helpful please like and accept solution.

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing