Edit share buttons look

I’d strongly recommend against editing plugin files, to avoid running into issues when updating the plugins.

Instead, you can move that custom CSS into your theme stylesheet, or in the custom CSS editor available under Appearance > Edit CSS in your dashboard.

For example, to change the alignment and the colors of the icons, you could use this CSS:

.sharedaddy .sd-content ul {
	text-align: center;
}

.sharedaddy .sd-content ul li a span {
	font-size: 14px;
}

.sharedaddy .sd-social .sd-button .share-count {
	background: none;
	color: #ff0000;
	font-size: 14px;
}

div.sharedaddy h3, #content div.sharedaddy h3, #main div.sharedaddy h3, #primary div.sharedaddy h3 {
  color: #ff0000;
  font-family: 'Waiting for the Sunrise';
  font-size: 16px;
}

I hope this helps.

Hello Jeremy,

I am very thankful for your kind help, it is very appreciated.

As you said, from now on I won’t modify the plugins CSS, instead I will create custom includes like the one you provide.

It “almost” worked, but it has two problems:

– Red text using “Waiting for the sunrise” font, is not centered :-S
– Now the F logo and the Twitter logo are grey, is there a way of making them blue again?

Sample: https://www.inforc.net/2015/03/1-2-y-3-de-mayo-copa-sworkz-en-valladolid-con-atsushi-hara-te-lo-vas-a-perder/
THanks againd for your time and help ??

Best regards,
Miguel.

Sorry, forgot to mark it as not resolved.

– Red text using “Waiting for the sunrise” font, is not centered :-S

Try this:

.sd-social {
	text-align: center;
}

– Now the F logo and the Twitter logo are grey, is there a way of making them blue again?

Anything is possible with CSS. ?? Try this:

.sd-content ul li.share-facebook div.option.option-smart-off a:before,
.sd-social-icon .sd-content ul li.share-facebook a:before,
.sd-social-icon-text .sd-content li.share-facebook a:before,
.sd-social-text .sd-content ul li.share-facebook a:before {
	color: #3b5998;
}
.sd-content ul li.share-twitter div.option.option-smart-off a:before,
.sd-social-icon .sd-content ul li.share-twitter a:before,
.sd-social-icon-text .sd-content li.share-twitter a:before,
.sd-social-text .sd-content ul li.share-twitter a:before {
	color: #00acee;
}

If you’re not familiar with CSS, I’d recommend checking this series of tutorials:
https://dailypost.wordpress.com/2013/06/21/css-intro/

AWESOME!!

You are right, anything is possible with CSS…maybe I should study it in depth ??

Thank you very much for your advices and kind attention.

Regards from spain,
Miguel.

Hello,

I re-open this post, as I consider unnecesary to open a new one.

Regarding the share buttons, since 2 weeks I MUST use the official buttons if I want the share counter to be shown properly. Otherway, the non official buttons won’t show a counter.

These official buttons are left aligned. Could you help me please to align them on the center?

And also…do you know why not official buttons are not showing share counter?

Thanks in advance and best regards ??

since 2 weeks I MUST use the official buttons if I want the share counter to be shown properly. Otherway, the non official buttons won’t show a counter.

Facebook recently changed the way that their API counts shares. Due to this change, the current method of counting shares that Jetpack uses is not working.

We are working on a new Jetpack release that will include a new method of counting Shares. Keep an eye out for a Jetpack update in the coming few days!

These official buttons are left aligned. Could you help me please to align them on the center?

You should be able to do so by targeting each button iFrame with CSS.

Thanks Jeremy,

how lucky, the same day I post the problem, I receive the update notification.

Anyway I would like to have the code to center the official buttons, just for the future.

Could you please tell me what code to type? Sorry for the inconveniences ?? I am not a programmer.

Regards!! ??

I would like to have the code to center the official buttons, just for the future.

This should do the trick:

.sd-content {
	margin: 0 200px;
}

Like always, thank you very much for your kind and fast attention.

Best regards!! ??