Custom Sharing Buttons
-
Hello!
I have customized icons that I would like to use for my sharing buttons (ie. facebook, instagram, email, etc.).
Can I use them on my blog?
If so, how do I install them?
Thank you!
CourtneyThe blog I need help with is: (visible only to logged in users)
-
Hi Courtney,
Sure, you can add your own icons. Here’s how | http://en.support.wordpress.com/add-social-media-buttons-to-your-sidebar-or-footer/
Hope this helps. -
That of course only refers to putting Social Media icons in your sidebar as individual links.
If you are referring to the Sharing buttons that appear after posts and pages, it is possible to change the standard WPcom icons, but it involves a lot more work to do so. See here: http://en.support.wordpress.com/sharing/#adding-your-own-service where you are not adding a new service, but changing the icon to your customized ones. You’ll need to figure out the custom URL as well. Here is a post that may help http://ryanmarkel.com/3004/adding-specific-sharing-services-to-sharedaddy-or-jetpack/
-
Hi Courtney,
If you upload the images you want to use to your media library and then post the URLs to a couple of them here as an example I can take a look at how to add them to your “Share This” buttons and help you out,
To get started, here’s how to remove the existing icons to show just the text on the buttons (although I think this might be something you can change within the sharing options anyway!):
#jp-post-flair .sd-content ul a:before { content:""; } -
@courtneybruettephoto, I see you are still using the built in sharing icons. Did you still want to use your own custom icons or are you happy with things the way they are?
-
Hi,
Yeah, I think for now I won’t mess with it.. I will keep this conversation and apply it if I change my mind later.
Thank you all so much for your time and help!! I appreciate it!
Take care :)
-
-
Hi guys,
Thank you for your help!
I was able to get the images I wanted to appear as the icon for the sharing button BUT it is so so so tiny! I have tried changing the size prior to uploading it to the media library but it doesn’t seem to matter what size I made it. Does this make sense?
Also, I just switched themes to Harmonic and love how on the demo they have the icons on the top left corner. How do I do this? Will it lead them to my Instagram or Facebook, etc?
I’m sorry for all the questions and thank you for all your help!
Warmly,
Courtney -
Courtney, the social icons are a separate menu. You create the menu at Appearance > Menu, assign it to the Social Menu location and then save. See our support page here.
-
As far as which services are supported in Harmonic, I’m waiting for the theme designer to get back to me on that. It doesn’t say in the theme documentation on on the social links menu support page.
-
Thank you! I will look at the social menu now :)
I also cannot get my logo/signature in that same top left corner where I want the social icons (how it appears on the demo).
I can get text entered up there but not my logo.
Any ideas on that?
Thanks for being here for all my questions! I appreciate it all so much!
-
-
Great on the social menu.
On the logo, I see this in your media library, https://courtneybruettephotography.files.wordpress.com/2014/11/cbphotographysignature_smallerwhite_black2.jpg , but it is very large and although I can make it fit in the site-title area, it would lose a lot of clarity. Is that the image you want to use, or do you have a different one?
First thing you would want to do is to go back to Settings > General and add in the site title. We can hide that with CSS, but it needs to be there so the search engines can find it (they like sites to have titles).
-
Hi,
Yes that is the correct image. How do we get it up there?
I added the title and would like to hide it now :)
Thank you!
-
The image you have now is way too large. The area for the logo would be about 189px x 65px. The following coded uses the CSS equivalent of a hammer to resize the image, but as you will see, it loses a lot of clarity and it should be resized in an image editing program and then uploaded. After uploading it, you would get the URL of that image and replace the URL in the background declaration below with that new URL.
h1.site-title { margin-top: 0; margin-bottom: 0; max-width: 200px; background: url("https://courtneybruettephotography.files.wordpress.com/2014/11/cbphotographysignature_smallerwhite_black2.jpg") no-repeat scroll 0 0; background-size: contain; line-height: 0.6; } h1.site-title a { color: rgba(0, 0, 0, 0) !important; } -
Thank you so much! This worked beautifully.
Is there anything I could do to make the logo more crisp? As you said, the quality has gone down quite a bit.
-
You need to create a new one off of your original in your image editing program and size it to around 200px wide by about 65px tall and then use that logo. Sizing the one you have in your media library down from 900px in width using CSS is just too much. Also, you may have to play with font weights if the font strokes look too narrow at that size.
-
Okay great! Thank you! I will play with that.
Do you know how I can make slideshows go fullwidth/full screen?
I just discovered how big beautiful and dramatic the featured images are on my various pages and would love to create that same wow factor on the homepage of my website with a slideshow.
I am sorry I keep asking you so many questions! And I appreciate all of your help so much :)
-
Do you know how I can make slideshows go fullwidth/full screen?
This isn’t something you can do with CSS only. Sorry about that!
I checked http://courtneybruettephotography.com/ just now and I see that you have a pretty large slideshow displayed already.
You might be vested in using the theme you’ve already picked, but there are a few newer themes that have interesting built-in slider options. Most don’t auto-advance like a slideshow but a couple of them do. The Ladder theme is one example. If you’re interested, take a look at the demo site at http://ladderdemo.wordpress.com/ and then read through this page to see how the slider option works: https://wordpress.com/themes/ladder/support/
-
Hi DesignSimply!
Thank you for your help and suggestion!
Do you know what pages would look like on the Ladder theme with or without the featured image? It says the featured image has to be the whole background but I love the way it looks on Harmonize where it stands out as an introduction to the page. Is that possible with the Ladder theme?
I like that there are different page options with the Harmonize theme and the Ladder theme does not list those other options if they have any. Do you know?
Thank you so much!
- The topic ‘Custom Sharing Buttons’ is closed to new replies.
WordPress.com Forums 
