正在尝试一些自定义元框,但我读过或找不到任何内容正在帮助我实现我实际所追求的目标。
我可以渲染一个新的元框,但我找不到在管理面板中实际更改帖子缩略图本身输出的方法。
function new_post_thumbnail_meta_box() {
global $post;
echo 'Content above the image.';
$thumbnail_id = get_post_meta( $post->ID, '_thumbnail_id', true );
echo _wp_post_thumbnail_html( $thumbnail_id );
echo 'Content below the image.';
}
function render_new_post_thumbnail_meta_box() {
global $post_type;
// remove the old meta box
remove_meta_box( 'postimagediv','post','side' );
// adding the new meta box.
add_meta_box('postimagediv', __('Featured Image'), 'new_post_thumbnail_meta_box', $post_type, 'side', 'low');
}
add_action('do_meta_boxes', 'render_new_post_thumbnail_meta_box');
如何在管理面板中显示更大或“实际尺寸”的精选图片版本?
复制包含功能并修改输出,这会引发服务器错误。
function _wp_post_thumbnail_html( $thumbnail_id = null, $post = null ) {
global $content_width, $_wp_additional_image_sizes;
$post = get_post( $post );
$upload_iframe_src = esc_url( get_upload_iframe_src('image', $post->ID ) );
$set_thumbnail_link = '<p class="hide-if-no-js"><a title="' . esc_attr__( 'Set featured image' ) . '" href="%s" id="set-post-thumbnail" class="thickbox">%s</a></p>';
$content = sprintf( $set_thumbnail_link, $upload_iframe_src, esc_html__( 'Set featured image' ) );
if ( $thumbnail_id && get_post( $thumbnail_id ) ) {
$old_content_width = $content_width;
$content_width = 600;
if ( !isset( $_wp_additional_image_sizes['post-thumbnail'] ) )
$thumbnail_html = wp_get_attachment_image( $thumbnail_id, array( $content_width, $content_width ) );
else
$thumbnail_html = wp_get_attachment_image( $thumbnail_id, 'post-thumbnail' );
if ( !empty( $thumbnail_html ) ) {
$ajax_nonce = wp_create_nonce( 'set_post_thumbnail-' . $post->ID );
$content = sprintf( $set_thumbnail_link, $upload_iframe_src, $thumbnail_html );
$content .= '<p class="hide-if-no-js"><a href="#" id="remove-post-thumbnail" onclick="WPRemoveThumbnail(\'' . $ajax_nonce . '\');return false;">' . esc_html__( 'Remove featured image' ) . '</a></p>';
}
$content_width = $old_content_width;
}
return apply_filters( 'admin_post_thumbnail_html', $content, $post->ID );
}
或者我应该使用add_image_size('post_thumbnail',600,400,true); ?既然这就是它的样子?
答案 0 :(得分:4)
以防万一有人在这个老帖子上磕磕绊绊。
WP引入了一个名为admin_post_thumbnail_size的新过滤器,您可以在管理面板中更改默认图片大小。
要更改特色缩略图的大小,您可以使用以下内容:
function custom_admin_thumb_size($thumb_size){
return "custom-image-size"; //or use something like array(400,400).
}
add_filter( 'admin_post_thumbnail_size', 'custom_admin_thumb_size');
答案 1 :(得分:1)
您应该将_wp_post_thumbnail_html
替换为get_the_post_thumbnail
答案 2 :(得分:1)
从WordPress 4.4开始,引入了一个新的过滤器admin_post_thumbnail_size
,它允许在精选图像元框中修改后缩略图图像的显示大小。
当主题添加“缩略图后”支持时,会注册特殊的“缩略图后”图像尺寸,这与通过“设置”&gt;管理的“缩略图”图像尺寸不同。媒体屏幕。
我们可以使用此过滤器更改post-thumbnail
尺寸(266 x 266像素)并将其修改为使用默认的thumbnail
尺寸(150 x 150像素)。
/**
* Change Display Size of Featured Image Thumbnail in WordPress Admin Dashboard
*/
add_filter( 'admin_post_thumbnail_size', function ( $size, $thumbnail_id, $post ) {
$sizes = get_intermediate_image_sizes();
$result = array_search( 'thumbnail', $sizes );
$size = is_numeric( $result ) ? $sizes[ $result ] : array( 100, 100 );
return $size;
}, 10, 3 );
如果intermediate thumbnail size不可用,也可以指定特定尺寸(例如,100 x 100像素)或设置为后备。
答案 3 :(得分:0)
函数_wp_post_thumbnail_html
返回如下代码:
<p class="hide-if-no-js">
<a title="Set featured image" href="http://example.com/wp-admin/media-upload.php?post_id=4573&type=image&TB_iframe=1" id="set-post-thumbnail" class="thickbox">
<img width="266" height="90" src="http://example.com/wp-content/uploads/thumb2-3-846x288.png" class="attachment-post-thumbnail" alt="thumb2-3" />
</a>
</p>
<p class="hide-if-no-js">
<a href="#" id="remove-post-thumbnail" onclick="WPRemoveThumbnail('dfd8f3353b');return false;">
Remove featured image
</a>
</p>
请注意,该图片为846x288
,但已在266x90
代码属性中将其调整为img
。
Analyzing the function,我们看到如果有一个名为post_thumbnail
的图像大小,它将获得该图像。否则,它会获得266x266
(带裁剪)的图像大小。您只需复制该功能并修改为所需的输出即可。
其他选项是使用过滤器admin_post_thumbnail_html
并移除img
宽度和高度属性:
add_filter( 'admin_post_thumbnail_html', 'filter_featured_img_so_17713997' );
function filter_featured_img_so_17713997( $html )
{
$doc = new DOMDocument();
$doc->loadHTML($html);
$tags = $doc->getElementsByTagName('img');
if(count($tags) > 0)
{
$tag = $tags->item(0);
$tag->removeAttribute('width');
$tag->removeAttribute('height');
return $doc->saveHTML($tag);
}
return $html;
}
但结果可能不是您所期望的。如果图像大于266
,则会从浏览器画布中渗出。
答案 4 :(得分:0)
这是另一种使用自定义尺寸缩略图或系统定义的完整版本的选项。大小的图像(您上传的图像的原始大小)作为管理面板中显示的特色图像:
/**
* step 1 - define custom image size
*
* - either plan to use 'full' (returns the size of the image you uploaded) OR define our custom image size
* - so we can call one of those instead of the system defined default 'post-thumbnail'
*
* - remainder of this example assumes using a custom image size, so it is defined
* - if using 'full', instead, then no need to define custom
* - so remove the following add_image_size line (and thereby skip step 1)
*/
add_image_size( 'admin-post-thumbnail', 846, 288, true );
/**
* step 2 - replace the meta box with ours for standard post type only, especially so we can set our own callback and
* - move it into the larger main column.
* - Note that in any event, the full size won't ever have greater width than the current column width
* - as CSS and modern admin panel make the image elements responsive to the column width.
*/
add_action('do_meta_boxes', 'so17713997_move_meta_box');
function so17713997_move_meta_box(){
remove_meta_box( 'postimagediv', 'post', 'side' );
add_meta_box('postimagediv', __('Featured Image'), 'so17713997_post_thumbnail_meta_box', 'post', 'normal', 'low');
}
// step 3 - custom callback to call our functional replacement for _wp_post_thumbnail_html for post type only
function so17713997_post_thumbnail_meta_box( $post ) {
$thumbnail_id = get_post_meta( $post->ID, '_thumbnail_id', true );
echo so17713997_wp_post_thumbnail_html( $thumbnail_id, $post->ID );
}
/**
* step 4 - replace _wp_post_thumbnail_html with our version that calls our thumbnail 'admin-post-thumbnail' instead of the default 'post-thumbnail'
*
* - we could do more here, like adjust the content width variable, but not entirely necessary. The custom image size we defined will
* - handle most of it, plus the admin section these days has responsive CSS, so the image doesn't blow-out column width in any event.
*/
function so17713997_wp_post_thumbnail_html( $thumbnail_id = null, $post = null ) {
global $content_width, $_wp_additional_image_sizes;
$post = get_post( $post );
$post_type_object = get_post_type_object( $post->post_type );
$set_thumbnail_link = '<p class="hide-if-no-js"><a title="%s" href="%s" id="set-post-thumbnail" class="thickbox">%s</a></p>';
$upload_iframe_src = get_upload_iframe_src( 'image', $post->ID );
$content = sprintf( $set_thumbnail_link,
esc_attr( $post_type_object->labels->set_featured_image ),
esc_url( $upload_iframe_src ),
esc_html( $post_type_object->labels->set_featured_image )
);
if ( $thumbnail_id && get_post( $thumbnail_id ) ) {
$old_content_width = $content_width;
$content_width = 266;
if ( !isset( $_wp_additional_image_sizes['admin-post-thumbnail'] ) ) // use our custom image size instead of 'post-thumbnail' OR use 'full' for system defined fullsize image
$thumbnail_html = wp_get_attachment_image( $thumbnail_id, array( $content_width, $content_width ) );
else
$thumbnail_html = wp_get_attachment_image( $thumbnail_id, 'admin-post-thumbnail' ); // use our custom image size instead of 'post-thumbnail' OR use 'full' for system defined fullsize image
if ( !empty( $thumbnail_html ) ) {
$ajax_nonce = wp_create_nonce( 'set_post_thumbnail-' . $post->ID );
$content = sprintf( $set_thumbnail_link,
esc_attr( $post_type_object->labels->set_featured_image ),
esc_url( $upload_iframe_src ),
$thumbnail_html
);
$content .= '<p class="hide-if-no-js"><a href="#" id="remove-post-thumbnail" onclick="WPRemoveThumbnail(\'' . $ajax_nonce . '\');return false;">' . esc_html( $post_type_object->labels->remove_featured_image ) . '</a></p>';
}
$content_width = $old_content_width;
}
/**
* Filter the admin post thumbnail HTML markup to return.
*
* @since 2.9.0
*
* @param string $content Admin post thumbnail HTML markup.
* @param int $post_id Post ID.
*/
return apply_filters( 'admin_post_thumbnail_html', $content, $post->ID );
}
首先请注意,所选的要素图像可能不会反映更新的尺寸,直到帖子已保存或更新为止。
此外,这个hack广泛使用了以下核心WordPress函数:
the_post_thumbnail(),
add_meta_box(),
post_thumbnail_meta_box()和
_wp_post_thumbnail_html
(我还没有足够的声誉发布超过两个链接,所以google他们。)
答案 5 :(得分:0)
您是否尝试过使用set_post_thumbnail_size()更改默认的特色图片尺寸?我遇到了同样的问题,这很有效。
答案 6 :(得分:0)
默认情况下,WordPress块编辑器使用方形缩略图显示“特色图片”。要更改此设置,我们需要应用JavaScript过滤器而不是PHP过滤器。显示未裁剪的精选图片的非常简单的过滤器如下所示:
wp.hooks.addFilter(
"editor.PostFeaturedImage.imageSize",
"uncroppedFeaturedImage",
() => "post-thumbnail"
);
从enqueue_block_editor_assets
挂钩加载该脚本。也可以使用其他注册的图像尺寸(medium
,large
等)。