Solved

How to fix the spacing between social media icons in the footer of the debut theme

ITQG
Excursionist
25 1 5

example.pngHi, can someone show me how to fix the spacing between the Facebook, Tik Tok and instagram icons in the footer of my debut theme? The Facebook one is too far over to the left. 

 

Thanks! 

Accepted Solution (1)
ITQG
Excursionist
25 1 5

This is an accepted solution.

Got it, thank you!

View solution in original post

Replies 17 (17)

suyash1
Shopify Partner
8989 1117 1466

@ITQG - Can you please share your website link? it will need css

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

suyash1
Shopify Partner
8989 1117 1466

@ITQG - please add this css to the very end of your theme.css file and check, should look like the screenshot, adjust number 15 as per the need.

.site-footer__social-icons li{padding: 0 15px;}

 

suyash1_0-1655608843168.png

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

That worked, thank you! Are you able to show me how to make the Tik Tok logo the same size as the other two as well? 

suyash1
Shopify Partner
8989 1117 1466

@ITQG - please add this css

.icon-tiktok svg {width: 25px !important;    height: 25px !important;}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

Perfect!!! If I wanted to change the Tik Tok icon do another design, are you able to show me how?

 

suyash1
Shopify Partner
8989 1117 1466

@ITQG - I think this icon is added in your footer.liquid file, are you able to edit code? if no then I can send collab request and check it for you

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

I can try, are you able to send over the instructions? I was able to update it with the current image before 

 

suyash1
Shopify Partner
8989 1117 1466

@ITQG - please go to admin->online store->themes->actions->edit code

 

please find footer.liquid file, and go to the code of social icons, in that code the very last li tag is your tiktok, you can remove current svg code and add new one

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

Ok, I may need your help 🙂 how do I send you a collar request? 

suyash1
Shopify Partner
8989 1117 1466

@ITQG - asking for collaboration code , can you send me? I will send request

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

4352

suyash1
Shopify Partner
8989 1117 1466

@ITQG - I sent the request

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

done

suyash1
Shopify Partner
8989 1117 1466

@ITQG - I sent you code images in a message, please check inbox

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video created using AI
ITQG
Excursionist
25 1 5

This is an accepted solution.

Got it, thank you!

ITQG
Excursionist
25 1 5

Hi, do you know how I can make the tik Tok logo line up with the others? Also, do you know how to make the other social media icons open a new tab when clicked on?Screenshot 2024-01-03 at 10.43.22 AM.png