WordPress Gallery Không Hiển Thị? 15 Nguyên Nhân Và Cách Khắc Phục Chi Tiết Nhất

wordpress gallery không hiển thị

Khi bạn xây dựng một trang web với WordPress, gallery ảnh là công cụ không thể thiếu để trình bày sản phẩm, dự án hoặc bộ sưu tập cá nhân. Tuy nhiên, lỗi wordpress gallery không hiển thị xảy ra khá phổ biến, khiến hình ảnh trắng xoá hoặc chỉ hiện mã shortcode thay vì bộ ảnh đẹp mắt. Nguyên nhân có thể đến từ xung đột plugin, lỗi JavaScript, cache trình duyệt hoặc cấu hình theme không tương thích. Bài viết này sẽ giúp bạn hiểu rõ bản chất của vấn đề, phân tích từng nguyên nhân và đưa ra giải pháp thực tế để gallery hoạt động ổn định.

Bản Chất Của Gallery Trong WordPress Và Tại Sao Nó Không Hiển Thị

wordpress gallery không hiển thị - Hình 5

Trong WordPress, gallery được xây dựng dựa trên hệ thống shortcode hoặc block của Gutenberg. Khi bạn chèn một bộ ảnh qua thư viện media, mã shortcode hoặc block gallery sẽ được tạo ra. Sau đó, WordPress xử lý mã này và hiển thị grid ảnh tương ứng. Nếu quá trình này bị gián đoạn, gallery sẽ không hiện ra.

Gallery không hiển thị có thể biểu hiện dưới nhiều dạng: khoảng trắng thay vì ảnh, chỉ thấy dòng chữ shortcode, ảnh bị vỡ layout, hoặc trình duyệt tải mãi không xong. Mỗi dấu hiệu đều phản ánh một tầng vấn đề khác nhau, từ lỗi đơn giản như thiếu file ảnh đến phức tạp như xung đột mã nguồn.

15 Nguyên Nhân Khiến WordPress Gallery Không Hiển Thị

wordpress gallery không hiển thị - Hình 4

1. Xung Đột Plugin Gây Lỗi Gallery

Plugin là nguyên nhân hàng đầu. Nhiều plugin tối ưu ảnh, lazy load, cache hoặc bảo mật có thể can thiệp vào cách WordPress xử lý shortcode và block. Ví dụ: plugin caching như W3 Total Cache có thể nén gallery thành file tĩnh và không cập nhật khi bạn thêm ảnh mới. Plugin lazy load ảnh đôi khi bỏ qua gallery block, khiến ảnh không bao giờ được tải.

Cách kiểm tra nhanh: Tạm thời vô hiệu hoá toàn bộ plugin, trừ các plugin cốt lõi (Akismet, Hello Dolly). Nếu gallery hiển thị trở lại, kích hoạt từng plugin để xác định thủ phạm.

2. Lỗi JavaScript Trong Theme Hoặc Plugin

Gallery của WordPress phụ thuộc vào JavaScript để hiển thị lightbox, masonry, hoặc slider. Nếu theme hoặc plugin chèn script bị lỗi cú pháp, toàn bộ gallery có thể ngừng hoạt động. Lỗi này thường hiện trong console trình duyệt (F12) với thông báo như Uncaught TypeError hoặc jQuery is not defined.

Để khắc phục, kiểm tra xem theme có tải jQuery đúng cách không. Một số theme cũ tự động loại bỏ jQuery để tối ưu, nhưng vô tình làm hỏng gallery. Dùng plugin “Enable jQuery Migrate” để xử lý tạm thời.

3. Theme WordPress Không Tương Thích Với Gallery Block

Các theme cũ được xây dựng cho Classic Editor thường không hỗ trợ đầy đủ block gallery của Gutenberg. Kết quả là gallery chỉ hiển thị dưới dạng danh sách ảnh đơn giản hoặc bị lỗi layout. Hãy kiểm tra xem theme có hỗ trợ wp-block-gallery hay không. Vào Giao diện → Tùy chỉnh → CSS bổ sung, thêm đoạn CSS sau để kiểm tra:

/ Không dùng code block, chỉ mô tả /.wp-block-gallery { border: 2px solid red; }

Nếu thấy viền đỏ, theme đã nhận diện block, vấn đề nằm ở chỗ khác. Nếu không, bạn cần cập nhật theme hoặc chuyển sang theme hiện đại hơn.

4. Cache Trình Duyệt Và Cache WordPress

Cache lưu phiên bản cũ của gallery. Khi bạn thay đổi ảnh hoặc shortcode, trình duyệt vẫn hiển thị grid ảnh cũ hoặc không hiển thị gì cả. Xoá cache trình duyệt (Ctrl+F5) và xoá cache WordPress từ plugin (WP Rocket, W3 Total Cache) là bước đầu tiên bạn nên làm.

5. CDN (Content Delivery Network) Không Đồng Bộ

Nếu bạn dùng CDN như Cloudflare, hình ảnh gallery có thể được lưu trữ tại các server khác nhau. Khi bạn upload ảnh mới nhưng CDN chưa cập nhật, gallery sẽ bỏ sót ảnh hoặc hiển thị ảnh cũ. Vào dashboard CDN, purge cache (xóa bộ nhớ đệm) để đồng bộ lại.

6. Lỗi Permalink (Đường Dẫn Tĩnh)

Cấu trúc permalink không chính xác có thể khiến URL ảnh trong gallery bị hỏng. Vào Cài đặt → Đường dẫn tĩnh, chọn định dạng “Tên bài viết” và nhấn Lưu thay đổi. WordPress sẽ tự động cập nhật lại rewrite rules.

7. Thiếu File Ảnh Gốc Hoặc Ảnh Bị Xóa

Gallery không hiển thị ảnh nếu file ảnh gốc đã bị xóa khỏi thư mục wp-content/uploads. Điều này xảy ra khi bạn xóa ảnh từ Thư viện media mà không cập nhật gallery. Kiểm tra trong Media Library, nếu ảnh có dấu hiệu “File không tồn tại”, bạn cần upload lại.

8. Xung Đột Giữa Plugin Gallery Và WordPress Core

Các plugin gallery chuyên dụng như NextGEN Gallery, Envira Gallery, hoặc FooGallery đôi khi can thiệp vào shortcode mặc định của WordPress. Nếu bạn dùng nhiều plugin cùng lúc, shortcode có thể bị ghi đè. Vô hiệu hoá các plugin gallery bên thứ ba, chỉ giữ lại gallery mặc định để kiểm tra.

9. Lỗi PHP Memory Limit (Giới Hạn Bộ Nhớ)

Một gallery có quá nhiều ảnh dung lượng lớn có thể vượt quá giới hạn bộ nhớ PHP của hosting. Kết quả là gallery bị cắt ngang hoặc không tải được. Tăng memory limit lên 256MB bằng cách thêm dòng code vào file wp-config.php:

define('WP_MEMORY_LIMIT', '256M');

10. Plugin Bảo Mật Chặn Script Gallery

Plugin bảo mật như Wordfence, iThemes Security có thể chặn JavaScript của gallery nếu cho rằng đó là mã độc. Kiểm tra log bảo mật để xem gallery có bị liệt vào danh sách chặn không. Tạm thời tắt plugin bảo mật để xác nhận.

11. Lỗi Khi Chèn Shortcode Gallery Thủ Công

Nếu bạn tự gõ shortcode

mà không có tham số ids, WordPress sẽ không biết lấy ảnh nào. Hãy dùng nút “Add Media” để chèn gallery, tránh gõ tay.

12. Extension ImageMagick Hoặc GD Bị Lỗi

WordPress dùng thư viện ImageMagick hoặc GD để tạo thumbnail cho gallery. Nếu các extension này bị vô hiệu hoá trên server, ảnh gallery sẽ không có kích thước phù hợp và hiển thị lỗi. Liên hệ nhà cung cấp hosting để kiểm tra.

13. Lỗi Do Plugin Lazy Load Ảnh

Lazy load là kỹ thuật trì hoãn tải ảnh đến khi người dùng cuộn đến. Tuy nhiên, một số plugin lazy load không tương thích với gallery block, khiến ảnh không bao giờ được tải. Thử vô hiệu hoá lazy load hoặc dùng plugin lazy load chuyên cho WordPress (ví dụ: Lazy Load by WP Rocket).

14. CSS Theme Ghi Đè Lên Gallery Style

Theme có thể có CSS tùy chỉnh ẩn hoặc thay đổi kích thước gallery. Ví dụ: display: none hoặc opacity: 0 sẽ làm gallery biến mất. Dùng công cụ Inspect Element (F12) để kiểm tra xem gallery có bị CSS ẩn không.

15. Lỗi HTTPS Và Mixed Content

Nếu trang web dùng HTTPS nhưng URL ảnh vẫn là HTTP, trình duyệt sẽ chặn tải ảnh vì lý do bảo mật, khiến gallery không hiển thị. Cài đặt plugin “Really Simple SSL” hoặc cập nhật URL ảnh trong cơ sở dữ liệu bằng công cụ Better Search Replace.

Hướng Dẫn Khắc Phục WordPress Gallery Không Hiển Thị Bước-By-Bước

wordpress gallery không hiển thị - Hình 3

Bước 1: Kiểm Tra Console Trình Duyệt

Mở trang có gallery, nhấn F12 → tab Console. Xem có lỗi JavaScript màu đỏ không. Nếu có, ghi lại lỗi và tìm giải pháp cụ thể. Lỗi “Uncaught SyntaxError” thường do plugin script.

Bước 2: Tắt Plugin Gây Xung Đột

Vào Plugins → đã cài đặt, chọn “Deactivate” tất cả plugin. Nếu gallery hoạt động, kích hoạt từng plugin một để tìm thủ phạm. Nên bắt đầu với plugin cache, lazy load, gallery third-party.

Bước 3: Kiểm Tra Theme

Tạm chuyển sang theme mặc định (Twenty Twenty-Four hoặc Twenty Twenty-Three). Nếu gallery hiển thị, theme của bạn đang có vấn đề. Liên hệ nhà phát triển theme để cập nhật.

Bước 4: Xoá Cache Toàn Diện

Xoá cache trình duyệt (Ctrl+Shift+Del), cache WordPress từ plugin, cache CDN. Dùng plugin “Autoptimize” để xoá cache CSS/JS nếu cần.

Bước 5: Kiểm Tra Shortcode Gallery

Trong bài viết, chuyển sang chế độ Text/HTML. Đảm bảo shortcode có dạng đúng: không có khoảng trắng thừa. Nếu dùng block, xoá block cũ và thêm lại block gallery mới.

Bước 6: Tăng Memory Limit PHP

Thêm vào file wp-config.php dòng define('WP_MEMORY_LIMIT', '256M'); trước dòng “That’s all”. Lưu và refresh.

Bước 7: Cập Nhật WordPress, Theme, Plugin

Đảm bảo bạn đang dùng phiên bản mới nhất. Vào Dashboard → Cập nhật để kiểm tra.

So Sánh Các Plugin Gallery WordPress Phổ Biến

Tên Plugin Ưu Điểm Nhược Điểm Tương Thích Với Gutenberg
NextGEN Gallery Tính năng mạnh, hỗ trợ album, lightbox Nặng, dễ xung đột Có plugin bổ sung
Envira Gallery Nhẹ, responsive, nhiều template Bản Pro có phí Tốt
FooGallery Miễn phí, dễ dùng, tích hợp tốt Ít tính năng nâng cao Tốt
Modula Gallery Masonry đẹp, custom grid Cần Pro cho nhiều layout Tốt
WordPress Default (Core) Miễn phí, tương thích cao Giới hạn tính năng Tuyệt vời

Những Sai Lầm Thường Gặp Khi Xử Lý Gallery Không Hiển Thị

wordpress gallery không hiển thị - Hình 2
    • Chỉ refresh trang mà không xoá cache: Cache trình duyệt và server vẫn giữ phiên bản cũ, gallery không thay đổi.
    • Vô hiệu hoá tất cả plugin cùng lúc nhưng không kiểm tra kỹ: Sau đó kích hoạt ồ ạt, không xác định được thủ phạm.
    • Chỉnh sửa file theme trực tiếp mà không dùng child theme: Nếu sai sót, gallery có thể hỏng thêm.
    • Dùng nhiều plugin gallery cùng loại: Chúng sẽ tranh chấp shortcode, gây lỗi hiển thị.
    • Bỏ qua kiểm tra log lỗi server: Log PHP và error log hosting chứa thông tin quý giá về lỗi bộ nhớ, script.

Lưu Ý Quan Trọng Khi Thiết Lập Gallery Trên WordPress

Trước khi tạo gallery, hãy chọn một plugin uy tín hoặc dùng gallery mặc định. Sao lưu cơ sở dữ liệu và file gốc trước khi can thiệp sâu. Nếu gallery dùng ảnh từ thư viện media, không nên xóa ảnh gốc nếu vẫn còn gallery liên kết. Đối với website thương mại, nên dùng CDN và lazy load có cấu hình đúng để gallery tải nhanh, tránh lỗi không hiển thị do timeout.

Nếu bạn dùng page builder như Elementor, hãy đảm bảo page builder được cập nhật và không có xung đột với gallery block của WordPress. Một số page builder tự động tắt block Gutenberg, khiến gallery mặc định không hoạt động.

Câu Hỏi Thường Gặp (FAQ)

wordpress gallery không hiển thị - Hình 1

Tại sao gallery WordPress của tôi chỉ hiển thị mã shortcode?

Nguyên nhân thường do plugin không kích hoạt hoặc theme không hỗ trợ shortcode. Hãy kiểm tra xem plugin Jetpack (tính năng Shortcode Embeds) có bật không, hoặc chuyển sang theme mặc định để thử.

Làm sao để sửa lỗi gallery không hiển thị ảnh khi dùng CDN?

Xoá cache trên CDN (purge cache) và đảm bảo cài đặt SSL đúng. Nếu ảnh vẫn không hiện, kiểm tra URL ảnh trong source code có dùng HTTPS không.

Plugin lazy load ảnh có gây lỗi gallery không?

Có, nếu plugin lazy load không hỗ trợ gallery block. Tốt nhất dùng lazy load từ plugin cache uy tín (WP Rocket, W3 Total Cache) đã được tối ưu cho gallery.

WordPress gallery không hiển thị trên điện thoại, nguyên nhân do đâu?

Thường do theme không responsive hoặc CSS gallery không được viết cho mobile. Kiểm tra trong chế độ mobile của trình duyệt (F12) và chỉnh sửa CSS tương ứng.

Có cần cài plugin gallery riêng không?

Không bắt buộc. Gallery mặc định của WordPress đủ dùng cho nhu cầu cơ bản. Nếu cần hiệu ứng hoặc layout phức tạp, hãy chọn plugin có đánh giá cao và tương thích với theme.

Kết Luận

Lỗi wordpress gallery không hiển thị thường bắt nguồn từ những nguyên nhân có thể kiểm soát được như xung đột plugin, cache, hoặc cấu hình server. Bằng cách làm theo quy trình từ đơn giản đến phức tạp – kiểm tra console, tắt plugin, đổi theme, xoá cache – bạn có thể khôi phục gallery chỉ trong vài phút. Hãy luôn sao lưu dữ liệu trước khi thực hiện bất kỳ thay đổi nào. Một gallery hoạt động ổn định không chỉ giúp nội dung trực quan hơn mà còn cải thiện trải nghiệm người dùng và SEO tổng thể của website.

Bài viết cùng chủ đề:

Để lại một bình luận

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *