Table of Contents
Shortcode:
function social_shortcode($atts) {
$a = shortcode_atts(array(
'facebook' => 'vincentke2018',
'twitter' => 'vincentke2018',
'instagram' => 'vincentke2018'
),$atts);
$str = '<div style="text-align:right;padding-right:15px;">
<a href="https://facebook.com/'.$a['facebook'].'" target="_blank"><div class="facebook"></div></a>
<a href="https://twitter.com/'.$a['twitter'].'" target="_blank"><div class="twitter"></div></a>
<a href="https://instagram.com/'.$a['instagram'].'" target="_blank"><div class="instagram"></div></a>
</div>';
return $str;
}
add_shortcode('social','social_shortcode');
Additional CSS:
.facebook,.twitter,.instagram{
display:inline-block;
border-radius:23px;
width:45px;
height:45px;
}
.facebook{
background: url(/images/Flat-Social-Icons.png) -7px -7px;
}
.twitter{
background: url(/images/Flat-Social-Icons.png) -103px -7px;
}
.instagram{
background: url(/images/Flat-Social-Icons.png) -288px -7px;
}
Usage:
[social facebook="vincentke2018" twitter="vincentke2018" instagram="vincentke2018"]
Display:
Comments