Hướng dẫn tùy chỉnh Breadcrumbs nâng cao trong genesis

Trong bài hướng dẫn thêm Breadcrumbs vào genesis tôi có hướng dẫn các bạn cách để sửa đổi các chữ mặc định cũng như kích hoạt nó bằng cách chèn code vào functions.php. Vậy để tủy chỉnh một số chức năng nâng cao bạn vẫn có thể thực hiện một cách dễ dàng khi xem xong bài viết này.

Hướng dẫn tùy chỉnh Breadcrumbs nâng cao trong genesis

Chúng ta sẽ thêm một số tính năng mà bạn có thể sửa tất cả text của Breadcrumbs trong category, tags, date, time, search… Và giới hạn số lượng từ hiển thị ra ngoài bài viết được cấu hình từ trước.

Bước 1: Kích hoạt Breadcrumbs

Truy cập Genesis > Theme Setting > Kích hoạt tính năng Breadcrumbs.

Bước 2: Tùy chỉnh Breadcrumbs

Thêm đoạn mã sau vào functions.php trong thư mục child theme của bạn.

//* Crunchify Tips: Reposition breadcrumbs from before .entry to inside .entry (above title) on single Posts and static Pages
add_action( 'genesis_before_content', 'crunchify_reposition_breadcrumbs' );
function crunchify_reposition_breadcrumbs() {
	if ( is_singular() ) {
		remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
		add_action( 'genesis_entry_header', 'genesis_do_breadcrumbs', 9 );
	}
}

Bước 3: Tùy chỉnh văn bản mặc định của genesis

//* Crunchify Tips: Modify breadcrumb arguments
add_filter( 'genesis_breadcrumb_args', 'crunchify_custom_breadcrumb_args' );
function crunchify_custom_breadcrumb_args( $args ) {
 $args['home'] = 'Crunchify'; // Home Page
 $args['sep'] = '  ➢  '; // My favorite arrow
 $args['list_sep'] = ', '; 
 $args['prefix'] = '<div class="breadcrumb">';
 $args['suffix'] = '</div>';
 $args['heirarchial_attachments'] = true; 
 $args['heirarchial_categories'] = true; 
 $args['display'] = true;
 $args['labels']['prefix'] = '';
 $args['labels']['author'] = 'Archives for ';
 $args['labels']['category'] = 'Archives for '; 
 $args['labels']['tag'] = 'Archives for ';
 $args['labels']['date'] = 'Archives for ';
 $args['labels']['search'] = 'Search for ';
 $args['labels']['tax'] = 'Archives for ';
 $args['labels']['post_type'] = 'Archives for ';
 $args['labels']['404'] = 'Not found: '; 
return $args;
}

Lưu ý: Bạn có thể chỉnh sửa các văn bản category, tags, date, time… theo nhu cầu của mình.

Bước 4: Giới hạn ký tự được hiển thị trong Breadcrumbs

Với tính năng này bạn có thể giới hạn số lượng từ được hiển thị trên một bài viết genesis, mặc định là 60 bạn có thể tùy biến genesis_single_crumb theo mục đích của mình.

//* Crunchify Tips: Modify genesis_single_crumb hook - Applies to only Genesis Framework Breadcrumbs
 
add_filter( 'genesis_single_crumb', 'crunchify_custom_genesis_single_crumb', 10, 2 );
function crunchify_custom_genesis_single_crumb( $crumb, $args ){
	global $post;
	// if not a single post page, return default crumb markup
	if( ! is_singular( 'post' ) )
		return $crumb;
	
        $crumb = str_replace( single_post_title( '', false ), '', $crumb );
 
	$thetitle = single_post_title( '', false );
	$getlength = strlen($thetitle);
	$thelength = 60;    // Truncate Title to only 60 characters
	$crumb .= substr($thetitle, 0, $thelength);
	if ($getlength > $thelength) {
		$crumb .= ' ...';
	}
 
	return $crumb;
}

Và đó là những gì bạn nên làm để có thể tùy biến Breadcrumbs một cách dễ dàng… Hãy lưu lại tất cả thay đổi và quay lại trang bài viết để xem kết quả của bạn nào.

Hãy cho tôi biết mọi thắc mắc của bạn ở khung comments bên dưới.

2 thoughts on “Hướng dẫn tùy chỉnh Breadcrumbs nâng cao trong genesis

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Đặt lịch hẹn Liên hệ Tải Credentials