Chỉnh độ rộng Sidebar trong Theme Flatsome 2021

flatsome
09/09/21
0

Sidebar trong WordPress là khu vực hiển thị một số chức năng như bài viết mới, nổi bật hoặc đặt banner. Tùy theo sở thích của từng người sẽ để sidebar hoặc xóa đi. Nếu bạn đang tìm hiểu về WordPress và muốn chỉnh sửa sidebar hay thêm vào theo ý muốn của mình hãy đọc bài viết dưới đây.

Chỉnh độ rộng Sidebar trong Theme Flatsome
Chỉnh độ rộng Sidebar trong Theme Flatsome

Chỉnh độ rộng Sidebar trong Theme Flatsome

trước khi chỉnh sửa độ rộng mọi người xem qua mặc định của Sidebar ) Flatsome

Chỉnh độ rộng Sidebar trong Theme Flatsome
Chỉnh độ rộng Sidebar trong Theme Flatsome

 

Trong Flatsome trang được chưa 12 phần  , phần main ( chính ) chia 9/12 và sidebar được chia 3/12

Có một số bạn không thích phần sidebar quá nhỏ ( Trong đó có mình 🙂 ) nên cần chia lại , trong bài này tớ hướng dẫn chia lại theo tỷ lệ 8  – 4 nhé

  • Note :  có 2 cách để chia lại (1) dùng CSS mình sẽ hướng dẫn sau , (2) Sửa code – Mình sẽ hướng dẫn bên dưới nhé

1 . Xác đinh theme bạn dùng và vị trí file cần code lại 

bạn vào theo đường dẫn như sau ( Theme child Flatsome )

Flatsome Child: layout-right-sidebar.php (template-parts/posts/layout-right-sidebar.php)

Tìm 2 dòng code sau

<div class=”large-9 col”>

<div class=”large-3 col”>

Như hình

Chỉnh độ rộng Sidebar trong Theme Flatsome
Chỉnh độ rộng Sidebar trong Theme Flatsome

 

ví dụ ở đây bạn muốn Sidebar lớn lên ( từ 3/12 => 4/12 nhé)

<div class=”large-9 col”> => sửa thành  <div class=”large-8 col”>

<div class=”large-3 col”>=> sửa thành  <div class=”large-4 col”>

Giải thích chỗ này tý nhé :

Chiều ngang của trang được chia 12 phần nên viêc bạn TĂNG SIDEBAR lên có nghĩa là bạn phải giảm MAIN xuống ( trong trường hợp bạn không giảm MAIN , cột sidebar nó sẽ rớt bên dưới nhé – Vì khối chưa nó nhỏ hơn bản thân nó )

ok sau khi thao tác xong bạn lưu lại và xem kêt quả nhé !

Chỉnh độ rộng Sidebar trong Theme Flatsome
Chỉnh độ rộng Sidebar trong Theme Flatsome

 

Do mình đang dùng Sider bar bên phải nên mở file layout-right-sidebar.php ,

nếu bạn dùng Sidebar bên trái có thể mở file layout-left-sidebar.php  nhé

Chúc các bạn thành công nhé !

 

Theo : downvn.net