wordpress给分类目录添加缩略图的方法

方法1、Categories Images插件。

Categories Images是一款扩展wordpress分类功能、添加分类图片的插件,该插件支持默认wordpress的文章类型,也支持wordpressP自定义文章类型以及多站点。这个插件使用比较简单,可以轻松上手,这里就不多做介绍 ,网上这方面的 次料很多。

方法2、代码实现。

个人还是比较喜欢直接代码实现,这样做,既可以让网站不会有太多的插件而影响速度,也可以让wordpress主题集成更多的功能,这也是wordpress控们比较喜欢的方式,这就不多说了。其实,代码也是从插件中提练出来的,只是做了一些相应的改动。
第一步:在主题functions.php文件中添加如下代码:
/**
* Plugin Name: 分类图像
*/
define('Z_IMAGE_PLACEHOLDER', T_PATH."/img/random/5.jpg"); //默认缩略图
add_action('admin_init', 'z_init');
function z_init() {
$z_taxonomies = get_taxonomies();
if (is_array($z_taxonomies)) {
$zci_options = get_option('zci_options');
if (empty($zci_options['excluded_taxonomies']))
$zci_options['excluded_taxonomies'] = array();
foreach ($z_taxonomies as $z_taxonomy) {
if (in_array($z_taxonomy, $zci_options['excluded_taxonomies']))
continue;
add_action($z_taxonomy.'_add_form_fields', 'z_add_texonomy_field');
add_action($z_taxonomy.'_edit_form_fields', 'z_edit_texonomy_field');
add_filter( 'manage_edit-' . $z_taxonomy . '_columns', 'z_taxonomy_columns' );
add_filter( 'manage_' . $z_taxonomy . '_custom_column', 'z_taxonomy_column', 10, 3 );
}
}
}
// add image field in add form
function z_add_texonomy_field() {
if (get_bloginfo('version') >= 3.5)
wp_enqueue_media();
else {
wp_enqueue_style('thickbox');
wp_enqueue_script('thickbox');
}
}
// 在编辑表单中添加图像字段
function z_edit_texonomy_field($taxonomy) {
if (get_bloginfo('version') >= 3.5)
wp_enqueue_media();
else {
wp_enqueue_style('thickbox');
wp_enqueue_script('thickbox');
}
if (z_taxonomy_image_url( $taxonomy->term_id, NULL, TRUE ) == Z_IMAGE_PLACEHOLDER)
$image_text = "";
else
$image_text = z_taxonomy_image_url( $taxonomy->term_id, NULL, TRUE );
echo '<tr class="form-field">
<th scope="row" valign="top"><label for="taxonomy_image">图像</label></th>
<td><input type="text" name="taxonomy_image" id="taxonomy_image" value="'.$image_text.'" />
<button class="z_upload_image_button button">上传/添加图像</button>
<button class="z_remove_image_button button">删除图像</button>
<img class="taxonomy-image" src="' . $image_text . '" width="150" height="auto"/>
</td>
</tr>'.z_script();
}
// 图片上传函数
function z_script() {
return '<script type="text/javascript">
jQuery(document).ready(function($) {
var wordpress_ver = "'.get_bloginfo("version").'", upload_button;
$(".z_upload_image_button").click(function(event) {
upload_button = $(this);
var frame;
if (wordpress_ver >= "3.5") {
event.preventDefault();
if (frame) {
frame.open();
return;
}
frame = wp.media();
frame.on( "select", function() {
// Grab the selected attachment.
var attachment = frame.state().get("selection").first();
frame.close();
if (upload_button.parent().prev().children().hasClass("tax_list")) {
upload_button.parent().prev().children().val(attachment.attributes.url);
upload_button.parent().prev().prev().children().attr("src", attachment.attributes.url);
}
else
$("#taxonomy_image").val(attachment.attributes.url);
});
frame.open();
}
else {
tb_show("", "media-upload.php?type=image&amp;TB_iframe=true");
return false;
}
});
$(".z_remove_image_button").click(function() {
$("#taxonomy_image").val("");
$(this).parent().siblings(".title").children("img").attr("src","' . Z_IMAGE_PLACEHOLDER . '");
$(".inline-edit-col :input[name=\'taxonomy_image\']").val("");
return false;
});
if (wordpress_ver < "3.5") {
window.send_to_editor = function(html) {
imgurl = $("img",html).attr("src");
if (upload_button.parent().prev().children().hasClass("tax_list")) {
upload_button.parent().prev().children().val(imgurl);
upload_button.parent().prev().prev().children().attr("src", imgurl);
}
else
$("#taxonomy_image").val(imgurl);
tb_remove();
}
}
$(".editinline").live("click", function(){
var tax_id = $(this).parents("tr").attr("id").substr(4);
var thumb = $("#tag-"+tax_id+" .thumb img").attr("src");
if (thumb != "' . Z_IMAGE_PLACEHOLDER . '") {
$(".inline-edit-col :input[name=\'taxonomy_image\']").val(thumb);
} else {
$(".inline-edit-col :input[name=\'taxonomy_image\']").val("");
}
$(".inline-edit-col .title img").attr("src",thumb);
return false;
});
});
</script>';
}
// 保存分类图像,同时编辑或保存期限
add_action('edit_term','z_save_taxonomy_image');
add_action('create_term','z_save_taxonomy_image');
function z_save_taxonomy_image($term_id) {
if(isset($_POST['taxonomy_image']))
update_option('z_taxonomy_image'.$term_id, $_POST['taxonomy_image']);
}
// 通过图片网址获取附件
function z_get_attachment_id_by_url($image_src) {
global $wpdb;
$query = "SELECT ID FROM {$wpdb->posts} WHERE guid = '$image_src'";
$id = $wpdb->get_var($query);
return (!empty($id)) ? $id : NULL;
}
// 对于给定的term_id得到分类图像的URL(默认占位符图像)
function z_taxonomy_image_url($term_id = NULL, $size = NULL, $return_placeholder = FALSE) {
if (!$term_id) {
if (is_category())
$term_id = get_query_var('cat');
elseif (is_tax()) {
$current_term = get_term_by('slug', get_query_var('term'), get_query_var('taxonomy'));
$term_id = $current_term->term_id;
}
}
$taxonomy_image_url = get_option('z_taxonomy_image'.$term_id);
if(!empty($taxonomy_image_url)) {
$attachment_id = z_get_attachment_id_by_url($taxonomy_image_url);
if(!empty($attachment_id)) {
if (empty($size))
$size = 'full';
$taxonomy_image_url = wp_get_attachment_image_src($attachment_id, $size);
$taxonomy_image_url = $taxonomy_image_url[0];
}
}
if ($return_placeholder)
return ($taxonomy_image_url != '') ? $taxonomy_image_url : Z_IMAGE_PLACEHOLDER;
else
return $taxonomy_image_url;
}
function z_quick_edit_custom_box($column_name, $screen, $name) {
if ($column_name == 'thumb')
echo '<fieldset>
<div class="thumb inline-edit-col">
<label>
<span class="title"><img src="" alt="Thumbnail"/></span>
<span class="input-text-wrap"><input type="text" name="taxonomy_image" value="" class="tax_list" /></span>
<span class="input-text-wrap">
<button class="z_upload_image_button button">上传/添加图像</button>
<button class="z_remove_image_button button">删除图像</button>
</span>
</label>
</div>
</fieldset>';
}
// 缩略图列添加到类别管理
function z_taxonomy_columns( $columns ) {
$new_columns = array();
$new_columns['cb'] = $columns['cb'];
$new_columns['thumb'] = '图像';
unset( $columns['cb'] );
return array_merge( $new_columns, $columns );
}
// 缩略图列值添加到类别管理。
function z_taxonomy_column( $columns, $column, $id ) {
if ( $column == 'thumb' )
$columns = '<span><img src="' . z_taxonomy_image_url($id, NULL, TRUE) . '" alt="Thumbnail" class="wp-post-image"/></span>';
return $columns;
}
// “更改”插入“使用该图像”
function z_change_insert_button_text($safe_text, $text) {
return str_replace("Insert into Post", "Use this image", $text);
}
// 在类别列表中的图像
if ( strpos( $_SERVER['SCRIPT_NAME'], 'edit-tags.php' ) > 0 ) {
add_action( 'admin_head', 'z_add_style' );
add_action('quick_edit_custom_box', 'z_quick_edit_custom_box', 10, 3);
add_filter("attribute_escape", "z_change_insert_button_text", 10, 2);
}
// 注册插件设置
function z_register_settings() {
register_setting('zci_options', 'zci_options', 'z_options_validate');
add_settings_section('zci_settings', '', 'z_section_text', 'zci-options');
add_settings_field('z_excluded_taxonomies', '排除的分类','z_excluded_taxonomies', 'zci-options', 'zci_settings');
}
function z_add_style() {
echo '<style type="text/css" media="screen">
th.column-thumb {width:60px;}
.form-field #taxonomy_image {border:1px solid #eee;width:200px; margin-left:30px;}
.inline-edit-row fieldset .thumb label span.title {width:48px;height:48px;border:1px solid #eee;display:inline-block;}
.column-thumb span {width:48px;height:48px;border:1px solid #eee;display:inline-block;}
.inline-edit-row fieldset .thumb img,.column-thumb img {width:48px;height:48px;}
label{ font-weight:800; font-size:16px;}
.taxonomy-image {border:1px solid #eee;width:auto !important;height:60px; margin-bottom:-40px; }
#taxonomy_image{ margin-left:180px; }
#taxonomy_image,.z_upload_image_button,.z_remove_image_button{vertical-align:bottom !important;}
</style>';
}
如果觉得代码比较多,也可以把它放到一个单独的php文件中,然后,再在functions.php文件中引用它。
第二步:在前台页面模板中调用这个分类缩略图。
在当前分类目录页面调用代码:
<img src="<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url(); ?>">
或者
<?php if (function_exists('z_taxonomy_image_url')&&(z_taxonomy_image_url()!="")){ ?>
<img src="<?php echo z_taxonomy_image_url(); ?>">
<?php } ?>
在其它页面调用代码:这里需要我添加一个分类目录ID号
<img src="<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url(栏目ID号); ?>">
或者
<?php
if(function_exists('z_taxonomy_image_url')&&(z_taxonomy_image_url(栏目ID号)!='')){
$img_url = z_taxonomy_image_url(栏目ID号);
}else{
$img_url = T_PATH.'/img/banner/catt.jpg'; //默认图片
}
?>
<img src="<?php echo $img_url; ?>" alt=""/>

通过上面的代码,我们就实现了在wordspress分类目录中添加了缩略图功能模块,如果你也想让自己的网站主题的不同分类目录显示不同的banner图片的话,那就不防用一用上面的2种方法,从此你的网站就与众不同哦。

时间: 2024-09-20 19:37:35

wordpress给分类目录添加缩略图的方法的相关文章

wordpress自动调用文章缩略图的方法总结

一.自动显示文章第一张图片 在当前使用的主题模板的functions.php文件<?php和?>之前添加以下代码  代码如下 复制代码 function catch_that_image() {       global $post, $posts;       $first_img = '';       ob_start();       ob_end_clean();       $output = preg_match_all('/<img.+src=['"]([^'&

比例尺、缩略图、平移缩放之百度地图添加控件方法_javascript技巧

下面通过图文并茂的方式给大家详细介绍下比例尺.缩略图.平移缩放之百度地图添加控件方法. 地图控件概述 百度地图上负责与地图交互的UI元素称为控件.百度地图API中提供了丰富的控件,您还可以通过Control类来实现自定义控件. 地图API中提供的控件有: Control:控件的抽象基类,所有控件均继承此类的方法.属性.通过此类您可实现自定义控件. NavigationControl:地图平移缩放控件,PC端默认位于地图左上方,它包含控制地图的平移和缩放的功能.移动端提供缩放控件,默认位于地图右下

ASP.NET实现根据URL生成网页缩略图的方法_实用技巧

本文实例讲述了ASP.NET实现根据URL生成网页缩略图的方法.分享给大家供大家参考,具体如下: 工作中需要用到根据URL生成网页缩略图功能,提前做好准备. 在网上找了份源码,但是有错误:当前线程不在单线程单元中,因此无法实例化 ActiveX 控件"8856f961-340a-11d0-a9",解决后运行良好,记录在此备用! 起始页:Default.aspx <%@ Page Language="C#" AutoEventWireup="true&

WordPress修改文章ID不连续的方法

WordPress有个比较讨厌的功能,就是默认情况下发布的文章ID不是连续的,使用ID做为Permalink结构的用户将会看到一个地址越来越混乱的WordPress,之前很多方法都是要修改WordPress代码,导致一升级WordPress,修改就会失效,现在我给一个解决WordPress的ID不连续的完美方法,即使WordPress升级,也不会导致该方法失效. 找到当前主题目录,在主题目录下到文件functions.php,将下述代码添加到文件里面. 这样如果你只是单纯发文章,不发页面,不添加

PHP往XML中添加节点的方法

 这篇文章主要介绍了PHP往XML中添加节点的方法,涉及php操作XML文件的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了PHP往XML中添加节点的方法.分享给大家供大家参考.具体方法如下: 1. contacts.xml代码 代码如下: <contact id="43956"> <personal> <name> <first>J</first> <middle>J</middl

Excel中合并单元格中快速添加序号的方法

  Excel中合并单元格中快速添加序号的方法          如下图所示,需要在数据的A列加入序号: 如果我们利用传统的拖动填充方式添加序号,系统会弹出这样的提示:"此操作要求合并单元格都具有相同大小" 即不能对数据源格式进行修改,又不能用常规方法添加序号,怎么办呢? 要手工逐个的填写吗? 答案是否定的,如果数据量太大的话,我们不可能一个一个去手工添加吧. 这里给大家介绍一个简单的方法. 首先,选中要添加序号的单元格: 编辑栏输入公式: =MAX($A$1:A1)+1 注意关键的一

搜狗浏览器添加收藏网页方法

  很多时候,当我们在上网的时候,会发现一些有趣的网站,这个时候,你可以将网站添加收藏.那么,搜狗浏览器添加收藏网页方法呢?下面,就一起来看看吧. 1. 添加收藏2. 导入其他收藏方法一:如下图所示,点击地址栏右侧的"小星星"图标可以提示添加收藏; 方法二:对于习惯点击收藏栏左侧的收藏图标的用户,也还可以继续点击收藏图标进行添加收藏.

金山WPS字体添加纹理的方法

  在今天的金山WPS文字处理教程中,我们将给大家分享的是给字体添加纹理的方法.这也是WPS特有的功能之一.给字体添加纹理之后,不仅字体变得更美观.醒目了,而且也字体效果与众不同,也更能吸引观看者的注意力.下面,就一起来看看WPS字体添加纹理的方法吧! WPS添加纹理图案在不打印的情况下查看背景可以用下面的方法: 打印需要使用其它方法,页眉页脚法: 选择视图选项卡中的页眉页脚,进入页眉页脚编辑状态,选择插入选项卡中的"形状"画一个和纸张一样大的矩形,设置填充效果,并且右击,选择叠放层次

Javascript创建自定义对象:创建Object实例添加属性和方法

文章简介:创建自定义对象的最简单的方式就是创建一个Object实例,然后再为它添加属性和方法. 创建自定义对象的最简单的方式就是创建一个Object实例,然后再为它添加属性和方法,如下所示: var person = new Object(); person.name = "Nicholas"; person.age = "29" person.job = "Software Engineer"; person.sayName = functio