Yes! Now the
ET Smileys set is available for use in any blog or website. Read on to find out how to add them to your website.
* See the
list of smileys
* If you want to add smileys to your
Blogger blog, see
Smileys for blogspot
Follow the simple steps below to add the smiley functionality to your website/blog:
Step #1
1) In your website/blog's HTML code, search for the part saying
</head>
2) Now just
before this, insert the below code:
<script src="https://et-smileys.googlecode.com/svn/trunk/etSmileys.js" type="text/javascript"/>
And the first part is done!!
Step #2
Now you need to add the
etSmileys class to the sections in your blog where you like the smileys to appear.
If you want the smileys everywhere in the website, search for
<body> in the HTML code, and add the class as follows:
<body class="etSmileys" >
If you want the smileys in only particular sections of your blog, add the class to only those. For example, if a section has id
main-content, the code would look like this:
<div id="main-content"> ... </div>
Now add the new class as follows:
<div id="main-content" class="etSmileys"> ... </div>
If
main-content is already a class, then new code will look like this:
<div class="main-content etSmileys"> ... </div>
Alternate no-script-conflict no-wait-for-page-load version
The
above script will wait till the whole page loads for the smileys to
appear. There is an alternate version of the script which will be useful
in following situations:
- You have a lot of JavaScript added to your blog, and adding the smiley script results in some script conflict
- Some elements in your page is taking forever to load, and since the page is not loaded, smileys are not appearing
- For some reason you need more control over when exactly the smiley script is called
In any of these cases, you can use
the explicit-call version of the ET Smiley Script.
If you still have queries regarding adding the smileys, feel free to drop me a mail :)
How it works?
You can simply type in the emoticon symbols in your arrticle/post, like in a chat.
The
above script replaces the emoticon symbols you type with the
corresponding smileys. For this you'll have to know the correct symbol
for each smiley.
Example: :) becomes :)
See a full table listing the ET Smileys and their symbols at the end of this post. You can bookmark the above link for quick reference.
Adding a smileys reference panel
You can add a smileys reference panel anywhere in your blog by pasting the following code at that location:
Complete smiley panel
<script src="https://et-smileys.googlecode.com/svn/trunk/etSmileysPanelFull.js" type="text/javascript"/>
Minimalist smiley panel
<script src="https://et-smileys.googlecode.com/svn/trunk/etSmileysPanelBasic.js" type="text/javascript"/>
Usage guideline:
One important point you should remember is to
put a space before the symbol.. or else the smiley image won't appear.
Staying up-to-date and Keeping in touch..
The smiley list is never complete! Suggest your own ideas of interesting smileys that can be included in the list :i . You may make your suggestions at the comments. Please note that the current smileys are
16px in height, so that it won't create an unnecessary spacing between the text. So hope that your ideas won't go ABOVE that! :O
Whenever new smileys are added, the script will be updated automatically. But you'll need to know the new symbols for the fresh smileys. So stay connected to know the updates in the smiley data base.
Bookmark this page to stay in touch with the constantly updated smiley list and other related updates.
Put the
smiley badge in your blog to let others know of the smileys and also for a quick link!
Embed code:
Get the smiley updates via
Twitter:
Follow me on twitter
Hope that helped! 8)
Spread the Word
So have you decided to use the et smileys? Then do a little favor. Kindly link back to this page so that others can also come to know about this smiley set. Thank you!! :)
