Một trong những khách hàng sử dụng plugin GFPC của tôi đang muốn thiết kế ở trên tại khu vực widget Home Middle trên chủ đề Flex Pro.
Đầu tiên, tôi gán thẻ “tin tức nổi bật” trong 7 bài đăng. Sau đó, tôi đặt widget Combo tại khu vực widget Home Middle và thiết lập widget theo cách này.
Để có giao diện chuyên nghiệp, tôi đã thêm CSS sau vào tệp style.css.
/* # GFPC Widget
---------------------------------------------------------------------------------------------------- */
.home-middle .gfpc-widget .entry-title {
font-size: 16px;
font-weight: bold;
margin-bottom: 5px;
}
.home-middle .layout-one .one-half.left-part {
width: 31.623931623931625%;
}
.home-middle .layout-one .one-half.right-part {
width: 65.81196581196582%;
}
.home-middle .layout-one .entry,
.home-middle .layout-one .right-part .entry {
border-bottom: none;
padding: 0;
}
.home-middle .layout-one .right-part article:nth-child(2n+1) {
clear: left;
margin-right: 2.5641%;
}
.home-middle .layout-one .right-part article {
float: left;
width: 48.717948717948715%;
}
.home-middle .layout-one .entry-content p {
display: inline;
font-size: 15px;
margin: 0;
padding: 0;
}
.home-middle .layout-one a.alignleft,
.home-middle .layout-one img.alignleft,
.home-middle .layout-one .wp-caption.alignleft {
margin: 0 14px 14px 0;
}
.home-middle .entry-comments-link::before {
display: none;
}
.home-middle .entry-comments-link {
display: inline-block;
font-size: 14px;
}
@media only screen and (max-width: 800px) {
.home-middle .layout-one .one-half.left-part,
.home-middle .layout-one .one-half.right-part {
margin: 0;
width: 100%;
}
}
Nếu bạn nhìn vào thiết kế, bạn sẽ thấy rằng số nhận xét nằm ở phía bên phải của nội dung mục nhập. Theo mặc định, bạn không thể thực hiện việc này từ phần Widget. Bạn cần một số mã PHP tùy chỉnh cho nó. Plugin GFPC được xây dựng dựa trên các hook và bộ lọc. Trong trường hợp này, tôi đã sử dụng hook gfpc_entry_content .
remove_action( 'gfpc_entry_content', 'gfpc_do_post_content', 10, 2 );
add_action( 'gfpc_entry_content', 'gd_post_content', 10, 2 );
function gd_post_content( $instance, $widget_id ) {
if ( empty( $instance['content_limit'] ) )
return;
printf( '<div %s>', genesis_attr( 'entry-content' ) );
if ( $instance['content_limit'] == 'full' )
the_content( esc_html( $instance['more_text'] ) );
elseif ( ( int ) $instance['content_limit'] > 0 )
the_content_limit( ( int ) $instance['content_limit'], esc_html( $instance['more_text'] ) );
elseif( $instance['content_limit'] == 'excerpt' )
the_excerpt();
else
return;
if( $widget_id == "gfpc-widget-6" )
echo do_shortcode( '[[post_comments zero="0 Comment"]]' );
echo '</div>'. "\n";
}
Nếu bạn đang sử dụng nhiều tiện ích Kết hợp trên cùng một trang hoặc các trang khác thì mã trên sẽ thực thi cho tất cả tiện ích Kết hợp. Vì lý do này, tôi đã sử dụng câu lệnh “if” và hiển thị số nhận xét ở phía bên phải của nội dung mục nhập cho một widget Combo cụ thể. Trong ví dụ này, ID widget của tôi là “gfpc-widget-6” . Dễ dàng bạn sẽ nhận được ID widget này từ phần Combo Widget.