Xóa css thanh bên

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 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

Làm cách nào để xóa thanh bên trong CSS?

Làm cách nào để thoát khỏi thanh bên?

Làm cách nào để ẩn thanh bên trong PHP?