charlessteiner
Hi,
They are not fontawesome icons, actually, the template uses an image which includes icons for these social networks, then use CSS to position each icon.
The image is: /templates/ja_onepage/images/social-icons.png (if you're using another theme, the image will locate inside that theme's folder, for example: templates/ja_onepage/images/themes/modern/social-icons.png)
You need to edit this image and add instagram icon.
In the 'template.css' file of template, you can see this declaration:
ul.social-list li a {
background-image: url(../../../images/social-icons.png);
background-repeat: no-repeat;
display: block;
height: 20px;
text-indent: -999em;
width: 20px;
}
ul.social-list li a.facebook {
background-position: 0px -20px;
}
ul.social-list li a.facebook:hover,
ul.thumbnails li:hover li a.facebook {
background-position: 0px -40px;
}
ul.social-list li a.twitter {
background-position: -20px -20px;
}
ul.social-list li a.twitter:hover,
ul.thumbnails li:hover li a.twitter {
background-position: -20px -40px;
}
ul.social-list li a.flicker {
background-position: -40px -20px;
}
ul.social-list li a.flicker:hover,
ul.thumbnails li:hover li a.flicker {
background-position: -40px -40px;
}
After adding icon to above image, you can add css rule for it, for example:
ul.social-list li a.instagram {
background-position: -20px -20px;
}