Tuần trước mình nhận được email từ WordPress Make Core thông báo Beta 1 của WordPress 7.1 sẽ ra mắt ngày 15/7, tức là chỉ còn 4 ngày nữa. Mình lập tức thiết lập một staging environment để test trước khi bản chính thức ra mắt ngày 19/8. Nếu bạn đang quản lý site WordPress cho khách hàng hay cho dự án riêng, đây là lúc bạn cần chuẩn bị. Bài này mình sẽ hướng dẫn bạn từ A đến Z: tính năng mới đáng chú ý, cách thiết lập môi trường test, và checklist kiểm tra tương thích trước khi nâng cấp.
WordPress 7.1 Co Gi Moi Va Vi Sao Ban Can Chu Y?
WordPress 7.1 la ban release lon thu hai nam 2026, duoc lap trinh ra mat ngay 19/8/2026, trung dung ngay bế mạc WordCamp US tai Phoenix, Arizona. Anne McCarthy lần đầu đảm nhận vai trò release lead. Beta 1 ra ngày 15/7, RC1 ngày 5/8, và release cuối ngày 19/8. Cửa sổ test từ Beta 1 đến release chỉ có vỏn vẹn 5 tuần, khá ép so với các bản trước. Bạn cần bắt đầu test ngay từ tuần tới.
Nhung Tinh Nang Noi Bat Nhat Trong WordPress 7.1 La Gi?
WordPress 7.1 tập trung vào ba trụ cột: styling trực quan, AI framework, và collaboration. Mình đánh giá đây là bản release chất lượng cao đối với người xây site (site builder) và developer. Dưới đây là những tính năng mình thấy ảnh hưởng trực tiếp đến công việc hằng ngày của bạn.
Responsive Styling: Tu Chinh Block Cho Moi Kich Thuoc Man Hinh?
Đây là tính năng mình mong đợi nhất. Cho đến nay, nếu bạn muốn một block hiển thị khác nhau trên desktop và mobile, bạn phải viết custom CSS hoặc dùng plugin bên thứ ba. WordPress 7.1 mang responsive breakpoints vào thẳng Site Editor. Bạn có thể chuyển đổi giữa các viewport và tinh chỉnh style cho từng breakpoint trực tiếp trong giao diện editor, không cần đụng đến CSS.
Cùng đi kèm là interactive-state styling, cho phép bạn tạo style cho :hover, :focus, :active ngay trong block settings. Thêm vào đó, tính năng “display inherited styles” cho bạn thấy chính xác block đang kế thừa style từ global setting nào, giúp debug nhanh hơn nhiều.
React 19 Upgrade Anh Huong Gi Den Plugin Va Block Cua Ban?
WordPress 7.1 nâng cấp từ React 18 lên React 19. Nếu bạn chỉ dùng theme và plugin có sẵn, thay đổi này minh hình như không thấy. Nhưng nếu bạn phát triển custom block hoặc plugin có bundle JSX runtime riêng, bạn cần test trước. React 19 thay đổi một số API internals, và mình khuyến nghị kích hoạt experimental runtime flags sớm để kiểm tra compatibility layer.
Cách kiểm tra nhanh bằng WP-CLI:
# Kiem tra phien ban React hien tai trong Gutenberg plugin
wp eval '
$plugin_data = get_file_data(
WP_PLUGIN_DIR . "/gutenberg/package.json",
array("react_version" => "react")
);
var_dump($plugin_data);
' --path=/var/www/yoursite.com/public_html
# Kiem tra xem theme/plugin co bundle React rieng khong
grep -r "react" wp-content/plugins/your-plugin/node_modules/ --include="package.json" | head -5Nếu bạn phát triển block plugin, hãy cài Gutenberg plugin mới nhất (23.5+) và test trên môi trường staging trước 15/7.
Classic Block Bi Deprecate: Site Cua Ban Co Anh Huong Khong?
WordPress 7.1 chính thức deprecate Classic block và lazy-load TinyMCE. Điều này có nghĩa là nội dung cũ của bạn không bị phá vỡ, nhưng TinyMCE scripts sẽ chỉ tải khi trang thực sự có Classic content. Mình thấy đây là quyết định đúng đắn về mặt performance, vì TinyMCE là một thư viện nặng và nhiều site không hề dùng đến.
Kiểm tra xem site của bạn có dùng Classic block không:
# Tim post nao con dung Classic block
wp post list --post_type=post,page --fields=ID,post_title,post_date \
--format=table --path=/var/www/yoursite.com/public_html | head -20
# Kiem tra noi dung co chua Classic block markup
wp db query "SELECT ID, post_title FROM wp_posts WHERE post_content LIKE '%wp:freeform%' AND post_status='publish'" \
--path=/var/www/yoursite.com/public_htmlNếu kết quả trả về rỗng, site của bạn an toàn. Nếu có post dùng Classic block, hãy cân nhắc chuyển đổi sang block editor trước khi update lên 7.1.
Guidelines Feature: Cai Dat Editorial Rules Cho AI Va Human?
Guidelines là tính năng mới cho phép bạn định nghĩa editorial rules, brand voice, và content standards trực tiếp trong WordPress. Các rules này có thể import/export giữa các site. Khi bạn hoặc AI tool tạo nội dung, guidelines sẽ đảm bảo tính nhất quán về giọng văn, quy tắc format, và tiêu chuẩn nội dung.
Mình đánh giá đây là tính năng quan trọng cho team có nhiều người viết và dùng AI để generate draft. Thay vì memorize style guide trong prompt, bạn encode nó vào WordPress directly.
AI Client: Streaming Va Embeddings Den Voi WordPress Core?
WordPress 7.1 mở rộng AI Client với hai khả năng mới: generation streaming và vector embeddings. Streaming cho phép AI text hiển thị realtime khi được tạo, tương tự ChatGPT. Embeddings biểu diễn nội dung dưới dạng vector, mở đường cho semantic search nội bộ trong site.
Lưu ý: WordPress không bundle sẵn AI model. Bạn kết nối model qua Settings > Connectors. Nếu bạn chưa setup connector, đây là lúc làm quen vì 7.1 sẽ làm cho integration này mạnh mẽ hơn đáng kể.
Cac Block Moi Trong WordPress 7.1?
Ba block mới sẽ vào core trong 7.1: Tabs (tabbed panel layouts), Table of Contents (auto-generate từ heading anchors), và Playlist (audio playlist với waveform visualization). Mình particularly thích TOC block vì trước giờ mình phải dùng plugin như Easy Table of Contents, giờ có sẵn trong core.
Client-Side Media Processing Giup Gi Cho Server?
WordPress 7.1 dùng WebAssembly (wasm-vips) để xử lý ảnh trực tiếp trong browser trước khi upload. Điều này có nghĩa là thay vì server phải tốn CPU và RAM để resize một bức ảnh 24MP từ iPhone, browser sẽ làm việc đó. Thêm vào đó, 7.1 hỗ trợ native HEIC, Ultra HDR, và JPEG XL.
Mình đã viết chi tiết về tính năng này trong bài WordPress 7.1 Client-Side Media Processing, bạn có thể đọc thêm nếu quan tâm.
Cach Thiet Lap Staging Environment De Test WordPress 7.1?
Mình khuyến nghị ba cách để test WordPress 7.1 Beta, từ nhanh nhất đến chuyên nghiệp nhất. Tùy vào nhu cầu và infrastructure mà bạn chọn cách phù hợp.
Cách 1: WordPress Playground (nhanh nhất, 2 phút). Đây là cách nhanh nhất để xem tính năng mới mà không cần setup gì. Truy cập playground.wordpress.net, chọn WordPress Beta version, và bạn có environment chạy trong browser. Hạn chế là data không persist và không test được plugin tương thích.
Cách 2: Staging site trên VPS (khuyên dùng). Đây là cách mình dùng cho mọi site khách hàng. Clone production site sang subdomain hoặc folder riêng, sau đó update lên beta:
#!/bin/bash
# clone-to-staging.sh - Clone production sang staging
# Chay tren VPS co WP-CLI
SOURCE_DIR="/var/www/yoursite.com/public_html"
STAGING_DIR="/var/www/staging.yoursite.com/public_html"
SOURCE_DB="wordpress_prod"
STAGING_DB="wordpress_staging"
# 1. Tao database staging
mysql -u root -e "CREATE DATABASE IF NOT EXISTS $STAGING_DB;"
mysql -u root -e "GRANT ALL ON $STAGING_DB.* TO 'wp_user'@'localhost';"
# 2. Clone files
rsync -av --exclude='cache/' --exclude='logs/' \
"$SOURCE_DIR/" "$STAGING_DIR/"
# 3. Clone database
mysqldump --single-transaction -u root "$SOURCE_DB" | \
mysql -u root "$STAGING_DB"
# 4. Update wp-config cho staging
sed -i "s/$SOURCE_DB/$STAGING_DB/g" "$STAGING_DIR/wp-config.php"
sed -i "s/yoursite.com/staging.yoursite.com/g" "$STAGING_DIR/wp-config.php"
# 5. Search-replace URL
wp search-replace 'https://yoursite.com' 'https://staging.yoursite.com' \
--path="$STAGING_DIR" --all-tables
# 6. Deactivate caching plugin tren staging
wp plugin deactivate litespeed-cache w3-total-cache wp-rocket \
--path="$STAGING_DIR" 2>/dev/null || true
echo "Staging ready: https://staging.yoursite.com"Sau khi staging sẵn sàng, cài Gutenberg plugin mới nhất và cập nhật WordPress core lên beta:
# Install Gutenberg plugin (can phai co de test 7.1 features)
wp plugin install gutenberg --activate \
--path=/var/www/staging.yoursite.com/public_html
# Update WordPress core len beta channel
wp core update --version=7.1-beta1 --force \
--path=/var/www/staging.yoursite.com/public_html
# Hoac dung Gutenberg plugin tren WordPress 7.0 de test features
wp plugin update gutenberg \
--path=/var/www/staging.yoursite.com/public_html
# Kiem tra phien ban
wp core version --path=/var/www/staging.yoursite.com/public_html
wp plugin list --status=active --fields=name,version \
--path=/var/www/staging.yoursite.com/public_htmlCách 3: Local development với WordPress Studio. WordPress Studio hiện đã có bản cho Linux, ngoài Mac và Windows. Đây là desktop app tạo local WordPress environment nhanh, tương tự Local by Flywheel nhưng official từ Automattic.
Checklist Test WordPress 7.1 Cho Site Cua Ban?
Khi staging environment sẵn sàng, đây là checklist 8 bước mình chạy qua cho mọi site trước khi update production. Ded khoảng 30-45 phút cho site thông thường.
1. Kiểm tra theme compatibility. Kích hoạt theme trên staging, truy cập Appearance > Editor. Nếu theme là block theme (FSE), mở Site Editor và kiểm tra mọi template. Nếu theme là classic, kiểm xem không có lỗi PHP warning.
# Kiem tra PHP errors sau khi load staging
tail -100 /var/www/staging.yoursite.com/logs/error.log | \
grep -i "fatal\|warning\|deprecated"
# Kiem tra theme co support block editor khong
wp eval '
$theme = wp_get_theme();
echo "Theme: " . $theme->get('Name') . "\n";
echo "Version: " . $theme->get('Version') . "\n";
echo "FSE: " . (current_theme_supports("block-templates") ? "Yes" : "No") . "\n";
' --path=/var/www/staging.yoursite.com/public_html2. Test responsive styling. Mở một page bất kỳ trong editor, chọn một block (ví dụ Columns), thử thay đổi style cho từng breakpoint. Nếu giao diện editor hiển thị đúng và thay đổi apply trên frontend, tính năng hoạt động.
3. Test interactive states. Chọn một Button block, thử thêm :hover style trong block settings panel. Lưu lại, xem frontend, hover vào button để xác nhận.
4. Kiểm tra Classic block deprecation. Nếu site có post dùng Classic block, mở post đó trong editor. TinyMCE sẽ lazy-load, có thể chậm hơn một chút ở lần đầu nhưng nội dung phải hiển thị đúng.
5. Test plugin compatibility. Lần lượt activate từng plugin, reload editor, và kiểm tra console error:
# Liệt kê plugin active tren production de test
wp plugin list --status=active --fields=name,version \
--path=/var/www/staging.yoursite.com/public_html
# Test tung plugin: deactivate all, roi activate tung cai
wp plugin deactivate --all --path=/var/www/staging.yoursite.com/public_html
# Activate tung plugin va kiem tra
for plugin in $(wp plugin list --status=active --field=name \
--path=/var/www/staging.yoursite.com/public_html); do
wp plugin activate "$plugin" --path=/var/www/staging.yoursite.com/public_html
echo "Testing: $plugin"
# Load homepage va kiem tra error
wp eval 'echo "OK\n";' --path=/var/www/staging.yoursite.com/public_html
done6. Test Core Web Vitals. Chạy PageSpeed Insights cho staging URL. So sánh với production. Nếu LCP hoặc CLS tệ hơn đáng kể, nguyên nhân có thể là JavaScript chưa optimize hoặc cache chưa clear.
7. Test media upload. Upload ảnh HEIC (nếu có iPhone), ảnh JPEG thông thường, và GIF. Kiểm tra ảnh được resize đúng và hiển thị đúng trên frontend.
8. Test new blocks. Tạo page mới, thử chèn Tabs block, Table of Contents block, và Playlist block. Lưu lại và xem frontend hiển thị đúng.
Bao Gio Nen Update Production Len WordPress 7.1?
Mình có quy tắc: không bao giờ update production trong tuần đầu tiên sau release. Khoảng thời gian an toàn nhất là 1-2 tuần sau release chính thức (tức là sau ngày 19/8). Lúc này các plugin phổ biến đã kịp ra bản update tương thích, và các bug nghiêm trọng (nếu có) đã được patch trong 7.1.1.
Lịch trình mình khuyến nghị:
# Timeline recommended cho production update
# 19/8: WordPress 7.1 release
# 19-26/8: Cho plugin authors update tuong thich
# 27/8: Update staging, test full checklist
# 28/8: Neu staging OK -> update production
# Dat reminder cho release date
echo "WordPress 7.1 release: 2026-08-19" | at midnight 2026-08-19Cac Plugin Can Chu Y Dac Biet Khi Update Len 7.1?
Dựa trên kinh nghiệm từ các bản release trước và những thay đổi trong 7.1, mình đánh dấu các plugin sau cần test kỹ: plugin có bundle React riêng (Elementor, WooCommerce blocks), plugin tạo custom block (Meta Box, ACF), và plugin liên quan đến editor (WPBakery, Divi Builder). React 19 upgrade là thay đổi lớn nhất ảnh hưởng đến ecosystem plugin.
# Kiem tra plugin nao co the bi anh huong boi React 19
wp plugin list --status=active --fields=name,version \
--path=/var/www/yoursite.com/public_html | \
while read plugin; do
# Kiem tra xem plugin co bundle React khong
if find "wp-content/plugins/$(echo $plugin | awk '{print tolower($1)}')" \
-name "*.js" -exec grep -l "react" {} \; 2>/dev/null | head -1; then
echo "CAUTION: $plugin bundles React - test before update"
fi
doneKet Luan: Dung Cho Den Phut Cuoi De Test WordPress 7.1
Với Beta 1 ra mắt ngày 15/7 và release cuối ngày 19/8, bạn có 5 tuần để chuẩn bị. Đừng đợi đến ngày release mới bắt đầu test. Thiết lập staging ngay tuần này, chạy qua checklist 8 bước mình hướng dẫn, và ghi nhận mọi issue. Nếu bạn phát hiện bug, report lên Gutenberg GitHub repository hoặc WordPress Trac. Community cần feedback từ người dùng thực tế để 7.1 release ổn định hơn. Nếu bạn có câu hỏi về tính năng cụ thể hoặc cần help setup staging, comment bên dưới, mình sẽ hỗ trợ.
