IT Blog

  • Blog
  • Technology
    • Technology
    • Architecture
    • CMS
    • CRM
    • Web
    • DotNET
    • Python
    • Database
    • BI
    • Program Language
  • Users
    • Login
    • Register
    • Forgot Password?
  • ENEN
    • 中文中文
    • ENEN
Experience IT
In a World of Technology, People Make the Difference.
  1. Home
  2. Technology
  3. CMS
  4. Wordpress
  5. Plugin
  6. Creating social links shortcode

Creating social links shortcode

2018-08-29 769 Views 0 Like 0 Comments

Table of Contents

  • Shortcode:
  • Additional CSS:
  • Usage:
  • Display:

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:

social links icons

Loading

error
fb-share-icon
Tweet
fb-share-icon
IT Team
Author: IT Team

Tags: None
Last updated:2018-08-29

IT Team

This person is lazy and left nothing

Like
< Previous
Next >

Comments

Cancel reply
Newest Hotspots Random
Newest Hotspots Random
Rich editor not working Making web page scroll down automatically Getting data from Dapper result All Unicode Chars How to keep and display contact form 7 data Common Regular Expressions
Parallax One analysis WP Plugin "User Specific Content" review Restoring the Links Manager usp_Email_AutomationScorecard Post tweets with Power Automate Form calculation JavaScript component
Categories
  • Architecture
  • BI
  • C#
  • CSS
  • Database
  • DotNET
  • Hosting
  • HTML
  • JavaScript
  • PHP
  • Program Language
  • Python
  • Security
  • SEO
  • Technology
  • Web
  • Wordpress

COPYRIGHT © 2021 Hostlike IT Blog. All rights reserved.

This site is supported by Hostlike.com