关闭

WordPress 为分类添加图片的插件:Categories Images

891人阅读 评论(0) 收藏 举报
分类:

Categories Images is a WordPress plugin which allow you to add an image for each category (or term), it is so easy to user. This plugin will create a new text input that will had the image url of the category, in both forms when adding a new category or edit an existing one, you can put a url for the image or upload it bu click on the text input.

Installation:

  1. Open your wordpress admin panel, then plugins menu > Add New and search for ‘Categories Images’.
  2. Click to install.
  3. Once installed, activate and it is functional.

Or you can install in manual:

  1. Download the plugin from WordPress Plugins.
  2. Extract it, then upload the extracted folder ‘categories-images’ to ‘/wp-content/plugins/’.
  3. Go to your wordpress plugins menu, then activate it.

You are done! And the plugin is ready to use.
Usage and documentation:
after installing and activating the plugin, just use the following code:
Default usage:
use the following code in category or taxonomy template,put it in any <img /> tag :
1
<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url(); ?>

or simply:

1
<?php if (function_exists('z_taxonomy_image')) z_taxonomy_image(); ?>
Difference between the two methods are as following:
  • z_taxonomy_image_url() return the taxonomy image url as a string so you can put it in any <img /> tag with support of the following parameters:
    • $term_id, the category or taxonomy ID, default NULL
    • $size, default ‘full’
    • $return_placeholder, default FALSE
  • z_taxonomy_image() return category or taxonomy image as html with support of the following parameters:
    • $term_id, the category or taxonomy ID, default NULL
    • $size, image size (check here for more about WordPress image resizing), default ‘full’
    • $attr, array of some html img tag attributes like: (default NULL) please check parameter $attrhere
      • alt, default is the image file name
      • class, default is ‘attachment-$size’
      • height, default none
      • width, default none
      • title, default none
    • $echo, to enable or disable printing out the html, default TRUE.
Using inside a loop:
use the following code in anywhere at your wordpress theme, here is an example:
If  looping for categories:
1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_categories() as $cat) : ?>
 <li>
 <img src="<?php echo z_taxonomy_image_url($cat->term_id); ?>" />
 <a href="<?php echo get_category_link($cat->term_id); ?>"><?php echo $cat->cat_name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

or

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_categories() as $cat) : ?>
 <li>
 <?php z_taxonomy_image($cat->term_id); ?>
 <a href="<?php echo get_category_link($cat->term_id); ?>"><?php echo $cat->cat_name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

If looping for taxonomies:

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_terms('your_taxonomy') as $cat) : ?>
 <li>
 <img src="<?php echo z_taxonomy_image_url($cat->term_id); ?>" />
 <a href="<?php echo get_term_link($cat->slug, 'your_taxonomy'); ?>"><?php echo $cat->name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

or

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_terms('your_taxonomy') as $cat) : ?>
 <li>
 <?php z_taxonomy_image($cat->term_id); ?>
 <a href="<?php echo get_term_link($cat->slug, 'your_taxonomy'); ?>"><?php echo $cat->name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

If your post had more than one category and you want to loop for all post categories use the following example:

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_the_category() as $cat) : ?>
 <li>
 <img src="<?php echo z_taxonomy_image_url($cat->term_id); ?>" />
 <a href="<?php echo get_category_link($cat->term_id); ?>"><?php echo $cat->cat_name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

or

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_the_category() as $cat) : ?>
 <li>
 <?php z_taxonomy_image($cat->term_id); ?>
 <a href="<?php echo get_category_link($cat->term_id); ?>"><?php echo $cat->cat_name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

And if your post had more than one taxonomy and you want to loop for all post taxonomies use the following example:

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_the_terms(get_the_ID(), 'your_taxonomy') as $cat) : ?>
 <li>
 <img src="<?php echo z_taxonomy_image_url($cat->term_id); ?>" />
 <a href="<?php echo get_term_link($cat->term_id, 'your_taxonomy'); ?>"><?php echo $cat->name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

or

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_the_terms(get_the_ID(), 'your_taxonomy') as $cat) : ?>
 <li>
 <?php z_taxonomy_image($cat->term_id); ?>
 <a href="<?php echo get_term_link($cat->term_id, 'your_taxonomy'); ?>"><?php echo $cat->name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

Using resizing feature:

To resize category image simply add the size as a second parameter, for example:
if in category or taxonomy template:

1
<img src="<?php echo z_taxonomy_image_url(NULL, 'thumbnail'); ?>" />

or

1
<?php z_taxonomy_image(NULL, 'thumbnail'); ?>

or if inside a loop:

1
2
3
4
5
6
7
8
<ul>
 <?php foreach (get_the_terms(get_the_ID(), 'your_taxonomy') as $cat) : ?>
 <li>
 <img src="<?php echo z_taxonomy_image_url($cat->term_id, 'medium'); ?>" />
 <a href="<?php echo get_term_link($cat->term_id, 'your_taxonomy'); ?>"><?php echo $cat->name; ?></a>
 </li>
 <?php endforeach; ?>
</ul>

you can choose to resize from these (thumbnail, medium, large, full) or any custom sizes, also you can use it as array with dimensions for example:

1
<img src="<?php echo z_taxonomy_image_url(NULL, array(300, 250)); ?>" />

or

1
<?php z_taxonomy_image(NULL, array(300, 250)); ?>

Please check WordPress codex here for more information about resizing.

To display image with support for alt, class, width and height, you can do as this example:

1
2
3
4
5
6
7
8
9
<?php
$attr = array(
'class' => 'category_image',
'alt' => 'image alt',
'height' => 200,
'width' => 300,
'title' => 'category title',
);
z_taxonomy_image(NULL, 'full', $attr); ?>

if there were any bugs or you faced any problems please reply to this post, if I had more time I will update this plugin and add more features.

update 26-07-2012: I had noticed that there is some people talking about my plugin, here is a link to the post :)

http://wpshock.com/wordpress-category-images-taxonomy-images-plugin/

another one here also:

http://www.williamsgraphics.co.uk/featured-images-categories-wordpress/

Update 06-10-2012: Finally I got some time to test the plugin in WordPress MU and now I confirm that the plugin works so fine whether you choose to activate the plugin by blog or using network activation from your network control panel

Update 25-01-2013: A great update had been made to this plugin, and hope you liked it, Thank so much to Joe Tse http://tkjune.com

Update 14-06-2013: I had updated the plugin with some new features like using WordPress new media uploader and new sub menu (Categories Images) in Settings menu allowing you to exclude any taxonomies from the plugin, this for fixing and avoiding any conflicts with another plugins like WooCommerce plugin, hope you all like the last update.

Update 20-12-2013: I had updated the plugin with new features like resizing images please check the docs above for more help about using this new feature, and also adding support for Spanish language. Thanks so much to Maria Ramos and to Rahil Wazir for their help.

Update 2.5 28-03-2015: A nice update which introduce a new function to display category or taxonomy image directly with support for size and alt and more attributes, please check the documentation above. Also adding support for Ukrainian language, thanks so much to Michael Yunat.

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:139711次
    • 积分:2344
    • 等级:
    • 排名:第16642名
    • 原创:90篇
    • 转载:93篇
    • 译文:1篇
    • 评论:2条