So... I know this isn't ground breaking news but I was just so excited I managed to this task I had to share.
I figured out how to not only use emoticons on my Blog... but I actually figured out how to make my own.
Awesome huh? Yeah I know!
So Awesome I just had to share... So this is what I did.
Step one... Get FireFox Mozilla
here (it's better than Explorer anyway, well at least to me it is)
Step two... Download GreaseMonkey
here. It enables you to use Java scripts in your Mozilla toolbar.
Step three... Download the EmotiConverter there's a link on FireFox Add-ons
here.
Step Four... Open the EmotiCoverter, it should be in your tools tab on your firefox window. Just open the Options. Copy and paste the http source for your favorite emoticons into the EmotiConverter and name them whatever you want to type to make them appear. Add the info to your list in the Converter.
Step five... create a post wherever you want, just make sure your coding is correct for whatever you are on... for instance forums are BBC code and HTML would be src=. On blogger you use HTML, so for that purpose you would use basic image codes like the ones found
here.
Step six... create your blog post using the edit HTML option. When you want to use your emoticon type the name you gave it. For instance I gave
the name "QTHeart".
To convert your text to images right click somewhere in the post and select the EmotiConverter. It will convert everything automatically.
Now take it a step further and make your own emoticons.
Step one... make an image in photoshop or something. For small emoticons that fit well with your size 2 text (11pt) try to make it no bigger than 16px by 16px.
Step two... Save it as a gif, jpeg, png whatever... yes you can make animated ones. Upload the image to a hosting site. Any gallery is fine as long as you can get the link to your image.
Step three.. Copy your link and paste into the EmotiConverter just like for your favorite emoticons as before and name it.
Lastly... some people were having problems with borders around the images. To fix that go to your Blogger Dashboard. Select your Blog's layout link. From there click the edit HTML tab.
Surf the HTML code for the post image part, it should look something like this. Just make sure it says ".post img" :
.post img {
padding:4px;
border:1px solid $bordercolor;
Once you found it change the border from 1px to 0px. This eliminates the border on all images in your posts. If you want to add a border back to your images I suggest you add one in Photoshop to your image before you upload to Blogger. Remember if you decide you want to add the border back to all images just change the pixels back to 1px.
That's it you guys ... hope that helps
Mata Ne