編輯“WordPress:Using Smilies”

== What Are Smileys? ==
Smileys, also known as "emoticons," are ''glyphs'' used to convey emotions in your writing. They are a great way to brighten up posts. [[WordPress:Image:icon_smile.gif|smile emoticon]]

Text smileys are created by typing two or more punctuation marks. Some examples are:

<tt>;-)</tt> is equivalent to [[WordPress:Image:icon_wink.gif|smile emoticon]]<br />
<tt>:-)</tt> is equivalent to [[WordPress:Image:icon_smile.gif|smile emoticon]]<br />
<tt>:-(</tt> is equivalent to [[WordPress:Image:icon_sad.gif|sad emoticon]]<br />
<tt>:-?</tt> is equivalent to [[WordPress:Image:icon_confused.gif|confused emoticon]]<br />

To learn more about emoticons and their history, see the [http://en.wikipedia.org/wiki/Emoticons Wikipedia entry on Emoticons].

== How Does WordPress Handle Smileys? ==
By default, WordPress automatically converts text smileys to graphic images. When you type <tt>;-)</tt> in your post you see [[WordPress:Image:icon_smile.gif|smile emoticon]] when you preview or publish your post.

== To Turn off Graphic Smileys ==
If you turn off graphic smileys, whatever you type in plain text will remain, and be displayed, as plain text.

# Go to your Admin Panel
# Select ''Options > Writing''
# In the ''Formatting'' section, '''uncheck''' the box for "''Convert emoticons like :-) and :-P to graphics on display''"

Turning off emoticons means that when you type <tt>;-)</tt> in a post you will see <tt>;-)</tt> when you preview or publish your post. So it doesn't stop you from using emoticons as plain text. [[WordPress:Image:icon_wink.gif|wink emoticon]]

== What Text Do I Type to Make Smileys? ==
Smiley images and the text used to produce them*:

{| border="1" cellpadding="2" width="90%"
! icon !! text !! text !! full text !! icon !! full text
|-
|[[WordPress:Image:icon_smile.gif|smile]]
|:)
|:-)
|:smile:

|[[WordPress:Image:icon_lol.gif|lol]]
|:lol:

|-
|[[WordPress:Image:icon_biggrin.gif|biggrin]] 
|:D
|:-D
|:grin:

|[[WordPress:Image:icon_redface.gif|redface]]
|:oops:

|-
|[[WordPress:Image:icon_sad.gif|sad]]
|:(
|:-(
|:sad:

|[[WordPress:Image:icon_cry.gif|cry]]
|:cry:

|-
|[[WordPress:Image:icon_surprised.gif|surprised]]
|:o
|:-o
|:eek:

|[[WordPress:Image:icon_evil.gif|evil]]
|:evil:

|-
|[[WordPress:Image:icon_eek.gif|eek]]
|8O
|8-O
|:shock:

|[[WordPress:Image:icon_twisted.gif|twisted]]
|:twisted:

|-
|[[WordPress:Image:icon_confused.gif|confused]]
|:?
|:-?
|:???:

|[[WordPress:Image:icon_rolleyes.gif|rolleyes]]
|:roll:

|-
|[[WordPress:Image:icon_cool.gif|cool]]
|8)
|8-)
|:cool:

|[[WordPress:Image:icon_exclaim.gif|exclaim]]
|:!:

|-
|[[WordPress:Image:icon_mad.gif|mad]]
|:x
|:-x
|:mad:

|[[WordPress:Image:icon_question.gif|question]]
|:?:

|-
|[[WordPress:Image:icon_razz.gif|razz]]
|:P
|:-P
|:razz:

|[[WordPress:Image:icon_idea.gif|idea]]
|:idea:

|-
|[[WordPress:Image:icon_neutral.gif|neutral]]
|:<nowiki>|</nowiki>
|:-<nowiki>|</nowiki>
|:neutral:

|[[WordPress:Image:icon_arrow.gif|arrow]]
|:arrow:

|-
|[[WordPress:Image:icon_wink.gif|wink]]
|;)
|;-)
|:wink:

|[[WordPress:Image:icon_mrgreen.gif|mrgreen]]
|:mrgreen:
|}

''* In some instances, multiple text options are available to display the same smiley.''

[[WordPress:Category:Getting Started]]

== Troubleshooting Smileys ==

=== Why Doesn't it Work? ===
Smileys may have been disabled by your Wordpress admin. Another possibility is  the smiley image files have been deleted from <tt>/wp-includes/images/smilies</tt>.

=== Why Doesn't it Work for Me? ===
''If smileys work for others at your site but not for you:''

Type a space before and after your smiley text. That prevents the smiley being accidentally included in the text around it. [[WordPress:Image:icon_redface.gif|redface emoticon]]

Make sure not to use quotes or other punctuation marks before and after the smiley text. [[WordPress:Image:icon_rolleyes.gif|rolleyes emoticon]]

=== Where Are My Smiley Images Kept? ===
The smiley or emoticon image graphics are found in the <tt>/wp-includes/images/smilies</tt> directory.

Note that smileys is spelled 'eys' in this documentation and the directory name for the smiley images is '''smilies'', spelled 'ies'. [[WordPress:Image:icon_eek.gif|eek emoticon]]

=== How Can I Have Different Smiley Images Appear? ===
''Simplest way:''

# Find your smiley image files in the <tt>/wp-includes/images/smilies</tt> directory and back them up to another directory
# Note the names of each smiley file. Your files must match these names and should be in the same 'gif' image format.
# For predictable behavior, the image sizes should be similar.
# Upload your new files to the <tt>/wp-includes/images/smilies</tt> directory with an [[WordPress:FTP_Clients|FTP program]].

''If you're up to hacking the code:''

If you really must change the file names of the images, edit the file that refers to these images, ''''vars.php'''' (in WordPress 2.2, they're located in ''''functions.php''''), situated in the <tt>/wp-includes/</tt> directory. Follow all precautions when "hacking code".

You can read a tutorial explaining all this in more detail, as well as how to avoid hacking WP code, at [http://aranea.zuavra.net/index.php/20/ Ars Aranea].

There are also WordPress Plugins which allow you to customize your smilies in WordPress.

=== Why are my Smiley Images Blank? ===
If you recently uploaded the images, it could be that the images have been uploaded in '''''ASCII''''' format by your FTP program. Re-upload the smileys ensuring that they are transferred in '''''BINARY''''' format. 

Some FTP programs have an '''auto-detect''' setting which will upload files in the correct format without user intervention. If you have such a setting, turn it on.

== Smiley CSS ==
The smiley images in WordPress are automatically given a [[WordPress:Glossary#CSS|CSS]] class of '''wp-smiley''' when they are displayed in a post. You can use this class to style your smileys differently from other post images. 

For example, it's not uncommon to set up images in a post to appear on the left-hand side of the content with text flowing around the image. The CSS for that might look like this:

<pre>
.post img {
    float: left;
}
</pre> 

This would typically affect all images in a post, '''including''' your smiley images. To ''override'' this so that smileys stay inline, you could add this to your CSS:

<pre>
img.wp-smiley {
    float: none;
}
</pre> 

For more on CSS in WordPress, you might want to [[WordPress:CSS|start here]].

== More Information on Smileys ==
* [http://en.wikipedia.org/wiki/Emoticon Wikipedia - Emoticon]
* [http://www.smileygarden.de/ Smileygarden - Free Smileys, Smilies and Gifs]
* [http://www.World-of-Smilies.com World-of-Smilies - Smileys and Smileygenerator]
* [http://www.greensmilies.com Green Smilies presented with and for WordPress]