Bạn có gặp vấn đề với việc trang web WordPress của mình hiển thị thanh bên bên dưới nội dung không?
Sự cố này xảy ra với các mẫu WordPress sử dụng bố cục hai cột cho nội dung và thanh bên. Do có một chút thay đổi về mã, thanh bên bắt đầu xuất hiện bên dưới nội dung thay vì bên cạnh nội dung đó.
Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách dễ dàng sửa lỗi nội dung bên dưới thanh bên trong WordPress.
Nguyên nhân phổ biến nhất khiến thanh bên xuất hiện bên dưới nội dung là lỗi HTML hoặc CSS làm hỏng bố cục.
Mỗi
Ngoài HTML, CSS cũng ảnh hưởng đến thiết kế tổng thể của mọi thành phần trên trang web WordPress của bạn. Nó được sử dụng để xác định chiều rộng, căn chỉnh và nổi của các phần tử trong bố cục của bạn.
Nói một cách đơn giản, nếu chiều rộng của vùng nội dung của bạn lớn hơn không gian có sẵn thì nó sẽ buộc thanh bên phải di chuyển xuống.
Trước tiên, bạn sẽ cần tìm hiểu mã cụ thể nào đang gây ra sự cố về nội dung cho thanh bên dưới trong WordPress.
Như đã nói, chúng ta hãy xem cách dễ dàng khắc phục sự cố và sửa lỗi thanh bên dưới nội dung trong WordPress.
Thông thường, sự cố xảy ra do những thay đổi trong tệp chủ đề WordPress của bạn.
Nếu gần đây bạn đã thực hiện bất kỳ thay đổi nào đối với chủ đề WordPress hoặc chủ đề con của mình thì việc kiểm tra những thay đổi đó sẽ là cách nhanh chóng để khắc phục lỗi này.
Nếu bạn không thể tìm ra những thay đổi nào bạn sẽ cần hoàn nguyên, hãy tiếp tục đọc và chúng tôi sẽ chỉ cho bạn các cách khác để khắc phục sự cố.
Giao diện và phong cách trang web WordPress của bạn được kiểm soát bởi chủ đề bạn đang sử dụng. Tuy nhiên, đôi khi các plugin WordPress cũng có thể thêm HTML và CSS của riêng chúng vào trang web của bạn.
Ví dụ: thêm biểu mẫu liên hệ trên một trang hoặc cửa sổ bật lên hộp đèn sẽ tải thêm CSS và HTML.
Để đảm bảo rằng sự cố không phải do plugin WordPress gây ra, bạn có thể tạm thời tắt tất cả các plugin WordPress trên trang web của mình.
Để thực hiện việc này, chỉ cần đi tới Plugins » Plugin đã cài đặt trong bảng điều khiển quản trị viên WordPress của bạn và chọn hộp bên cạnh ‘Plugin’ ở đầu danh sách. Sau đó, mở menu thả xuống, chọn ‘Hủy kích hoạt’ và nhấp vào ‘Áp dụng’.
Nếu sự cố biến mất thì điều này có nghĩa là plugin đã gây ra sự cố. Chỉ cần kích hoạt từng plugin WordPress của bạn, kiểm tra trang web của bạn sau mỗi plugin để tìm ra plugin nào gây ra sự cố.
Sau đó, bạn có thể liên hệ với bộ phận hỗ trợ của plugin để tìm giải pháp và báo cáo sự cố.
Như chúng tôi đã đề cập trước đó, thẻ
Nếu sự cố xảy ra ở một khu vực cụ thể trên trang web của bạn thì bạn có thể kiểm tra mẫu chịu trách nhiệm hiển thị mã đó.
Ví dụ: nếu sự cố này chỉ xảy ra trên một bài đăng thì bạn có thể muốn kiểm tra mẫu single.php. Để biết nên xem mẫu nào, hãy xem bảng tóm tắt hệ thống phân cấp mẫu WordPress hoàn chỉnh của chúng tôi.
Cách dễ nhất để nhanh chóng tìm thấy phần tử div không được tiết lộ là sử dụng công cụ Trình xác thực W3C.
Bạn cũng có thể sử dụng công cụ Kiểm tra hoặc ứng dụng soạn thảo mã để giúp bạn gỡ lỗi mã bằng cách đánh dấu thẻ bắt đầu và thẻ kết thúc của các thành phần.
Khi xem mã, bạn cần đảm bảo rằng bất kỳ thẻ
Tương tự, bạn cũng muốn tìm thẻ đóng
Nếu bạn đã tìm thấy HTML bị hỏng thì việc sửa nó sẽ giải quyết được thanh bên xuất hiện bên dưới vấn đề nội dung.
CSS kiểm soát các khía cạnh quan trọng nhất trong thiết kế trang web của bạn. Chủ đề WordPress của bạn sử dụng CSS để xác định độ rộng của nội dung và các khu vực thanh bên trong bố cục dạng lưới.
Giá trị này tính theo tỷ lệ phần trăm của khu vực xem có sẵn. Trên thiết bị di động, chủ đề của bạn sẽ tự động đẩy thanh bên bên dưới nội dung xuống.
Để tìm ra CSS nào đang gây ra sự cố, bạn có thể sử dụng công cụ Kiểm tra. Chỉ cần di chuyển nội dung của bạn đến trường trình bao bọc, phần nội dung và khu vực thanh bên sẽ hiển thị cho bạn chiều rộng và chiều cao của chúng.
Ví dụ: nếu vùng nội dung của bạn rộng 70% và diện tích thanh bên là 33% thì nó sẽ tự động di chuyển xuống. Khi tính toán các giá trị này, bạn cũng có thể muốn xem xét khoảng trống được sử dụng bởi các giá trị đệm và lề trong mỗi phần.
Nếu bạn vẫn nhìn thấy thanh bên bên dưới khu vực nội dung thì bạn có thể muốn xóa bộ đệm WordPress của mình.
Khi bạn thực hiện các thay đổi không xuất hiện ngay lập tức, điều này thường là do vấn đề về bộ nhớ đệm.
Thông thường, các plugin bộ nhớ đệm sẽ hiển thị cho bạn phiên bản cũ hơn của cùng một trang. Xóa bộ nhớ cache WordPress và bộ nhớ cache của trình duyệt sẽ giúp bạn thấy những thay đổi được áp dụng cho trang web của mình.
Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách sửa lỗi thanh bên dưới lỗi nội dung trong WordPress. Bạn cũng có thể muốn đánh dấu sổ tay cuối cùng của chúng tôi về các lỗi WordPress phổ biến cũng như cách khắc phục chúng và đọc các lựa chọn hàng đầu của chúng tôi về các dịch vụ tiếp thị qua email tốt nhất dành cho doanh nghiệp nhỏ.
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 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.