Hướng dẫn cách thêm Breadcrumbs RankMath vào theme Flatsome

Bài viết này thietkewebsitephuyen.com hướng dẫn cách thêm Breadcrumbs RankMath vào theme Flatsome. Anh em nào chưa biết thì có thể tham khảo và làm thử nhen. Cách này rất dễ, anh em không biết code cũng có thể làm được, thử xem ^^

Thêm Breadcrumbs RankMath vào theme Flatsome

Thêm Breadcrumbs RankMath vào theme Flatsome

Cách thêm Breadcrumbs RankMath vào theme Flatsome

Bước 1: Bật tính năng Breadcrumbs của Rank Math lên. Nó trong mục General Settings, bạn chọn và tick bật Enable breadcrumbs function như hình bên dưới. Bên dưới của nó cũng có một số mục tùy chọn, bạn tự tick vào để vọc từng mục nhé, ở đây mình không nói chi tiết về các tùy chỉnh đó ^^

bat tinh nang breadcrumbs cua rank math len

Bật tính năng breadcrumbs của Rank Math lên

Bước 2: Bạn chèn code này vào file single.php, đường dẫn của nó là: template-parts/posts/single.php

<!--- breadcrumbs Rankmath -->
<div class="large-12 col-breadcrumbs">
<?php if (function_exists('rank_math_the_breadcrumbs')) rank_math_the_breadcrumbs(); ?>
</div>

Bạn chèn đoạn code trên vào vị trí như hình bên dưới là được:

chen code hien thi breadcrumbs cua rank math vao theme flatsome

Chèn code hiển thị breadcrumbs của Rank Math vào theme Flatsome

Bước 3: Chèn đoạn CSS này vào phần CSS bổ sung và lưu lại nữa là oke luôn. Bạn nào dùng giao diện tiếng Anh thì nó nằm trong mục Additional CSS á ^^ | Cứ chèn nó lên đầu tiên của khung CSS bổ sung nếu dưới nó đã có chèn CSS rồi.

/* breadcrumbs Rankmath */
.large-12.col-breadcrumbs {
color: #0f3e66;
padding: 7px;
padding-left: 0px;
height: 40px;
border-bottom: 1px dashed #07070714;
margin-bottom: 10px;
}
nav.rank-math-breadcrumb {
display: flex;
}

LỜI KẾT

Như vậy là mình vừa mới chia sẻ xong cách thêm Breadcrumbs RankMath vào theme Flatsome, anh em nào chưa biết thì có thể tham khảo và làm thử nhen. Ngoài ra, anh em nào có cách chèn/ mẫu Breadcrumbs RankMath đẹp đẹp và đã chèn thành công thì có thể để lại bình luận bên dưới, cảm ơn anh em !

4.7/5 – (4 votes)