Last night, after I had got back from the UK I switched on my iMac to check ‘Mail’ and found rather a lot of you had read my last post which explains how to add a ‘Tweet Me’ link to your iWeb site and then edit the text a little to make the font blend in with your site.
17 of you sent me e-mails asking if it would be possible to achieve the same effect but with an image rather than just the text. So this morning I got up extra early to have a play around with iWeb and I can report that yes you can.
To start with (obviously) open iWeb at the page you want to add the button/icon to. It helps at this point to have your ‘Tweet Me’ image ready. There are hundreds of twitter icons available on the Internet; I have listed a few pages links at the bottom of this post.
I had my icon on the desktop so all I had to do was drag it on to my iWeb page and position it in the right place and get the size looking just right.
Make sure that the image is still ‘selected’ (it will have the white ‘handles’ on each corner) and then open ‘Inspector’.
Select the ‘Hyperlink’ tab (that’s the blue circle with the white arrow in).
In the ‘Link To:’ drop-down menu select ‘External page’.
In the ‘Name’ text-box copy/paste the hyperlink code shown below. Obviously you will have to change the URL (shown in red) to fit your iWeb page/iWeb blog post.
http://twitter.com/home?status=I just read http://www.yourdomain.com/postname.html
And that is it. You now have a ‘Tweet Me’ button on your iWeb site. Save and publish as normal.
And here are, as promised, a few sites to visit for twitter related icons and buttons;
Bloggodown.com – 400 free icons
Stockgraphicdesigns.com – Free Vector and PNGs
CSSStyleMe.com – Free icon set
Naldz Graphics.net – 6 adorable twitter iconsiweb addons, iweb blogs, iWeb customization, iweb inspiration