如何输出WP_Customize_Cropping_Image_Control设置?

时间:2016-12-12 作者:Troy Templeman

我正在使用WP_Customize_Cropped_Image_Control 供用户在自定义程序中上载和裁剪图像。然而,get-theme-mod函数似乎并不像我通常做的那样用于输出它。

这是我在我的定制器。php文件:

$wp_customize->add_setting( \'bio_image\', array(
    \'default\'           => get_template_directory_uri() . \'/images/default.jpg\',
    \'transport\'         => \'postMessage\'
) );
$wp_customize->add_control( new WP_Customize_Cropped_Image_Control( $wp_customize, \'bio_image\', array(
    \'label\'             => __( \'bio_image\', \'myTheme\' ),
    \'flex_width\'        => false, 
    \'flex_height\'       => false,
    \'width\'             => 200,
    \'height\'            => 200,
    \'settings\'          => \'bio_image\',
) ) );
这是我的模板文件中的内容:

<img src="<?php echo get_theme_mod( \'bio_image\' , get_template_directory_uri().\'/images/default.jpg\' ); ?>">
这仅显示default.jpg 图像,并且尺寸错误。

是否有其他输出裁剪图像的方法?

2 个回复
SO网友:Weston Ruter

此处的主题模块存储附件帖子ID,而您的默认值是URL。所以你需要做的是:

<?php
function get_bio_image_url() {
    if ( get_theme_mod( \'bio_image\' ) > 0 ) {
        return wp_get_attachment_url( get_theme_mod( \'bio_image\' ) );
    } else {
        return get_template_directory_uri() . \'/images/default.jpg\';
    }
}
?>
<img src="<?php echo esc_url( get_bio_image_url() ); ?>">

SO网友:Troy Templeman

这为我做到了,简化了Weston\'s 以上答案。

<img id="bio-image" src="<?php 
    if ( get_theme_mod( \'bio_image\' ) > 0 ) { 
        echo wp_get_attachment_url( get_theme_mod( \'bio_image\' ) ); 
    } else { 
        echo esc_url(get_template_directory_uri() . \'/images/default.jpg\'); 
    } 
?>">
然而,现在的问题在于定制器。我在其中设置的默认图像WP_Customize_Cropped_Image_Control 不会显示,也不会显示新上载的图像,因为它输出的是图像ID而不是URL。下面我的自定义程序中的代码。js正在查找URL:

wp.customize( \'bio_image\', function( value ) {
    value.bind( function( newval ) {
        $(\'#bio-image\').attr( \'src\', newval );
    } );
} );
有人知道如何从jquery中的ID获取URL吗?

相关推荐