通过短代码和特殊帖子ID将缩略图作为div背景发布

时间:2016-03-23 11:00:32

标签: php wordpress

以下代码效果很好,如果它集成在循环中并且如果你需要一个" img"结果。

 @Override
public void onMapReady(GoogleMap googleMap) {
    mMap = googleMap;

    //call your api. get son data
    //{"Users":[{"name":"Diaz","lon":"51.1251635","lat":"51.296910"},{"name":"Chris","lon":"51.139409","lat":"51.295825"}}

    // Add a marker from JSON data, and move the camera.
    LatLng diaz = new LatLng(51.296910,51.1251635);
    mMap.addMarker(new MarkerOptions().position(diaz).title("Diaz"));
    mMap.moveCamera(CameraUpdateFactory.newLatLng(diaz));
    mMap.getMaxZoomLevel();
}

但是我想创建一个短代码,它会向我显示帖子缩略图作为div背景(在循环之外),我需要一个选项添加ID (用于帖子ID)。这可能吗?

好的会是这样的:

/* shortcode for post-thumbnail*/
function post_thumbnail( $atts, $content = null ) {
return '<div id="post_thumbnail">' . get_the_post_thumbnail($post_id, 'thumbnail') . '</div>';
}

add_shortcode("post_thumbnail", "post_thumbnail");

/* Shortcode*/
[post_thumbnail]

1 个答案:

答案 0 :(得分:2)

试试这个。

// [post_thumbnail post_id=""]
function post_thumbnail( $atts ) {
    extract(shortcode_atts( array(
        'post_id' => '',
    ), $atts ));

    $post_id = isset( $atts['post_id'] ) ? $atts['post_id'] : '';

    return '<div id="post_thumbnail">' . get_the_post_thumbnail($post_id, 'thumbnail') . '</div>';
}
add_shortcode( 'post_thumbnail', 'post_thumbnail' );

参考读物:Shortcode API

虽然,我会使用has_post_thumbnail()检查缩略图是否存在,如果有,请输出短代码。

修改

作为您需要的图片背景:

// [post_thumbnail post_id=""]
function post_thumbnail( $atts ) {
    extract(shortcode_atts( array(
        'post_id' => '',
    ), $atts ));

    $post_id = isset( $atts['post_id'] ) ? $atts['post_id'] : '';

    if (has_post_thumbnail($post_id)) {

        $image_post_out = wp_get_attachment_url( get_post_thumbnail_id($post_id) );

        return '<div id="post_thumbnail" style="background:url('. esc_url($image_post_out) .'); background-size:cover; min-height:200px;"></div>';
    }
}
add_shortcode( 'post_thumbnail', 'post_thumbnail' );

请注意,您需要将元素的高度设置为具有容器宽度。

您可以使用wp_get_attachment_image_src()来获取图像的高度和宽度,然后将其设置为样式中的容器宽度和高度,如下所示:

// [post_thumbnail post_id=""]
function post_thumbnail( $atts ) {
    extract(shortcode_atts( array(
        'post_id' => '',
    ), $atts ));

    $post_id = isset( $atts['post_id'] ) ? $atts['post_id'] : '';

    if (has_post_thumbnail($post_id)) {

        $image_atts = wp_get_attachment_image_src( get_post_thumbnail_id($post_id), 'thumbnail' );

        return '<div id="post_thumbnail" style="background:url('. esc_url($image_atts[0]) .'); width:'.$image_atts[1].'px; height:'.$image_atts[2].'px;"></div>';
    }
}
add_shortcode( 'post_thumbnail', 'post_thumbnail' );