Looking to add an icon to my mobile category section | Xtra Theme

Solved

Looking to add an icon to my mobile category section | Xtra Theme

inailuser987
Excursionist
22 0 6

 Hi developers,

 

I'm looking to add a home icon next to the home page, any way I can add a home icon favicon or image to display that?

 

 

My website: nailsbestbuy.com

 

add home icon.PNG

 

Best,

 

Nailsbestbuy Team

Accepted Solution (1)

WebDeskSolution
Shopify Partner
176 42 49

This is an accepted solution.

Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->screen.css

 

@media only screen and (max-width: 990px){
   #root #shopify-section-header #nav>ul>li.nav-bar-element.nav-bar-element-main~li.nav-bar-element[data-copy="11"] {
       background: url("//cdn.shopify.com/s/files/1/0675/9635/3848/collections/bulk-deals.webp?crop=center&height=60&v=1672513709&width=60") no-repeat 5% 50%;
       background-size: auto 29px;
   }
}

 Please follow this screenshot for Home icon 

WebDeskSolution_1-1672831822956.png

 

Output:

WebDeskSolution_0-1672831761154.png

 

 

If you find our reply helpful, please hit Like and Mark it as a Solution.

 

An award-winning North American Shopify Development Agency That Delivers Powerful Results, Innovation, and Secure Digital Transformation.

 

Thank You,


WebDesk Solution Support Team
Get a Free Quote | Email | Shopify Partner | Shopify Development Agency | Call Us 877.536.3789


Location: 150 King St. W. Toronto, ON M5H 1J9

View solution in original post

Replies 2 (2)

WebDeskSolution
Shopify Partner
176 42 49

This is an accepted solution.

Add this CSS at the bottom of Online Store->Theme->Edit code->Assets->screen.css

 

@media only screen and (max-width: 990px){
   #root #shopify-section-header #nav>ul>li.nav-bar-element.nav-bar-element-main~li.nav-bar-element[data-copy="11"] {
       background: url("//cdn.shopify.com/s/files/1/0675/9635/3848/collections/bulk-deals.webp?crop=center&height=60&v=1672513709&width=60") no-repeat 5% 50%;
       background-size: auto 29px;
   }
}

 Please follow this screenshot for Home icon 

WebDeskSolution_1-1672831822956.png

 

Output:

WebDeskSolution_0-1672831761154.png

 

 

If you find our reply helpful, please hit Like and Mark it as a Solution.

 

An award-winning North American Shopify Development Agency That Delivers Powerful Results, Innovation, and Secure Digital Transformation.

 

Thank You,


WebDesk Solution Support Team
Get a Free Quote | Email | Shopify Partner | Shopify Development Agency | Call Us 877.536.3789


Location: 150 King St. W. Toronto, ON M5H 1J9

inailuser987
Excursionist
22 0 6

The solution worked, thank you!