“Using Smilies”的版本间的差异

来自WordPress中文文档
跳转至: 导航搜索
What Are Smileys?
 
More Information on Smileys
第1行: 第1行:
 
== What Are Smileys? ==
 
== 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. [[Image:icon_smile.gif|smile emoticon]]
+
Smileys, also known as emoticons, are ''glyphs'' used to convey emotions in your writing. They are a great way to brighten up posts. [[Image:icon_smile.gif|smile emoticon]]
  
 
Text smileys are created by typing two or more punctuation marks. Some examples are:
 
Text smileys are created by typing two or more punctuation marks. Some examples are:
  
<tt>;-)</tt> is equivalent to [[Image:icon_wink.gif|smile emoticon]]<br />
+
tt;-)/tt is equivalent to [[Image:icon_wink.gif|smile emoticon]]br /
<tt>:-)</tt> is equivalent to [[Image:icon_smile.gif|smile emoticon]]<br />
+
tt:-)/tt is equivalent to [[Image:icon_smile.gif|smile emoticon]]br /
<tt>:-(</tt> is equivalent to [[Image:icon_sad.gif|sad emoticon]]<br />
+
tt:-(/tt is equivalent to [[Image:icon_sad.gif|sad emoticon]]br /
<tt>:-?</tt> is equivalent to [[Image:icon_confused.gif|confused emoticon]]<br />
+
tt:-?/tt is equivalent to [[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].
 
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? ==
 
== 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 [[Image:icon_smile.gif|smile emoticon]] when you preview or publish your post.
+
By default, WordPress automatically converts text smileys to graphic images. When you type tt;-)/tt in your post you see [[Image:icon_smile.gif|smile emoticon]] when you preview or publish your post.
  
 
== To Turn off Graphic Smileys ==
 
== To Turn off Graphic Smileys ==
第18行: 第18行:
  
 
# Go to your Admin Panel
 
# Go to your Admin Panel
# Select ''Options > Writing''
+
# Select ''Settings - Writing''
# In the ''Formatting'' section, '''uncheck''' the box for "''Convert emoticons like :-) and :-P to graphics on display''"
+
# 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. [[Image:icon_wink.gif|wink emoticon]]
+
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. [[Image:icon_wink.gif|wink emoticon]]
  
 
== What Text Do I Type to Make Smileys? ==
 
== What Text Do I Type to Make Smileys? ==
 
Smiley images and the text used to produce them*:
 
Smiley images and the text used to produce them*:
  
{| border="1" cellpadding="2" width="90%"
+
{| border=1 cellpadding=2 width=90%
 
! icon !! text !! text !! full text !! icon !! full text
 
! icon !! text !! text !! full text !! icon !! full text
 
|-
 
|-
第111行: 第111行:
 
|-
 
|-
 
|[[Image:icon_neutral.gif|neutral]]
 
|[[Image:icon_neutral.gif|neutral]]
|:<nowiki>|</nowiki>
+
|:nowiki|/nowiki
|:-<nowiki>|</nowiki>
+
|:-nowiki|/nowiki
 
|:neutral:
 
|:neutral:
  
第135行: 第135行:
  
 
=== Why Doesn't it Work? ===
 
=== 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>.
+
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? ===
 
=== Why Doesn't it Work for Me? ===
第145行: 第145行:
  
 
=== Where Are My Smiley Images Kept? ===
 
=== Where Are My Smiley Images Kept? ===
The smiley or emoticon image graphics are found in the <tt>/wp-includes/images/smilies</tt> directory.
+
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'. [[Image:icon_eek.gif|eek emoticon]]
 
Note that smileys is spelled 'eys' in this documentation and the directory name for the smiley images is '''smilies'', spelled 'ies'. [[Image:icon_eek.gif|eek emoticon]]
第152行: 第152行:
 
''Simplest way:''
 
''Simplest way:''
  
# Find your smiley image files in the <tt>/wp-includes/images/smilies</tt> directory and back them up to another directory
+
# 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.
 
# 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.
 
# For predictable behavior, the image sizes should be similar.
# Upload your new files to the <tt>/wp-includes/images/smilies</tt> directory with an [[FTP_Clients|FTP program]].
+
# Upload your new files to the tt/wp-includes/images/smilies/tt directory with an [[FTP_Clients|FTP program]].
  
 
''If you're up to hacking the code:''
 
''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".
+
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].
 
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].
第175行: 第175行:
 
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:
 
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>
+
pre
 
.post img {
 
.post img {
 
     float: left;
 
     float: left;
 
}
 
}
</pre>
+
/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:
 
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>
+
pre
 
img.wp-smiley {
 
img.wp-smiley {
 
     float: none;
 
     float: none;
 
}
 
}
</pre>
+
/pre  
  
 
For more on CSS in WordPress, you might want to [[CSS|start here]].
 
For more on CSS in WordPress, you might want to [[CSS|start here]].
  
 
== More Information on Smileys ==
 
== More Information on Smileys ==
 +
* [http://www.greensmilies.com Green Smilies presented with and for WordPress]
 +
* [http://www.smileygarden.de/ Smileygarden - Free Smileys, Smilies and Gifs]
 
* [http://en.wikipedia.org/wiki/Emoticon Wikipedia - Emoticon]
 
* [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 - A lot of free Smilies]
* [http://www.World-of-Smilies.com World-of-Smilies - Smileys and Smileygenerator]
+
 
* [http://www.greensmilies.com Green Smilies presented with and for WordPress]
+
 
  
 
[[Category:WordPress Lessons]]
 
[[Category:WordPress Lessons]]
 
[[Category:Getting Started]]
 
[[Category:Getting Started]]
 
[[Category:Design and Layout]]
 
[[Category:Design and Layout]]

2008年12月17日 (三) 17:29的版本

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. smile emoticon

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

tt;-)/tt is equivalent to smile emoticonbr / tt:-)/tt is equivalent to smile emoticonbr / tt:-(/tt is equivalent to sad emoticonbr / tt:-?/tt is equivalent to confused emoticonbr /

To learn more about emoticons and their history, see the 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 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.

  1. Go to your Admin Panel
  2. Select Settings - Writing
  3. 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. wink emoticon

What Text Do I Type to Make Smileys?

Smiley images and the text used to produce them*:

icon text text full text icon full text
smile :) :-) :smile: lol :lol:
biggrin :D :-D :grin: redface :oops:
sad :( :-( :sad: cry :cry:
surprised :o :-o :eek: evil :evil:
eek 8O 8-O :shock: twisted :twisted:
confused :? :-? :???: rolleyes :roll:
cool 8) 8-) :cool: exclaim :!:
mad :x :-x :mad: question :?:
razz :P :-P :razz: idea :idea:
neutral /nowiki /nowiki :neutral: arrow :arrow:
wink ;) ;-) :wink: mrgreen :mrgreen:

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

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. redface emoticon

Make sure not to use quotes or other punctuation marks before and after the smiley text. 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'. eek emoticon

How Can I Have Different Smiley Images Appear?

Simplest way:

  1. Find your smiley image files in the tt/wp-includes/images/smilies/tt directory and back them up to another directory
  2. Note the names of each smiley file. Your files must match these names and should be in the same 'gif' image format.
  3. For predictable behavior, the image sizes should be similar.
  4. Upload your new files to the tt/wp-includes/images/smilies/tt directory with an 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 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 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 start here.

More Information on Smileys