Cài đặt thanh bên WordPress

Nhiều trang web, đặc biệt là blog, có thanh bên để hiển thị thông tin bổ sung, chẳng hạn như ảnh, văn bản Giới thiệu về tôi, liên kết đến các bài đăng khác, hồ sơ mạng xã hội, v.v.

Hướng dẫn này sẽ chỉ cho bạn cách thêm thanh bên bằng Trình chỉnh sửa trang. Để sử dụng phương pháp được mô tả trong hướng dẫn này, trang web của bạn phải sử dụng một chủ đề hỗ trợ Site Editor

Mục lục

Nói chung, có thể thêm phần tử thanh bên bằng cách sử dụng khối Cột có bố cục 70/30, trong đó cột nhỏ hơn sẽ là thanh bên

Tạo Thanh bên trên Mẫu trống

Chỉnh sửa Mẫu

Có các mẫu mà các loại trang khác nhau mặc định. Ví dụ: nếu bạn muốn tất cả các bài đăng của mình hiển thị thanh bên, bạn sẽ chỉnh sửa mẫu Bài đăng đơn của mình. Nếu bạn muốn thanh bên xuất hiện trên tất cả các trang của mình, bạn sẽ muốn chỉnh sửa mẫu Trang. Khi bạn chỉnh sửa mẫu, bố cục sẽ được áp dụng cho tất cả các trang và bài đăng đã sử dụng mẫu

Nếu bạn muốn tạo một mẫu cụ thể mà bạn chỉ có thể áp dụng cho các trang hoặc bài đăng mà bạn chọn, bạn có thể chỉnh sửa Mẫu trống. Mẫu Trống là mẫu chúng tôi sẽ sử dụng trong các bước bên dưới. Tuy nhiên, các bước này áp dụng cho bất kỳ mẫu nào bạn đang chỉnh sửa

💡

Bạn có thể tạo mẫu mới thông qua Trình chỉnh sửa Trang/Bài đăng trong Mẫu. phần của thanh bên Trang/Bài đăng. Mẫu mới sẽ có sẵn để chỉnh sửa trong Trình chỉnh sửa trang → Mẫu

  1. Chuyển đến Giao diện → Trình chỉnh sửa trang
  2. Nhấp vào biểu tượng trang web của bạn ở góc trên cùng bên trái và chọn Mẫu từ menu
  3. Chọn mẫu trống
  4. Nhấp vào nút + bộ chèn khối và chèn khối Cột
  5. Đặt bố cục hai cột và chọn 70/30

Thêm trình giữ chỗ nội dung
  1. Trong cột nhỏ hơn, hãy thêm bất kỳ khối nào vào thanh bên mà bạn muốn có
  2. Trong cột lớn hơn, hãy thêm. Điều này sẽ tự động hiển thị nội dung của trang [hoặc bài đăng] mà sau này bạn sẽ áp dụng mẫu trống cho
  3. Nhấp vào để lưu

Mẫu Trống [hoặc bất kỳ mẫu nào bạn chỉnh sửa] có thể đã có sẵn nội dung giữ chỗ theo mặc định. Do đó, khi bạn đã thêm các cột của mình, bạn sẽ muốn di chuyển nội dung giữ chỗ vào các cột

Áp dụng Mẫu
  1. Chuyển đến Trang hoặc Bài đăng, tùy thuộc vào loại nội dung bạn muốn chỉnh sửa
  2. Nhấp vào tiêu đề của Trang hoặc Bài đăng mà bạn muốn áp dụng mẫu thanh bên
  3. Trong cài đặt Trang/Bài đăng ở bên phải, hãy tìm cài đặt Mẫu . Chọn mẫu Trống tại đây.

Bây giờ, bất kỳ trang hoặc bài đăng nào sử dụng mẫu Trống sẽ hiển thị thanh bên của bạn bên cạnh nội dung của trang hoặc bài đăng đó

Các thay đổi được tự động áp dụng cho mọi trang/bài đăng hiện có bằng mẫu bạn đã chỉnh sửa

Thêm Thanh bên trên Chỉ mục hoặc Mẫu Lưu trữ

Mẫu Chỉ mục là thứ hiển thị danh sách các bài đăng của bạn. Mẫu Lưu trữ là thứ hiển thị các bài đăng có danh mục hoặc thẻ cụ thể. Bằng cách thêm thanh bên vào một trong các mẫu này, thanh bên sẽ xuất hiện trên các trang bài đăng cũng như các trang danh mục và thẻ của bạn

Chỉnh sửa Mẫu

  1. Chuyển đến Giao diện → Trình chỉnh sửa trang
  2. Nhấp vào biểu tượng trang web của bạn ở góc trên cùng bên trái và chọn Mẫu từ menu
  3. Chọn mẫu Chỉ mục hoặc Lưu trữ
  4. Chọn khối Vòng lặp Truy vấn từ Chế độ xem Danh sách và đưa nó vào khối Cột
  5. Đặt khối Cột thành hai cột trong
  6. Sử dụng Chế độ xem danh sách, chọn từng cột và đặt một cột thành 70% và cột kia thành 30%

Thêm trình giữ chỗ nội dung
  1. Trong cột nhỏ hơn, hãy nhấp vào biểu tượng + bộ chèn khối để thêm bất kỳ khối nào vào thanh bên mà bạn muốn có
  2. Nhấp vào để lưu
Xem video

Tương tự, bạn có thể làm theo quy trình này với các mẫu khác như Trang, Trang trước, Bài đăng đơn, 404 hoặc Tìm kiếm

Để tạo thành phần Thanh bên có thể tái sử dụng, chúng tôi khuyên bạn nên lưu nó dưới dạng khối Phần mẫu để sau này bạn có thể dễ dàng thêm thanh bên đã hoàn thành thay vì tạo thanh bên từ đầu cho từng mẫu

Thanh bên là khu vực sẵn sàng cho tiện ích trong chủ đề WordPress của bạn, nơi bạn có thể hiển thị thông tin không phải là một phần của nội dung trang chính. Tuy nhiên, thanh bên có thể gây mất tập trung và chiếm không gian quý giá

Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng loại bỏ thanh bên trong WordPress

Tại sao loại bỏ thanh bên trong WordPress?

Hầu hết các chủ đề WordPress miễn phí và trả phí đều có nhiều thanh bên hoặc khu vực sẵn sàng cho tiện ích

Bạn có thể sử dụng thanh bên để hiển thị danh sách các bài đăng gần đây, quảng cáo, biểu mẫu đăng ký danh sách email hoặc bất kỳ nội dung nào khác không phải là một phần của trang hoặc bài đăng chính

Tại WPBeginner, chúng tôi sử dụng thanh bên để quảng bá các trang truyền thông xã hội của mình và hiển thị các bài đăng phổ biến nhất của chúng tôi

Bạn có thể dễ dàng thêm các mục vào thanh bên của chủ đề bằng các tiện ích WordPress

Trong hầu hết các chủ đề WordPress, thanh bên trông khác nhau tùy thuộc vào việc khách truy cập đang xem trang web của bạn trên máy tính để bàn hay thiết bị di động. Vì điện thoại thông minh và máy tính bảng có màn hình nhỏ hơn nên WordPress thường di chuyển các thanh bên xuống cuối màn hình

Tùy thuộc vào cách trang web của bạn được thiết lập, điều này có thể trông lạ. Khách truy cập cũng sẽ cần cuộn xuống cuối màn hình để xem nội dung thanh bên, điều này có thể ảnh hưởng đến trải nghiệm người dùng và tỷ lệ chuyển đổi của bạn

Để biết thêm thông tin, vui lòng xem hướng dẫn của chúng tôi về cách xem phiên bản di động của các trang web WordPress từ máy tính để bàn

Ngay cả trên máy tính để bàn, vẫn có khả năng thanh bên có thể xung đột với thiết kế của bạn hoặc làm sao lãng nội dung quan trọng nhất, chẳng hạn như lời kêu gọi hành động của trang

Như đã nói, hãy xem cách bạn có thể xóa thanh bên trong WordPress. Chúng tôi sẽ chỉ cho bạn cách xóa thanh bên khỏi toàn bộ trang web của bạn và cách ẩn thanh bên trên một trang cụ thể hoặc chỉ đăng bài

Video hướng dẫn

Đăng ký WPBeginner

Nếu bạn không thích video hoặc cần thêm hướng dẫn, hãy tiếp tục đọc. Nếu bạn muốn chuyển thẳng đến một phương pháp cụ thể, thì bạn có thể sử dụng các liên kết bên dưới

Phương pháp 1. Xóa thanh bên bằng cài đặt chủ đề WordPress của bạn

Nhiều chủ đề WordPress tốt nhất đi kèm với cài đặt tích hợp để xóa thanh bên. Tùy thuộc vào chủ đề của bạn, bạn có thể xóa chúng trên toàn bộ trang web hoặc chỉ cần xóa chúng khỏi các bài đăng hoặc trang riêng lẻ

Cách dễ nhất để kiểm tra xem chủ đề của bạn có các cài đặt này hay không là khởi chạy tùy biến chủ đề. Trong bảng điều khiển WordPress của bạn, đi đến Giao diện »Tùy chỉnh

Trong menu bên trái, hãy tìm 'Thanh bên' hoặc cài đặt tương tự

Trong hình ảnh sau đây, bạn có thể thấy các tùy chọn cho chủ đề Astra WordPress phổ biến

Nếu bạn thấy tùy chọn 'Thanh bên', hãy nhấp vào tùy chọn đó rồi tìm bất kỳ cài đặt nào sẽ xóa thanh bên

Đây có thể là menu thả xuống, hình thu nhỏ hiển thị các bố cục thanh bên khác nhau hoặc một số cài đặt khác

Nếu chủ đề của bạn không có tùy chọn 'Thanh bên' thì bạn có thể xóa thanh bên bằng cách chọn 'Trang' hoặc phần tương tự

Như bạn có thể thấy trong hình ảnh sau, Astra cũng có cài đặt 'Trang'

Bên trong cài đặt này, bạn sẽ thấy các bố cục khác nhau, bao gồm một số bố cục loại bỏ thanh bên, chẳng hạn như 'Không có thanh bên' và 'Chiều rộng đầy đủ / Kéo dài. ’

Chỉ cần nhấp vào các hình thu nhỏ khác nhau để áp dụng các bố cục này cho trang web của bạn

Cho dù bạn xóa thanh bên như thế nào, đừng quên nhấp vào 'Xuất bản'. ’

Một số chủ đề WordPress cũng có cài đặt cho phép bạn xóa thanh bên khỏi các bài đăng và trang riêng lẻ. Điều này có thể hữu ích khi thiết kế các trang tùy chỉnh, chẳng hạn như trang đích

Để xem chủ đề của bạn có đi kèm với các cài đặt này hay không, chỉ cần chỉnh sửa bất kỳ trang hoặc bài đăng nào mà bạn muốn ẩn thanh bên. Trong menu bên phải, chọn 'Đăng' hoặc 'Trang', sau đó tìm tùy chọn 'Cài đặt bài đăng' hoặc 'Cài đặt trang'

Nếu theme của bạn có phần này thì click to expand. Giờ đây, bạn có thể tìm bất kỳ cài đặt nào cho phép bạn xóa thanh bên

Trong hình ảnh sau đây, bạn có thể thấy cài đặt bài đăng cho chủ đề ThemeIsle Hestia phổ biến

Hãy nhớ rằng một số chủ đề WordPress có thể không cho phép bạn dễ dàng xóa thanh bên bằng tùy biến hoặc trình chỉnh sửa trang. Nếu đúng như vậy, hãy tiếp tục đọc và chúng tôi sẽ chỉ cho bạn các cách khác để xóa thanh bên trong WordPress

Phương pháp 2. Xóa Thanh bên bằng Trình chỉnh sửa toàn trang

Nếu bạn đang sử dụng chủ đề khối, thì bạn có thể xóa thanh bên bằng Chỉnh sửa toàn trang [FSE] và trình chỉnh sửa khối

Phương pháp này là một cách nhanh chóng và dễ dàng để xóa thanh bên trên toàn bộ trang web của bạn, mặc dù nó không hoạt động với tất cả các chủ đề

Để khởi chạy trình chỉnh sửa, hãy vào Giao diện » Trình chỉnh sửa

Bây giờ bạn có thể nhấp để chọn thanh bên

Trong thanh công cụ nhỏ xuất hiện, nhấp vào biểu tượng dấu chấm

Bây giờ bạn có thể xóa thanh bên bằng cách nhấp vào 'Xóa cột' hoặc cài đặt tương tự

Khi bạn đã hoàn thành việc đó, bạn có thể tiếp tục và nhấp vào nút 'Lưu'

Bây giờ, nếu bạn truy cập vào giao diện người dùng của trang web WordPress của mình, bạn sẽ thấy rằng thanh công cụ đã biến mất

Phương pháp 3. Xóa thanh bên WordPress bằng mã

Phương pháp này cho phép bạn chỉ cần xóa thanh bên khỏi mọi trang và đăng trên trang web WordPress của mình

Bạn sẽ cần chỉnh sửa các tệp chủ đề của mình, vì vậy đây không phải là tùy chọn thân thiện với người mới bắt đầu nhất. Tuy nhiên, phương pháp này sẽ hoạt động với hầu hết các chủ đề WordPress, bao gồm cả các chủ đề không có cách tích hợp để ẩn thanh bên

Hãy nhớ rằng nếu bạn chỉnh sửa trực tiếp các tệp chủ đề WordPress của mình thì những thay đổi đó sẽ biến mất khi bạn cập nhật chủ đề

Như đã nói, chúng tôi khuyên bạn nên tạo một chủ đề con vì điều này cho phép bạn cập nhật chủ đề WordPress của mình mà không làm mất khả năng tùy chỉnh

Trước tiên, bạn cần kết nối với trang web WordPress của mình bằng ứng dụng khách FTP chẳng hạn như FileZilla hoặc bạn có thể sử dụng trình quản lý tệp của cPanel lưu trữ WordPress. Hoặc nếu bạn là người dùng SiteGround, bảng điều khiển Công cụ Trang web của bạn

Nếu đây là lần đầu tiên bạn sử dụng FTP thì bạn có thể xem hướng dẫn đầy đủ của chúng tôi về cách kết nối với trang web của bạn bằng FTP.  

Khi bạn đã kết nối, hãy truy cập /wp-content/themes/ và mở thư mục cho chủ đề WordPress hiện tại của bạn

Các chủ đề WordPress được tạo thành từ các mẫu khác nhau, vì vậy bạn sẽ cần chỉnh sửa tất cả các mẫu bao gồm thanh bên. Để tìm ra những tệp bạn cần chỉnh sửa, hãy xem hướng dẫn của chúng tôi về phân cấp mẫu WordPress

Ví dụ: bạn có thể cần chỉnh sửa chỉ mục. php, trang. php, đơn. php, lưu trữ. php, nhà. php, v.v.

Để chỉnh sửa tệp, hãy mở tệp đó trong trình soạn thảo văn bản, chẳng hạn như Notepad. Sau đó, tìm dòng giống như thế này


Nếu chủ đề của bạn có nhiều thanh bên, mã sẽ trông hơi khác và có thể có nhiều đoạn mã thanh bên. Thông thường đoạn code này sẽ có tên sidebar bên trong hàm chẳng hạn


Bạn có thể chỉ cần xóa dòng cho thanh bên mà bạn muốn xóa

Bây giờ, lưu và tải tệp trở lại tài khoản lưu trữ WordPress của bạn. Chỉ cần lặp lại quy trình được mô tả ở trên cho tất cả các tệp mẫu bao gồm thanh bên

Khi bạn hoàn tất, bạn có thể truy cập blog WordPress của mình để xem sự thay đổi trong hành động

Bạn có thể nhận thấy rằng mặc dù các thanh bên đã biến mất nhưng khu vực nội dung của bạn vẫn có cùng chiều rộng, khiến khu vực thanh bên trống

Điều này xảy ra khi chủ đề có chiều rộng xác định cho khu vực nội dung. Sau khi loại bỏ thanh bên, bạn cần điều chỉnh độ rộng của khu vực nội dung bằng cách thêm CSS tùy chỉnh vào chủ đề WordPress của mình

Để thực hiện việc này, hãy vào Chủ đề » Tùy chỉnh. Trong menu bên trái, nhấp vào CSS bổ sung

Bây giờ bạn có thể tiếp tục và dán đoạn mã sau vào trình chỉnh sửa mã nhỏ

.content-area {
    width: 100%;
    margin: 0px;
    border: 0px;
    padding: 0px;
}

.content-area .site {
margin:0px;
}

Đừng quên nhấp vào nút 'Xuất bản'. Bây giờ, nếu bạn truy cập trang web của mình, bạn sẽ thấy rằng khu vực nội dung hiện chiếm 100% dung lượng có sẵn

Phương pháp 4. Xóa thanh bên khỏi các trang riêng lẻ trong WordPress

Bạn có thể chỉ muốn xóa thanh bên trên một số trang nhất định trong khi hiển thị thanh bên trên các khu vực khác trên trang web của mình. Ví dụ: nhiều trang web không hiển thị thanh bên trên các trang bán hàng của họ vì điều này có thể làm sao nhãng lời kêu gọi hành động của trang

Nếu bạn chỉ muốn xóa thanh bên khỏi một trang cụ thể, thì chúng tôi khuyên bạn nên sử dụng plugin trình tạo trang như SeedProd

SeedProd cho phép bạn thiết kế bất kỳ loại trang nào bằng trình chỉnh sửa kéo và thả đơn giản. Điều này giúp dễ dàng thêm và xóa thanh bên khỏi bất kỳ trang nào

Trong trình chỉnh sửa SeedProd, chỉ cần nhấp để chọn thanh bên bạn muốn xóa. Sau đó, hãy tiếp tục và nhấp vào biểu tượng thùng rác

Nếu bạn muốn xóa thanh bên khỏi toàn bộ trang web của mình, thì bạn cũng có thể sử dụng SeedProd để dễ dàng tạo một chủ đề tùy chỉnh không có bất kỳ thanh bên nào

Phương pháp 5. Xóa thanh bên khỏi trang tĩnh trong WordPress

Một số chủ đề WordPress đi kèm với nhiều mẫu, bao gồm các mẫu trang có chiều rộng đầy đủ không hiển thị thanh bên ở hai bên nội dung. Bạn có thể sử dụng các mẫu này để xóa thanh bên khỏi bất kỳ trang nào

Để xem liệu chủ đề của bạn có mẫu có chiều rộng đầy đủ hay không, chỉ cần mở bất kỳ trang nào. Trong menu bên phải, chọn tab 'Trang' và tìm phần 'Mẫu'

Nếu bạn tìm thấy phần này, hãy nhấp vào nó để xem tất cả các tùy chọn có sẵn

Giờ đây, bạn có thể mở trình đơn thả xuống và tìm mẫu có chiều rộng đầy đủ

Nếu chủ đề của bạn không có mẫu có chiều rộng đầy đủ thì bạn có thể tạo mẫu theo cách thủ công

Mở trình soạn thảo văn bản đơn giản như Notepad và dán đoạn mã sau vào tệp trống


Bây giờ bạn có thể lưu tệp này với tên full-width. php

Sau đó, kết nối với trang web của bạn bằng ứng dụng khách FTP hoặc trình quản lý tệp do nhà cung cấp dịch vụ lưu trữ WordPress của bạn cung cấp

Sau đó, truy cập /wp-content/themes/ và mở thư mục cho chủ đề hiện tại của bạn. Trong thư mục này, tìm trang. php và mở nó trong bất kỳ trình soạn thảo văn bản nào

Bây giờ, sao chép mọi thứ xuất hiện sau dòng và dán vào toàn bộ chiều rộng của bạn. tập tin php

Khi bạn đã hoàn thành việc đó, hãy tìm và xóa dòng giống như thế này


Giờ đây, bạn có thể lưu các thay đổi của mình và tải lên toàn bộ chiều rộng. php vào thư mục chủ đề của bạn

Bây giờ bạn có thể sử dụng mẫu này với bất kỳ trang nào. Chỉ cần mở menu thả xuống 'Mẫu' trong menu bên phải và chọn mẫu có chiều rộng đầy đủ của bạn

Ghi chú. Nếu bạn có một trang đang mở trong trình chỉnh sửa nội dung trong khi tạo toàn bộ chiều rộng. php, bạn sẽ phải làm mới trình chỉnh sửa để mẫu mới xuất hiện trong menu thả xuống

Để biết thêm chi tiết, hãy xem hướng dẫn của chúng tôi về cách tạo mẫu trang có chiều rộng đầy đủ trong WordPress

Phương pháp 6. Xóa thanh bên khỏi một bài đăng trong WordPress

Cũng giống như các trang, WordPress cũng có hỗ trợ tích hợp cho các mẫu bài đăng

Nếu bạn muốn xóa thanh bên khỏi một số bài đăng nhất định, thì bạn có thể tạo một mẫu bài đăng đơn tùy chỉnh. Nó tương tự như việc tạo một mẫu trang có chiều rộng đầy đủ

Trước tiên, bạn sẽ cần tạo một tệp mẫu mới bằng trình soạn thảo văn bản như Notepad. Khi bạn đã hoàn thành việc đó, bạn có thể sao chép và dán đoạn mã sau vào tệp đó


Mã này tạo một mẫu mới gọi là 'Bài viết nổi bật' và cung cấp mẫu này cho mọi trang hoặc bài đăng, cùng với mọi loại bài đăng sản phẩm trong cửa hàng trực tuyến của bạn

Trong mẫu bài đăng đơn tùy chỉnh của bạn, bạn chỉ cần xóa phần thanh bên của mã. Để biết thêm thông tin, bạn có thể làm theo các bước được nêu trong hướng dẫn của chúng tôi về cách tạo mẫu bài đăng đơn tùy chỉnh trong WordPress

Khi bạn hoàn tất, hãy lưu tệp này dưới dạng toàn chiều rộng. php

Tiếp theo, bạn cần tải tệp lên thư mục chủ đề WordPress hiện tại của mình bằng ứng dụng khách FTP hoặc trình quản lý tệp

Khi bạn đã hoàn thành việc đó, bạn có thể áp dụng mẫu này cho bất kỳ bài đăng nào. Trong menu bên phải, chỉ cần nhấp để mở rộng phần 'Mẫu', sau đó chọn mẫu có chiều rộng đầy đủ

Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách dễ dàng xóa thanh bên trong chủ đề WordPress của mình. Bạn cũng có thể muốn xem hướng dẫn từng bước của chúng tôi về cách tăng tốc độ và hiệu suất của WordPress cũng như so sánh của chúng tôi về các dịch vụ tiếp thị qua email tốt nhất để tăng lưu lượng truy cập và doanh số bán hàng của bạn

Nếu bạn thích bài viết này, vui lòng đăng ký Kênh YouTube của chúng tôi để xem các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy chúng tôi trên Twitter và Facebook

Chủ Đề