Kred Elite Influencers Badge Code

Two weeks ago we awarded gold badges to our 1%, 5% and 10% top Elite influencers; many folks responded asking how they could get the snippet of code to place the badge on their social media profiles, blogs and email signatures.

We heard you and our design team has delivered. Today we are sending out badges to all of those who received the original elite influencers badge award.

We would love for you to share a link or a screen-grab once you add the badge to your site – we are collecting amazing blogs screenshots and we would be delighted to include yours.

UPDATE: We are including a brief tutorial below on how to use and get the most out of your HTML Elite Influencers badge code.

The first and most important thing is to make sure you copy and paste the entire snippet correctly.

Resizing your Badge 

Use the “style” attribute in the img tag (in bold) to resize it to whatever size you may want, as well as apply any other styles you desire. The width is adjustable. The height will stay fixed in proportion to whatever width you choose.

In the example below you will also need to replace name below with your twitter @name and your personalized badge will be created for you.

<a href=”http://kred.com/name” target=”_blank”><img src=”http://pbcdn.peoplebrowsr.com/widget/kredtopbadge/name/” style=”width:200px; border:0px;”/></a>

Here is a beginners tutorial on inline css styles: http://webdesign.about.com/od/beginningcss/qt/tipcssinlinesty.htm

Implementing the Badge Code on Blogs & Profiles

Blogs like WordPress, Blogger and Blogspot you have a couple options. If you would like to include the badge in an actual blog post itself, make sure you are in ‘HTML format or view” when you cut and paste the code. If you would like to add the badge to a blog sidebar, use the layout option on your blog. Select the HTML/Javascript option. Set your title and then paste the snippet of code and hit save. Your Badge should now appear in your blog sidebar.

In Tumblr, when creating the post- you want to make sure to click the HTML (edit HTML source), a window will pop-up and you simply paste the code snippet in and save.

If your email client supports and you have HTML on, you can add the badge code to your signature by simply pasting it in your email client’s settings area that manages signatures.

Gmail uses a Rich Text Editor for it’s signatures. As the embed badge code is provided in HTML, we suggest using a 3rd party tool. You can create your signature using a tool like WiseStamp, a signature plugin for Gmail and Google apps – which supports a ‘better’ HTML editor.  Once defined in the tool, simply copy the result from the ‘normal’ view, not the HTML view, and paste it into the Gmail signature edit box.

Now go forth and spread the Kred.

About Andrew Grill

CEO of Kred @andrewgrill
No comments yet.

Leave a Reply