非插件给wordpress分类目录和页面添加bannle图的方法
前面教程中我们介绍了通过插件：Categories Images
来实现wordpress分类调用图片的方法，今天给大家介绍非插件实现bannle图的方法。
第一步需要在主题函数function.php 里面添加以下代码
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 |
第一步：在主题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&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文件里面，直接调用会好些。
第二步：在页面中进行调用就可以了
|
1 |
<img src=”<?php if (function_exists(‘z_taxonomy_image_url’)) echo z_taxonomy_image_url(); ?>”> |
在其它页面调用代码：这里需要我添加一个分类目录ID号
|
1 |
<img src=”<?php if (function_exists(‘z_taxonomy_image_url’)) echo z_taxonomy_image_url(栏目ID号); ?>”> |
通过这个方法，可以很方便调用wordpress分类的图片，不需要用到插件。
© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
