当前位置:秋硕笔记 > 主机 > 正文

仿 WordPress 的 Post Embed 功能

仿 WordPress 的 Post Embed 功能
需要启用 WP-PostViews 插件,或者替换掉相关函数。
下面的代码加入到functions.php中

// WordPress 文章内链短代码 - https://fatesinger.com/76585
function xx_insert_posts( $atts, $content = null ){
extract( shortcode_atts( array('ids' => ''), $atts ) );
global $post;
$content = '';
$postids = explode(',', $ids);
$inset_posts = get_posts(array('post__in'=>$postids));
foreach ($inset_posts as $key => $post) {
setup_postdata( $post );
$content .= '

'. get_the_title() . '

'.wp_trim_words( get_the_content(), 100, '...' ).'

';
}
wp_reset_postdata();
return $content;
}
add_shortcode('xx_insert_post', 'xx_insert_posts');

CSS 参考

/** WordPress 文章内链短代码 New Embed**/
.wp-embed-post {
background: #fff;
border: 1px solid #e5e5e5;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
color: #82878c;
font-size: 14px;
overflow: auto;
padding: 16px;
margin-bottom: 16px;
}
.wp-embed-post a {
color: #666;
text-decoration: none;
}

.wp-embed-post-featured-image {
margin-bottom: 20px;
}
.wp-embed-post-featured-image img {
border: medium none;
height: auto;
width: 100%;
}
.wp-embed-post-featured-image.square {
float: left;
margin-right: 20px;
max-width: 160px;
}
.wp-embed-post p {
margin: 0;
}
p.wp-embed-post-heading {
font-size: 20px;
margin: 0 0 4px!important;
}
.wp-embed-post-heading a {
color: #32373c;
}
.wp-embed-post .wp-embed-post-more {
color: #b4b9be;
}
.wp-embed-post-footer {
display: table;
margin-top: 16px;
width: 100%;
}
.wp-embed-post-site-title .avatar {
border: 0 none;
height: 25px;
left: 0;
position: absolute;
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
width: 25px;
}
.wp-embed-post-site-title a {
display: inline-block;
padding-left: 32px;
position: relative;
}
.wp-embed-post-meta, .wp-embed-post-site-title {
display: table-cell;
}
.wp-embed-post-meta {
text-align: right;
vertical-align: middle;
white-space: nowrap;
}
.wp-embed-post-comments, .wp-embed-post-reads {
color: #666;
display: inline;
}
.wp-embed-post-comments a, .wp-embed-post-share-tab-button {
display: inline-block;
}
.wp-embed-post-comments + .wp-embed-post-share {
margin-left: 10px;
}
/** WordPress 文章内链短代码 New Embed - END **/

使用方法
直接在文章中(html 代码模式下)使用短代码 [xx_insert_post ids=111,222] 即可。

如果不是在文章内容中,而是在其他地方想调用,则可使用 do_shortcode('[xx_insert_post ids=111,222]') 来调用。
本文来自常阳时光:https://cyhour.com/435/

感觉很棒!可以赞赏支持我哟~

赞(0) 打赏

评论抢沙发