Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Add Social Links to Multiple External Sources (In Addition to Own Social Links)


Go to solution Solved by christyprice,

Question

Is there any way to add social links to external profiles, while keeping the social icons the same as the ones used for my personal profile?

I currently have my personal social links within the footer of each page, but would like to include links (with social icons) to other social profiles within the content.

Thanks in advance!

Bob

Link to post
  • Answers 10
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

I've done this by using FontAwesome for the icons and creating code blocks. This post explains how to add them to the nav bar, but the same general method would work in any code block: https://christy

Thank you so much, this was hugely useful.

Can you paste all code you inserted? We can check easier.

10 answers to this question

Recommended Posts

  • 1

I've done this by using FontAwesome for the icons and creating code blocks. This post explains how to add them to the nav bar, but the same general method would work in any code block: https://christyprice.com/squarespace-tips-tricks/how-to-add-social-media-icons-to-squarespace-navigation

You can see it in action (not in the nav bar) here: https://www.orinrice.com/about

Link to post
  • 0
On 1/4/2020 at 4:03 AM, christyprice said:

I've done this by using FontAwesome for the icons and creating code blocks. This post explains how to add them to the nav bar, but the same general method would work in any code block: https://christyprice.com/squarespace-tips-tricks/how-to-add-social-media-icons-to-squarespace-navigation

You can see it in action (not in the nav bar) here: https://www.orinrice.com/about

Hi Christy, this was very useful, but I although I understand how to add the icon using the <i...> tag, I don't understand how to add the link to it if it is not meant to be in the header/menu.  I want to do it exactly like you did at https://www.orinrice.com/about, could you perhaps explain a little more what I need to do after step 2 in your tutorial? I added a code box, added the <i class="fab fa-instagram"></i>, but then I'm stuck.

Link to post
  • 0
9 hours ago, MishaGo said:

Hi Christy, this was very useful, but I although I understand how to add the icon using the <i...> tag, I don't understand how to add the link to it if it is not meant to be in the header/menu.  I want to do it exactly like you did at https://www.orinrice.com/about, could you perhaps explain a little more what I need to do after step 2 in your tutorial? I added a code box, added the <i class="fab fa-instagram"></i>, but then I'm stuck.

Hi @MishaGo, you can check out the source code and pull from there. On that particular site I used two FontAwesome icons stacked. Here's that part of the code: 

<a href="https://www.linkedin.com/" target="_blank"><span class="fa-stack fa-1x">
  <i class="fas fa-circle fa-stack-2x"></i>
  <i class="fab fa-linkedin-in fa-stack-1x fa-inverse"></i>
</span></a>

You would replace the URL with yours. 

Link to post
  • 0
On 1/24/2020 at 9:40 PM, christyprice said:

Hi @MishaGo, you can check out the source code and pull from there. On that particular site I used two FontAwesome icons stacked. Here's that part of the code: 


<a href="https://www.linkedin.com/" target="_blank"><span class="fa-stack fa-1x">
  <i class="fas fa-circle fa-stack-2x"></i>
  <i class="fab fa-linkedin-in fa-stack-1x fa-inverse"></i>
</span></a>

You would replace the URL with yours. 

Thank you so much, this was hugely useful.

Link to post
  • 0
1 hour ago, RobMcCallum said:

Hello!

I am trying to create the below with two separate sets of social links on 7.1. I have tried to follow the instructions above but I can figure it out. could you please advise?

 

https://www.orinrice.com/about

 

thanks, Rob

I see email, linkedin icons worked here?

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 0
On 9/29/2020 at 9:48 PM, netiro said:

Hi, I used the code above and it worked perfectly, but now the circles and alignment seem to have been thrown out?

Any ideas what to do? Would someone have a look and advise? Thanks in advance.

https://www.netiro.co.uk/our-team/tim-gear-evans

Can you paste all code you inserted? We can check easier.

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 0
3 hours ago, tuanphan said:

Can you paste all code you inserted? We can check easier.

<a href="https://www.linkedin.com/in/tim-gear-evans-6a5580/" target="_blank"><span class="fa-stack fa-1x">
  <i class="fas fa-circle fa-stack-2x"></i>
  <i class="fab fa-linkedin-in fa-stack-1x fa-inverse">
  </i>
 
</span></a>

<a href="mailto:tim.gear-evans@netiro.co.uk" target="_blank"><span class="fa-stack fa-1x">
  <i class="fas fa-circle fa-stack-2x"></i>
  <i class="fab far fa-envelope fa-stack-1x fa-inverse"></i>
</span></a>

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...