Social Media Icons
Use the following HTML snippets to display Font Awesome icons for social media on a page.
Use the following HTML snippets to display Font Awesome icons for social media on a page.
Copy/paste the following html into the location you want (in source mode when pasting) the FB icon to display. Change the Facebook link to the page needed.
Square version:
<a href="https://www.facebook.com/OCRecreation/" target="_blank"><span aria-description="Facebook icon" class="fab fa-facebook-square" style="color:#000;font-size:25px;"><span class="visually hidden">Facebook</span></span></a>
Copy/paste the following html into the location you want (in source mode when pasting) the Instagram icon to display. Change the Instagram link to the page needed.
Standard version:
<a href="https://www.instagram.com/ocrecreation/" target="_blank"><span aria-description="Instagram icon" class="fab fa-instagram" style="color:#000;font-size:25px;"><span class="visually hidden">Instagram</span></span></a>
Copy/paste the following html into the location you want (in source mode when pasting) the Twitter icon to display. Change the Twitter link to the page needed.
Standard version:
<a href="https://twitter.com/OlympicCollege" target="_blank"><span aria-description="Twitter icon" class="fab fa-twitter-square" style="color:#000;font-size:25px;"><span class="visually hidden">Twitter</span></span></a>
Copy/paste the following html into the location you want (in source mode when pasting) the YouTube icon to display. Change the YouTube link to the page needed.
Standard version:
<a href="https://www.youtube.com/OlympicCollege" target="_blank"><span aria-description="YouTube icon" class="fab fa-youtube" style="color:#000;font-size:25px;"><span class="visually hidden">YouTube</span></span></a>
Copy/paste the following html into the location you want (in source mode when pasting) the LinkedIn icon to display. Change the LinkedIn link to the page needed.
Standard version:
<a href="https://www.linkedin.com/school/olympic-college/" target="_blank"><span aria-description="LinkedIn icon" class="fab fa-linkedin" style="color:#000;font-size:25px;"><span class="visually hidden">LinkedIn</span></span></a>
Copy/paste the following html into the location you want (in source mode when pasting) the TikTok icon to display. Change the TikTok link to the page needed.
Standard version:
<a href="https://www.tiktok.com/@ocinternational" target="_blank"><span aria-description="TikTok icon" class="fab fa-tiktok" style="color:#000;font-size:25px;"><span class="visually hidden">TikTok</span></span></a>