Tạo bố cục dạng xem lưới 3 cột cho trang chủ trong Minimum PRO Theme

Nói chung, chế độ xem lưới 2 cột cho các bài đăng trên blog có sẵn trong Chủ đề Minimum PRO. Nhưng khách hàng của tôi đang yêu cầu vòng lặp lưới ba cột cho các bài đăng và danh mục đầu tư. Vì vậy, tôi đã sửa đổi thiết kế trang chủ một chút cho nó. Tôi đã hoàn thành việc này bằng các bước sau:

  1. Xóa mã Grip Loop khỏi tệp front-page.php

  2. Tạo vùng widget mới và thêm vùng này vào tệp mẫu Trang chủ

  3. Hiển thị danh mục đầu tư 3 cột & Bài viết mới nhất

  4. Tạo kiểu thiết kế

  5. Xóa mã Grip Loop khỏi tệp front-page.php

Đầu tiên, mở tệp “ front-page.php ” trên Notepad + hoặc Theme Editor (Bảng điều khiển-> Giao diện-> trình chỉnh sửa). Bình luận dòng sau

//* Add Genesis grid loop
//add_action( 'genesis_loop', 'minimum_grid_loop_helper' );

Ngoài ra, bạn có thể xóa loạt mã này khỏi tệp:

//* Genesis grid loop
function minimum_grid_loop_helper() {
	if ( function_exists( 'genesis_grid_loop' ) ) {
		genesis_grid_loop( array(
			'features'              => 0,
			'feature_image_size'    => 0,
			'feature_content_limit' => 0,
			'grid_image_size'       => 0,
			'grid_content_limit'    => 250,
			'more'                  => __( '[Read more]', 'minimum' ),
		) );
	} else {
		genesis_standard_loop();
	}
}
  1. Tạo vùng widget mới và thêm vùng này vào tệp mẫu Trang chủ

Thêm mã sau vào tệp functions.php và nó sẽ tạo khu vực tiện ích con “Trang chủ nổi bật 5” cho trang chủ

genesis_register_sidebar( array(
	'id'          => 'home-featured-5',
	'name'        => __( 'Home Featured 5', 'minimum' ),
	'description' => __( 'This is the home featured 5 section.', 'minimum' ),
) );

Bây giờ thêm tiện ích này trong Trang chủ. Thêm mã này vào tệp front-page.php :

add_action('genesis_loop', 'add_home_featwdgt_5')
function add_home_featwdgt_5() {
genesis_widget_area( 'home-featured-5', array(
'before' => '<div class="home-featured-5 grid-layout widget-area>',
'after' => '</div>',
) );
}

}
3. Hiển thị danh mục đầu tư & Bài viết mới nhất của tôi

Nói chung tiện ích Bài đăng nổi bật của Genesis không hỗ trợ tùy chọn loại bài đăng tùy chỉnh. Và “portfolio” là một loại bài đăng tùy chỉnh được tạo theo chủ đề Minimum PRO. Vì lý do này, tôi đã tạo một plugin PRO “Tiện ích nội dung nổi bật mở rộng” cho nội dung bài đăng, trang và loại bài đăng tùy chỉnh. Người dùng có thể sử dụng nó vào chủ đề Non-Genesis. Nó tương thích với bất kỳ Chủ đề WordPress nào. Nó có rất nhiều tính năng.

Vâng. Tôi kéo và thả “Widget Nổi bật Mở rộng” trong khu vực widget Trang chủ phần 5 và thiết lập nó cho nội dung Danh mục đầu tư của tôi. Xem hình ảnh bên dưới

Tương tự như cách tôi thiết lập tiện ích cho các Bài đăng trên Blog của mình.

  1. Tạo kiểu dáng cho thiết kế

Tôi đã thêm một vài css trong tệp style.css để có giao diện đẹp hơn. Bạn cũng có thể sử dụng CSS này

/*********** Home Featured Section 5 **********/
.home-featured-5 .widget{
  margin-bottom: 50px;
}
.home-featured-5 h4.widget-title{
  font-size: 34px;
  margin-bottom: 85px;
  position: relative;
  text-align: center;
}
.home-featured-5 h4.widget-title:after {
    border-top: 1px solid #e2e2e2;
    content: "";
    display: block;
    margin: 0 auto;
    position: relative;
    top: 22px;
    width: 10%;
}
.home-featured-5 h2.entry-title {
    font-size: 24px;
    line-height: 1;
}