1

一直在尝试一些自定义元框,但我读过或找不到的任何东西都无法帮助我实现我真正追求的目标。

我可以渲染一个新的元框,但我找不到在管理面板中实际更改帖子缩略图本身的输出的方法。

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 ); ? 因为这就是它要寻找的东西?

4

7 回答 7

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');
于 2016-07-27T05:16:35.907 回答
1

您应该替换_wp_post_thumbnail_htmlget_the_post_thumbnail

于 2013-07-18T03:34:52.510 回答
1

WordPress 4.4开始,引入了一个新的过滤器admin_post_thumbnail_size,它允许修改特色图像元框中帖子缩略图的显示大小。

当主题添加“缩略图后”支持时,会注册一个特殊的“缩略图后”图像尺寸,这与通过“设置”>“媒体”屏幕管理的“缩略图”图像尺寸不同。

我们可以使用此过滤器来更改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 );

如果中间缩略图大小不可用,也可以指定或设置特定大小(例如,100 x 100 像素)作为后备。

于 2017-01-03T21:08:12.723 回答
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&#038;type=image&#038;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被调整大小。266x90img

分析函数,我们看到如果有一个名为 的图像大小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,它会从浏览器画布中溢出。

于 2013-07-18T15:17:20.343 回答
0

默认情况下,WordPress 块编辑器使用方形缩略图显示特色图像。要改变这一点,我们需要应用 JavaScript 过滤器而不是 PHP 过滤器。一个非常简单的过滤器来显示未裁剪的特色图像,如下所示:

wp.hooks.addFilter(
  "editor.PostFeaturedImage.imageSize",
  "uncroppedFeaturedImage",
  () => "post-thumbnail"
);

enqueue_block_editor_assets钩子中加载该脚本。也可以使用其他注册的图像尺寸(medium、等)。large

于 2020-06-13T05:45:13.993 回答
0

您是否尝试过使用set_post_thumbnail_size()更改默认的特色图片大小?我遇到了同样的问题,而且效果很好。

于 2015-12-16T14:41:47.663 回答
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

(我还没有足够的声誉发布两个以上的链接,所以谷歌他们。)

于 2015-12-07T21:03:48.173 回答