
Description
This guide will run you through on how to get a little more creative and create a visual flair by displaying a Font Awesome icon on your social profiles. This is an improvement that was released in XF 2.2 and here we will walk through the various social media profiles you can use and display in a number of places, without having to install a single add-on.
Guide
- Create a custom user field. Go to Admin CP > Users > Custom user fields > Add field
- Field ID: This can be anything you want i.e. steam
- Title: This can be anything you want i.e. Steam
- Description: This can be anything you want i.e. Enter your Steam ID here.
- Display location: Contact details
- Field type: Single-line text Box
- General option: User editable, Moderator editable, Viewable on profile pages, Viewable in message user info
- Value display HTML: Copy and paste the code below.
- Wrapper display HTML: Copy and paste the code below.
Value display HTML
Code:
<a href="https://steamcommunity.com/id/{$value}/" target="_blank" data-xf-init="tooltip" title="{$value}"><i class="fab fa-steam-square fa-2x" style="color:#66c0f4"></i></a>
Code:
<span style="display: inline-block; margin-right: 6px;">{$value}</span>
Additional resources
HTML Color Codes
Font Awesome Icons