[Rue NelModerator]

Hello There,

Thanks for updating this thread! You can add this code in your child theme’s functions.php file

// Custom Social Icons
// =============================================================================
function x_social_global() {

	$facebook    = x_get_option( 'x_social_facebook' );
	$twitter     = x_get_option( 'x_social_twitter' );
	$google_plus = x_get_option( 'x_social_googleplus' );
	$linkedin    = x_get_option( 'x_social_linkedin' );
	$xing        = x_get_option( 'x_social_xing' );
	$foursquare  = x_get_option( 'x_social_foursquare' );
	$youtube     = x_get_option( 'x_social_youtube' );
	$vimeo       = x_get_option( 'x_social_vimeo' );
	$instagram   = x_get_option( 'x_social_instagram' );
	$pinterest   = x_get_option( 'x_social_pinterest' );
	$dribbble    = x_get_option( 'x_social_dribbble' );
	$flickr      = x_get_option( 'x_social_flickr' );
	$github      = x_get_option( 'x_social_github' );
	$behance     = x_get_option( 'x_social_behance' );
	$tumblr      = x_get_option( 'x_social_tumblr' );
	$whatsapp    = x_get_option( 'x_social_whatsapp' );
	$soundcloud  = x_get_option( 'x_social_soundcloud' );
	$rss         = x_get_option( 'x_social_rss' );

	$output = '<div class="x-social-global">';

	  if ( $facebook )    : $output .= '<a href="' . $facebook    . '" class="facebook" title="Facebook" target="_blank"><i class="x-icon-facebook-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $twitter )     : $output .= '<a href="' . $twitter     . '" class="twitter" title="Twitter" target="_blank"><i class="x-icon-twitter-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $google_plus ) : $output .= '<a href="' . $google_plus . '" class="google-plus" title="Google+" target="_blank"><i class="x-icon-google-plus-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $linkedin )    : $output .= '<a href="' . $linkedin    . '" class="linkedin" title="LinkedIn" target="_blank"><i class="x-icon-linkedin-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $xing )        : $output .= '<a href="' . $xing        . '" class="xing" title="XING" target="_blank"><i class="x-icon-xing-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $foursquare )  : $output .= '<a href="' . $foursquare  . '" class="foursquare" title="Foursquare" target="_blank"><i class="x-icon-foursquare" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $youtube )     : $output .= '<a href="' . $youtube     . '" class="youtube" title="YouTube" target="_blank"><i class="x-icon-youtube-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $vimeo )       : $output .= '<a href="' . $vimeo       . '" class="vimeo" title="Vimeo" target="_blank"><i class="x-icon-vimeo-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $instagram )   : $output .= '<a href="' . $instagram   . '" class="instagram" title="Instagram" target="_blank"><i class="x-icon-instagram" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $pinterest )   : $output .= '<a href="' . $pinterest   . '" class="pinterest" title="Pinterest" target="_blank"><i class="x-icon-pinterest-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $dribbble )    : $output .= '<a href="' . $dribbble    . '" class="dribbble" title="Dribbble" target="_blank"><i class="x-icon-dribbble" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $flickr )      : $output .= '<a href="' . $flickr      . '" class="flickr" title="Flickr" target="_blank"><i class="x-icon-flickr" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $github )      : $output .= '<a href="' . $github      . '" class="github" title="GitHub" target="_blank"><i class="x-icon-github-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $behance )     : $output .= '<a href="' . $behance     . '" class="behance" title="Behance" target="_blank"><i class="x-icon-behance-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $tumblr )      : $output .= '<a href="' . $tumblr      . '" class="tumblr" title="Tumblr" target="_blank"><i class="x-icon-tumblr-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $whatsapp )    : $output .= '<a href="' . $whatsapp    . '" class="tumblr" title="Whatsapp" target="_blank"><i class="x-icon-whatsapp" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $soundcloud )  : $output .= '<a href="' . $soundcloud  . '" class="soundcloud" title="SoundCloud" target="_blank"><i class="x-icon-soundcloud" data-x-icon="" aria-hidden="true"></i></a>'; endif;
	  if ( $rss )         : $output .= '<a href="' . $rss         . '" class="rss" title="RSS" target="_blank"><i class="x-icon-rss-square" data-x-icon="" aria-hidden="true"></i></a>'; endif;

	$output .= '</div>';

	echo $output;

}
// =============================================================================

You may need to copy the raw code here: http://pastebin.com/WKmug1p9 to preserve the data-x-icon value.

[dmills1Participant]

I’d like to use a rectangular icon instead of a circle, can you provide css to make that change. I want to display a “donate” icon instead of a circular social icon.

[JoaoModerator]

Hi There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks

Joao

[dmills1Participant]

awakeningamerica.us

I want to put a button icon next to social that says, DONATE,

[JadeModerator]

Hi there,

Please try to add this in the customizer:

.x-topbar .x-social-global a {
    border-radius: 0;
    width: 40px;
}

Hope this helps.

[andrewneilsonParticipant]

My apologies, I don’t quite understand what to enter for my situation regarding “You can add this code in your child theme’s functions.php file” above.

I have successfully changed the “bechance” icon to “houzz”, and am trying to figure out the code needed to enter into the child theme’s functions.php file to get the mouse over to say “houzz”.

Thanks in advance.

[FriechModerator]

Hi There,

On the code above look for the title="Behance" and change that to title="Houzz"

Then add the code on your child theme’s functions.php file.

Hope it helps, Cheers!

[RupokMember]

Hi @andrewneilson

Please provide your URL.

Thanks!

[andrewneilsonParticipant]

neilsonconstructioncompany.com

So I should add:

function x_social_global() {
$behance = x_get_option( ‘x_social_behance’ );

if ( $behance ) : $output .= ‘<i class=”x-icon-behance-square” data-x-icon=”” aria-hidden=”true”></i>‘; endif;

$output .= ‘</div>’;

echo $output;

}

and change all instances of Behance to Houzz?

Thanks

[NicoModerator]

Hi There,

Only the title that you will change do not remove or add any in the code.

Change the title from Behance to Houzz.

Hope it helps.

Let us know how it goes.

Thanks.

[dcindiaParticipant]

Hi,
Wanted to add a blog icon on top bar on my site – http://www.dentalbusinessmasters.com
Followed the steps mentioned above and were very helpful. Only problem is they are not aligned with the facebook icon.
Please help.

[JoaoModerator]

Hi There,

Please remove the plugin that protects your content in order that we can inspect your page and provide you a solution.

Thanks

Joao

[dcindiaParticipant]

YES, Have done that… Deactivated the plugin

[JoaoModerator]

Hi There,

Please add the following code to Appereance > Customizer > Custom > CSS

 .x-topbar .x-social-global a i .x-icon-pinterest-square {
margin-top: 10px;
}

Hope it helps

Joao

[dcindiaParticipant]

Hi Joao,
tried the code, but it is still the same.

[Author]

Posts