How do I add social icons to the header in Debut theme?

[tomeastman123]

[dmwwebartisan]

@tomeastman123

It would need customization to implement this feature, Unfortunately, there is no simple solution otherwise I will be happy to help you.

I would suggest hiring a Shopify expert to assist you OR feel free to contact me.

Thanks!

[Prezentech]

Hi @tomeastman123 ,

Please share your store url and password if it is protected so i can check and add it for you.

[Prezentech]

You can add the social media in the header by adding below code:

{%- if
              settings.social_twitter_link != blank
          or settings.social_facebook_link != blank
          or settings.social_pinterest_link != blank
          or settings.social_instagram_link != blank
          or settings.social_tumblr_link != blank
          or settings.social_snapchat_link != blank
          or settings.social_youtube_link != blank
          or settings.social_vimeo_link != blank
          or request.page_type == 'article'
          or request.page_type == 'blog'
          -%}
          {%- assign social_icons = true -%}
          {%- endif -%}
          
          {%- assign socials = "Facebook Twitter Pinterest Instagram Tumblr Snapchat YouTube Vimeo" | split: ' ' -%}
          
          {%- if social_icons -%}
            
              {%- for social in socials -%}
                {%- assign social_link = social | prepend: 'social_' | append: '_link' | downcase -%}
                {%- assign icon_link = social | prepend: 'icon-' | downcase -%}
                {%- if settings[social_link] != blank -%}
                  - {%- include icon_link -%}
                        {{ social }}
                    
                  
                {%- endif -%}
              {%- endfor -%}
            

          {%- endif -%}

[tomeastman123]

Brilliant work by prezentech! The solution is perfect. Highly recommended.

Thanks,

Tom

[cbswco]

Hi @Prezentech ! In wich section do i have to paste the above code?

[Prezentech]

@cbswco In the header.liquid

[cbswco]

Thank you for your fast response @Prezentech ! Once i paste the code, i go to customize theme and have to do something more? I already went there but didn´t find the option. Thank you very much for your help!!

[Prezentech]

@cbswco I can help you to setup as per your requirement. If yes, then please send direct message.

[Shaheed]

Hi, where do we add the code ?

[stephanieferro]

Can you help me add?

Thanks!

[Prezentech]

Hi @stephanieferro

Can you please share your store URL and the screenshot where you want to show it?

Thanks!

[Mariusz]

Hi @Prezentech ,

Your code is perfect, but I have problem when I add it to my header.

When I got social buttons in the same line with the logo and search, account & basket buttons, logo is not centered (move to the right) and three buttons on the right goes off the page.

I enclosed print screen:

Could you help to solve this issue?

[Prezentech]

Hi @Mariusz ,

Can you please share the store url?

Thanks,

[Mariusz]

Hi @Prezentech ,

Thank you for your reply!

Url: https://fondios.com/

[Prezentech]

Changes mentioned in the screenshots

[Mariusz]

HI @Prezentech ,

This is perfect. Thank you a lot for your help!

[ericsoho]

I am trying to get the instagram icon beside the search icon. Please help, I am using your code.

[davethedave2]

Hi @Prezentech I am trying to use the solution.
I am using debut theme but the entire Add to Cart sections disappears?

[Yoursocial]

Hi,

I used your code and it worked. However, it does not align to the search icon where I wanted it to be. Here’s how it looks. Can you help me place it next to the search icon. Thank you