from Blogging for Authors

Social Media

Connect with me on the sites you prefer, or click on the last 2 links to follow these example blogs.

icon Facebook 2 icon YouTube icon Twitter icon Google Plus icon Amazon Kindle icon linkedin 2 icon WordPress icon RSS

For those who want to know how to make custom social media widgets, like the one in the sidebar of this blog, here’s how I did it.

You’ll need to work with some general HTML Text code. In some cases, it’s easier to upload images that are a certain size, like 35 pixels, beforehand. So after I found the larger icons above, I made a copy of them and scaled them down to 35 pixels. Or you may be able to use width and height attributes in your HTML code like this one below that is a general guideline for this. Notice that this requires 3 things: your profile URL at social media sites, your blog media library (or a post) containing these smaller images ahead of time, and the source URL of those images that you get from your blog when you click on them.

<a href=”[full link to your Twitter]”><img title=”Twitter” src=”[image URL for Twitter icon]” alt=”Twitter” width=”35″ height=”35″ /></a><a href=”[full link to your Google Plus]”><img title=”Google Plus” src=”[image URL for Google Plus icon]” alt=”Google Plus” width=”35″ height=”35″ /></a> <a href=”[full link to your Facebook page]”><img title=”Facebook” src=”[image URL for Facebook icon]” alt=”Facebook” width=”35″ height=”35″ /></a> </a><a href=”[full link to your RSS feed]”><img title=”RSS” src=”[image URL for RSS icon]” alt=”RSS” width=”35″ height=”35″ /></a>

Next we have an example just for Google Plus, Facebook and Twitter (without the width and height labeled). This will work fine if your images are already uploaded to your blog in small images, like 35 pixels.

<a href=”Your Profile URL at Google Plus” target=”_blank”><img src=”Your Blog’s Google Plus Image URL” alt=”Google Plus” title=”add me to Google Plus” /></a>

<a href=”Your Profile URL at Facebook” target=”_blank”><img src=”Your Blog’s Facebook Image URL” alt=”Facebook” title=”Facebook” /></a>

<a href=”Your Profile URL at Twitter” target=”_blank”><img src=”Your Blog’s Twitter Image URL” alt=”Twitter” title=”@Your Twitter Handle” /></a>

Try creating small icon images, uploading them to your blog, accessing their URL’s, and then inserting the code for as many icons as you want in your widget or gadget. Good luck!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: