Day 23: How to make a social networking button

You can easily make your own buttons and code it in to your blog. Since i am on wordpress, Java script is a no-no. So this post outlines how to put up social networking buttons in HTML friendly language. The same process applies to stitching in a regular linked button as well!

Pantone Colour of the Year Social Media Icons set featured above by Isa Seminaga is available for free at her website. Its a nice sleek minimalist set, and I would have used them but honey suckle and tangerine are a few shades different from Bueno default pink. Im not crazy about pink, but i like how streamlined this theme is for food photos and a pop of color for contrast is still nice. I had to edit mine in photoshop to match the date headers of the wordpress Bueno Theme.

The difficulty lies in getting all the coding to work. Two out of three that i really really wanted are working (most of the time). I know some people have gotten an instagram feed or button to work but im still stuck on the whole “it doesn’t have an rss feed” issue. That aside, you can link your FB, Pinterest, Deviant art, Tumblr, Blogger, yout tube, or whatever else you want to.

Basically, upload you icon image to a photo bucket/flickr/online media library. Decide your desired link through point, and link it to the photo. For this you will use the text box widget of wordpress, or the html-java box of blogger, or a similar service on your platform. The code follows:

</a>
<a href=”[insert link]” target=”_blank”><img src=”[insert button image]”></a>
</a>

and you have an image that will send the reader to your link. Ta-dah!

is the command that makes it open up in a new window, if you dont mind the click through you can remove it.

I’m not sure what the /a command stands for but its pretty important. The HTML will show up as text without it.

Placing a ; comman is like hitting the enter key, it leaves a space between the next and the previous image or line.

I hope this helps you. Im not an HTML master or anything. Far from it. This is just garnered from looking around, and a couple days of frustration.

How about you? Do you know any cool HTML tips for blogging? Is there a better way to make my buttons work? Are you planing on making a button set too?

30Doc 2012 banner

Curious about 30 days of creativity? Click here for my other 30 DoC 2012 posts.

Advertisements

5 thoughts on “Day 23: How to make a social networking button

  1. twitter.com says:

    want to affiliate physical products, then you’d want to probably work with Amazon or.
    Before engaging an online marketing consultant therefore,
    make sure they have all of these skills and more, in order for them
    to offer you a great value proposition. Once you have unveiled your web campaign function, keep track of how guests respond on blogs or
    other social network sites.

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