How to add an icon font to a Simple theme navbar?

Store Design
1

I faced this issue. When I want to add Apple icon Or Android icon before the word (Apple - Samsung - Huawei). Its show me an error

I want someone help me in (coding the theme) to get done and work successfuly for me. I tried many ways, it is not coming with me. Thanks a lot.

Open the attachement or see the image below please.

SmartSelect_20220203-081410_Chrome.jpg
SmartSelect_20220203-081410_Chrome.jpg501×316 6 KB

2

Hii @Mujammami

Welcome to the Shopify community!
Thanks for your good question.

kindly share your store URL, so that
I will check out the issue and provide a solution.

3

@Mujammami

Welcome to the Shopify community!

Kindly share your Store URL,

4

thanks Premadeatores for your response. I have only the url for the store. Url: (moj4ck.com)

5

Thanks a lot for your responding Mr. Zworthkey, waiting for supporting solutions guys… :heart_eyes: :three_o_clock:

6

@Mujammami

It seems like your store is password protected . kindly share your password as well so I can access your website.

thanks!

7

You received it as a private message.

8

@Mujammami
Your Store is password protected.

9

@Mujammami

Follow this:

Open Snippet->site-nav.liquid and find

  • then add your icon code. but you have to make condition for each menu because all menu generated by loop so you cant make it separate for diffrent icon without condition.

    • 10

    Thank you Zworthkey, Can you please guide me or send me full code to do it seperatly each one alone like Apple icon before (Apple) and so on…?

    I appreciate your support and good fast response from your side.

    11

    @Mujammami
    Send me your Menu code. You are already a developer you can do it?

    12

    Hii, @Mujammami

    Welcome to the Shopify community!
    and Thanks for your question.

    1. In your Shopify Admin go to online store > themes > actions > edit code

    2. Find theme.liquid file & paste these two links under head tag

    like this:

    premadestores_0-1643880553851.png
    premadestores_0-1643880553851.png851×225 16.4 KB

    then go to your navigation-> Select menu->

    and paste this html code in Name**: Apple**

    premadestores_1-1643881099761.png
    premadestores_1-1643881099761.png1094×312 18.2 KB

    It will show the output like this :

    premadestores_2-1643881219954.png
    premadestores_2-1643881219954.png1349×157 8.84 KB

    And same like others .

    I hope this will be helful for you

    13

    @Mujammami

    Let me know if you Still need help to customize your navbarmenu in theme our team will happy to help you.

    Thank you.

    14

    I tried this way perfectly, but it is not coming with me. Sorry ?

    Still need help.

    15

    Big thanks to Premadstores for your responses and help. And HUGE thanks to Zworthkey for your help and make it done and work fine as I want :heart:.

    SmartSelect_20220204-145426_Gallery.jpg
    SmartSelect_20220204-145426_Gallery.jpg683×420 11.6 KB

    16

    @Mujammami
    kindly like and accept our Solution.