Theo dõi Yestech trên
Kiến thức lập trình
Hướng dẫn phân trang cho portfolio flatsome theme
Sau đây là cách phân trang cho portfolio flatsome theme. Trước tiên bạn cần biết phân trang là gì?
Tầm quan trọng của phân trang trong website như thế nào?
Phân trang trong website wordpress đóng vai trò quan trọng trong việc hiển thị và quản lý nội dung, đồng thời cải thiện trải nghiệm người dùng. Dưới đây là một số tầm quan trọng của phân trang trong website:
- Cải thiện tốc độ tải trang: Khi một trang web chứa nhiều nội dung, phân trang cho phép phân chia nội dung thành các trang con nhỏ hơn. Điều này giúp giảm thiểu tải trọng dữ liệu cần tải khi mở trang, giúp trang web tải nhanh hơn và giảm thời gian chờ đợi của người dùng.
- Tăng khả năng tìm kiếm: Phân trang giúp sắp xếp nội dung thành các trang riêng biệt và đánh số, giúp người dùng dễ dàng tìm kiếm và truy cập đến trang cụ thể. Điều này cung cấp khả năng tìm kiếm tốt hơn trong trang web và cải thiện trải nghiệm người dùng.
- Dễ dàng duyệt và xem nội dung: Phân trang giúp người dùng dễ dàng duyệt qua nội dung trong trang web. Họ có thể chuyển đến trang tiếp theo hoặc trang trước, hoặc chọn trực tiếp một trang cụ thể. Điều này giúp người dùng có khả năng kiểm soát và tiếp cận nội dung một cách linh hoạt hơn.
- Quản lý nội dung: Phân trang là một cách hiệu quả để quản lý nội dung trong trang web, đặc biệt là khi có một lượng lớn dữ liệu. Bằng cách chia nội dung thành các trang con, việc quản lý, sắp xếp và cập nhật trang web trở nên thuận tiện hơn.
- Tối ưu hóa SEO: Sử dụng phân trang cung cấp cho các công cụ tìm kiếm thông tin về cấu trúc và sắp xếp nội dung trong trang web. Điều này có thể cải thiện khả năng tìm thấy và xếp hạng trang web trong kết quả tìm kiếm, giúp tăng lượng truy cập và tương tác từ người dùng.
Xem thêm định nghĩa phân trang trên wiki
Cách phân trang cho portfolio flatsome theme
flatsome/inc/post-types/post-type-ux-portfolio.php
Và thêm bên dưới 2 dòng code
add_permastruct( 'featured_item_category', $items_link . '/%featured_item_category%' , false);
// Thêm vào 2 dòng code sau
$query = 'index.php?featured_item_category=$matches[1]&paged=$matches[2]';
add_rewrite_rule('^'.$items_link.'/([^/]+)/page/?([0-9]{1,})/?$', $query, 'top');
add_permastruct( 'featured_item', $items_link . '/%featured_item_category%/%featured_item%', false);
Chỉnh sửa template Archive portfolio flatsome để có phân trang
Tại thư mục theme tạo file có tên: taxonomy-featured_item_category.php
Với code như sau:
<?php
/**
* Featured Item category template.
*
* @package Flatsome\Templates
* @flatsome-version 3.16.0
*/
get_header();
$queried_object = get_queried_object();
$sub_terms = null;
if( $queried_object->parent == 0 ){
$sub_terms = get_terms( array(
'taxonomy' => 'featured_item_category',
'hide_empty' => false,
'parent' => $queried_object->term_id
));
}else{
$sub_terms = get_terms( array(
'taxonomy' => 'featured_item_category',
'hide_empty' => false,
'parent' => $queried_object->parent
));
}
?>
<?php
do_action('page_breadcrumbs_balico');
?>
<div class="portfolio-page-wrapper portfolio-archive page-featured-item">
<?php if ( is_active_sidebar( 'sidebar-before-portfolio' ) ) { ?>
<?php dynamic_sidebar('sidebar-before-portfolio'); ?>
<?php } ?>
<?php
get_template_part( 'template-parts/portfolio/archive-portfolio-title', get_theme_mod( 'portfolio_archive_title', '' ) );
?>
<div id="content" role="main" class="page-wrapper">
<?php if($sub_terms) : ?>
<div class="container">
<div class="tabbed-content">
<ul class="nav-du-an" >
<?php foreach($sub_terms as $sub):
$active = $sub->term_id == $queried_object->term_id ? 'active' : '';
?>
<li class="<?php echo $active ?> has-icon">
<a title="<?php echo $sub->name ?>" href="<?php echo get_term_link($sub)?>"><?php echo $sub->name ?></a>
</li>
<?php endforeach ?>
</ul>
</div>
</div>
<?php endif ?>
<?php if ( have_posts() ) : ?>
<?php
// Create IDS
$ids = array();
while ( have_posts() ) : the_post();
array_push($ids, get_the_ID());
endwhile; // end of the loop.
$ids = implode(',', $ids);
?>
<?php
$cat = false;
$filter = get_theme_mod( 'portfolio_archive_filter', 'left' );
$filter_nav = get_theme_mod( 'portfolio_archive_filter_style', 'line-grow' );
if ( $filter == 'disabled' || is_tax() ) $filter = 'disabled';
// Check if category.
if ( is_tax() ) $cat = get_queried_object()->term_id;
// Height.
$height = get_theme_mod( 'portfolio_height', 0 ) ? get_theme_mod( 'portfolio_height', 0 ) : '';
echo flatsome_apply_shortcode( 'ux_portfolio', array(
'image_height' => $height,
'filter' => $filter,
'filter_nav' => $filter_nav,
'type' => 'row',
'ids' => $ids,
'cat' => $cat,
'orderby' => get_theme_mod( 'portfolio_archive_orderby', 'menu_order' ),
'order' => get_theme_mod( 'portfolio_archive_order', 'desc' ),
'col_spacing' => get_theme_mod( 'portfolio_archive_spacing', 'small' ),
'columns' => get_theme_mod( 'portfolio_archive_columns', 4 ),
'columns__md' => get_theme_mod( 'portfolio_archive_columns_tablet', 3 ),
'columns__sm' => get_theme_mod( 'portfolio_archive_columns_mobile', 2 ),
'depth' => get_theme_mod( 'portfolio_archive_depth', 0 ),
'depth_hover' => get_theme_mod( 'portfolio_archive_depth_hover', 0 ),
'image_radius' => get_theme_mod( 'portfolio_archive_image_radius', 0 ),
'image_size' => get_theme_mod( 'portfolio_archive_image_size', 'medium' ),
) );
?>
<?php flatsome_posts_pagination(); ?>
<?php else : ?>
<?php get_template_part( 'template-parts/posts/content','none'); ?>
<?php endif; ?>
</div>
<?php if ( is_active_sidebar( 'sidebar-after-portfolio' ) ) { ?>
<?php dynamic_sidebar('sidebar-after-portfolio'); ?>
<?php } ?>
</div>
<?php get_footer(); ?>
