- 资源介绍
- 更新记录
- 安装教程
在文章列表编辑特色图像,看到这句话大概就知道今天要分享的是什么功能了。
具体效果如下图所示:
这是一个非常实用的功能,它能使我们在WordPress后台编辑文章时方便很多。
如果你的主题不支持缩略图请首先在functions.php中添加
<code src=\”\’ . wp_get_attachment_url( $thumb_id ) . \’\” />\’;
} else {
echo \'<img data-id=\”-1\” src=\”\’ . get_stylesheet_directory_uri() . \’/placeholder.png\” />\’;
}
}
}
然后,我们添加一些CSS样式来美化数组。
接下来添加JS代码使特色图像可以快速编辑和更新,首先排队加载WordPress默认上传:
<code class=\”inline-edit-col-left\”>
<div class=\”inline-edit-col\”>
<span class=\”title\”>特色图像</span>
<div>
<a href=\”#\” rel=\”external nofollow\” rel=\”external nofollow\” class=\”lb_upload_featured_image\”>设置特色图像</a>
<input type=\”hidden\” name=\”_thumbnail_id\” value=\”\” />
</div>
<a href=\”#\” rel=\”external nofollow\” rel=\”external nofollow\” class=\”lb_remove_featured_image\”>移除特色图像</a>
</div></fieldset>\’;
}
最后就是更新保存了,添加下面代码即可。
<code />\’).next().val(attachment.id).parent().next().show();
}).open();
});
$(\’body\’).on(\’click\’, \’.lb_remove_featured_image\’, function(){
$(this).hide().prev().val(\’-1\’).prev().html(\’设置特色图像\’);
return false;
});
var $wp_inline_edit = inlineEditPost.edit;
inlineEditPost.edit = function( id ) {
$wp_inline_edit.apply( this, arguments );
var $post_id = 0;
if ( typeof( id ) == \’object\’ ) {
$post_id = parseInt( this.getId( id ) );
}
if ( $post_id > 0 ) {
var $edit_row = $( \’#edit-\’ + $post_id ),
$post_row = $( \’#post-\’ + $post_id ),
$featured_image = $( \’.column-featured_image\’, $post_row ).html(),
$featured_image_id = $( \’.column-featured_image\’, $post_row ).find(\’img\’).attr(\’data-id\’);
if( $featured_image_id != -1 ) {
$( \’:input[name=\”_thumbnail_id\”]\’, $edit_row ).val( $featured_image_id ); // ID
$( \’.lb_upload_featured_image\’, $edit_row ).html( $featured_image ); // 图像 HTML
$( \’.lb_remove_featured_image\’, $edit_row ).show(); // 移除链接
}
}
}
});
</script>
<?php
}
这篇WordPress如何在文章列表编辑特色图像的教程到此就结束了,这篇教程由主题笔记原创,本站为转载。
文章来自大资源网https://www.dzy10.com转载请注明出处,并保留本链接,谢谢!
猜你在找
- 2020-06-07Hi,初次和大家见面了,请多关照!
最后编辑:2020-10-21



