Jump to content

add individual social media icons to team page

Recommended Posts

  • 2 years later...
On 3/2/2022 at 11:31 PM, jessb24 said:

I would love to know the answer to the question above. I'm trying to do the same. I'm somewhat familiar with html. Essentially I'll be doing this underneath every bio. I tried doing it with a gallery as you'll see in the first block, but with mobile, the gallery is left aligning and none of the codes provided to center are working.  https://www.purplecampaign.org/our-team-test

The url doesn't exist. Do you still need help?

First, add this to Code Injection > Header

If you use a Personal Plan, Edit Site Footer >> Add a Code Block >> Paste this code

 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" integrity="sha384-vp86vTRFVJgpjF9jiIGPEEqYqlDwgyBgEF109VFjmqGmIY/Y4HV4d3Gp2irVfcrp" crossorigin="anonymous">
  /* code block padding top bottom */
  .code-block {
    padding-top: 0;
    padding-bottom: 0;
  /* social icons code */
.t-social {
    display: block;
    margin: 0 auto;
    padding-top: 5px;
    text-align: center;
  	padding-left: 0;
  .t-social li {
  display: inline-block;
    margin: 0;
    line-height: 100%!important;
  .t-social li i {
    font-size: 30px;
    margin: 0 20px;

Next, on each team people >> Add a Code Block >> Paste this code

<ul class="t-social">
  <a href="http://m.me/giannicipriano">
  <i class="fab fa-facebook-messenger"></i>
  <a href="https://wa.me/393285677923">
  <i class="fab fa-whatsapp"></i>
  <a href="mailto:gianni@giannicipriano.com">
  <i class="fas fa-at"></i>

This will add Email, Whatsapp, Facebook icons. Replace url with your urls

If you want to use another icon, let me know, we will give. Or below are some common icons code

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

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

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.