Chuyển blogger sang next js — giữ SEO khi rời Blogspot
· Tác giả: Trường — Founder Webchốt
Chuyển blogger sang next js là bước nhiều cá nhân viết lâu năm và SME dùng Blogspot làm “nhật ký công khai” cân nhắc khi traffic organic đã đủ lớn để đáng một trang tự chủ. Google vẫn index tốt Blogspot nếu nội dung sạch, nhưng giao diện mặc định hay theme bên thứ ba dễ tích lũy CSS thừa, script chậm, và khó can thiệp edge cache — trong khi Next.js cho bạn tách layout, tối ưu ảnh và kiểm soát redirect 301 theo từng bài. Khi bạn nhấn “Back up content” và nhận file lớn chứa toàn bộ entry, đó chính là điểm khởi đầu để pipeline dev đọc blogger export xml, chuẩn hoá slug và dựng lại site mà không phải copy–paste từng trang. Phần còn lại của quá trình là quản trị rủi ro SEO: map URL cũ, giữ title/description, và đo lại Core Web Vitals sau go-live.
Migration là bài toán dữ liệu + URL — không chỉ đổi theme | Nguồn: webchot.com
Blogger export XML: dữ liệu thô, comment và nhãn
Google Blogger cho phép tải một file XML chứa toàn bộ entry: tiêu đề, nội dung HTML, timestamp, nhãn, và phần lớn comment nếu bạn bật. Đó là “blogger export xml” mà team kỹ thuật cần trước khi viết parser hoặc dùng công cụ chuyển đổi sang Markdown. Trên thực tế, file này không thay thế Media CDN: ảnh lớn thường trỏ tới URL Google Photos/Blogger storage — bạn vẫn phải có bước mirror ảnh về bucket riêng để tránh gãy link khi domain DNS đổi chủ hoặc policy hotlink thay đổi. Khi parse HTML trong XML, lưu ý thẻ <iframe> embed video, blockquote và table lồng nhau; chúng cần quy ước chuyển sang component React tương ứng hoặc giữ raw HTML có sanitize.
Sau khi có bản XML, hãy tạo bảng mapping slug Blogspot → đường dẫn mới trên Next.js. Nếu permalink có dạng /2024/03/bai-viet.html, bạn có thể giữ pattern tương tự trong folder app hoặc chuẩn hoá /blog/bai-viet kèm redirect 301. Sai lầm phổ biến là đổi slug hàng loạt mà không redirect — Search Console sẽ báo tăng trùng nội dung hoặc soft 404. Pipeline hợp lý: validate số bài export khớp sitemap cũ, diff title lớn, rồi mới import staging.
So sánh chiến lược: blog subdomain vs tên miền mới
Một số thương hiệu muốn giữ blog.example.com trỏ về Next.js trong khi marketing site chạy nền khác; số khác gom hết vào /blog trên apex domain để tập trung authority. Cả hai đều khả thi nhưng ảnh hưởng đến chứng chỉ TLS, cookie và cache rule trên CDN. Next.js App Router cho phép route group để tách layout blog khỏi landing chính mà không đụng URL công khai.
- Giữ subdomain: DNS CNAME tới nền host mới; cập nhật
canonicaltrỏ đúng host ưu tiên. - Gom /blog: viết redirect cấp edge từ URL blogspot; kiểm tra chuỗi redirect không vượt quá một-hop.
- Tách CMS: Sanity/Contentlayer/MDX — biên tập không đụng Git nếu không cần.
- Tách static: bài ít đổi có thể SSG; feed cập nhật nhanh dùng ISR với
revalidatehợp lý.
Bảng quyết định kỹ thuật sau khi import XML
Dưới đây là khung so sánh nhanh ba hướng triển khai thường gặp khi khách đã có file backup và muốn go-live trong hai tuần. Con số thời gian là ước lượng cho blog cá nhân 200–600 bài, chưa kể e-commerce.
| Tiêu chí | MDX trong repo | CMS headless | Lưu JSON + admin tự làm | Khuyên dùng |
|---|---|---|---|---|
| Tốc độ build | Ổn đến vài trăm file | Nhanh, tách build | Phụ thuộc cron/ISR | CMS nếu biên tập nhiều |
| Chi phí vận hành | Thấp | Trung bình | Thấp–trung | MDX nếu ít người sửa |
| Khả năng rollback | Git revert | Version field | Backup DB | Git + CMS snapshot |
| SEO kỹ thuật | metadata API rõ | SEO plugin tuỳ CMS | Tự code map | metadata API Next.js |
Nếu bạn chọn MDX thuần, hãy chắc team marketing hiểu pull request; ngược lại CMS giảm ma sát nhưng tăng chi phí license hoặc quota API. Dù chọn đâu, hãy giữ một sheet mapping URL công khai để đội ads và affiliate không đặt link cũ sau ngày cắt.
Quy trình migration thực địa (5 bước)
- Kiểm kê URL: crawl sitemap Blogspot, lưu status code và inbound internal link nổi bật; đánh dấu bài có traffic cao trong Search Console.
- Parse blogger export xml: tách nội dung, chuẩn hoá HTML → MDX, tải ảnh về CDN, ghi log ảnh lỗi để xử lý tay.
- Dựng route Next.js: tạo dynamic segment theo slug mới, khai báo
generateStaticParamsnếu build tĩnh, hoặc ISR nếu cần. - Redirect và header: cấu hình 301/308 ở edge; bật HSTS sau khi cert ổn định; kiểm tra mixed content.
- Đo và theo dõi: Lighthouse lab trước go-live, sau đó theo dõi field CRUX trong 28 ngày; lập checklist 404 từ log server.
Sau bước 5, đừng xoá XML gốc: đó là bằng chứng pháp lý nhẹ cho bản quyền nếu tranh chấp nội dung và là checkpoint để diff nếu import script có lỗi ký tự. Tham khảo thêm kiến trúc trong tài liệu Next.js docs và bài đọc web.dev Core Web Vitals để không nhầm lẫn giữa lab và dữ liệu thực.
Chi phí, gói Webchốt và liên kết /dich-vu
Khoản đầu tư không chỉ là “làm đẹp template”: gồm audit URL, script import, staging, đào tạo biên tập và 30 ngày theo dõi 404. Với blog cá nhân vài trăm bài, gói Starter từ 5.000.000đ thường đủ nếu layout đơn giản và không cần membership; blog doanh nghiệp có nhiều landing con, A/B microcopy và integration CRM sẽ rơi vào Business 15.000.000đ hoặc Pro theo scope. Bạn có thể xem chi tiết dịch vụ, phạm vi bàn giao và cam kết bảo hành trên trang dịch vụ Webchốt — nơi mình liệt kê rõ các gói web, migration và bảo trì hàng tháng để khách không phải đoán “còn thiếu gì sau hợp đồng”.
Phần bảo trì 200.000–500.000đ/tháng thường bao cập nhật dependency an toàn, backup nội dung và hotfix khi CDN vendor đổi header. Nếu bạn tự host và chỉ cần tư vấn định hướng, có thể book call ngắn qua hotline để mình review file XML trước (không thay thế hợp đồng bảo mật dữ liệu nếu bạn có NDA nội bộ).
Sai lầm khiến traffic tụt sau khi rời Blogger
Nhiều chủ blog nghĩ “import xong là xong”; thực tế rủi ro tập trung ở URL và ảnh. Dưới đây là bốn lỗi mình gặp lại trong các dự án Việt Nam 2024–2026.
- Không 301 đầy đủ: vài bài viral vẫn dùng URL cũ dài với tham số
?m=1; crawler báo trùng hoặc Soft 404. Cần rule tách mobile query. - Giữ nguyên HTML bẩn: thẻ
font, style inline từ thời Windows Live Writer làm CLS trồi sụt; nên chuẩn hoá class Tailwind hoặc CSS module có giới hạn. - Bỏ qua metadata: title cắt byte lạ, duplicate description sau import hàng loạt — Search Console hiển thị CTR giảm dần.
- Không kế hoạch ảnh: hotlink tới Blogger khiến LCP phụ thuộc latency Google; chuyển sang
next/imagevới kích thước cố định giúp ổn định điểm số lab.
FAQ — chuyển blogger sang next js
File XML export từ Blogger có đủ để dựng lại site Next.js không?
XML chứa bài viết, nhận xét, nhãn và metadatum cơ bản; thường không có toàn bộ widget tuỳ chỉnh hay script legacy. Team dev parse XML thành Markdown/MDX hoặc đẩy vào CMS, sau đó map slug cũ sang route App Router và cấu hình redirect để Google không thấy 404 hàng loạt. Bạn vẫn cần bước riêng cho media và redirect edge.
Có nên giữ nguyên permalink blogspot hay tự host?
Tuỳ rủi ro thương hiệu. Subdomain Blogspot vẫn chạy nhưng khó kiểm soát header bảo mật, CSP và tuỳ biến edge. Tự host Next.js giúp ISR, image tối ưu và TLS đồng nhất; quan trọng nhất là kế hoạch 301 từ URL cũ nếu đổi domain. Khi không chắc, hãy chạy song song staging một tuần và so sánh coverage.
Blogger export XML có giữ được ảnh không?
Ảnh nhúng qua link Google thường vẫn sống sau export, nhưng nên tải về object storage/CDN để không phụ thuộc hotlink. Quy trình chuẩn: crawler nội bộ lấy URL trong nội dung, re-upload có kích thước chuẩn rồi thay src trong MDX để tránh ảnh gãy khi Blogger đổi policy. Log ảnh lỗi để xử lý tay.
Core Web Vitals sau khi chuyển có cải thiện không?
Thường có nếu loại bỏ theme cũ nặng và dùng font tối ưu, image next/image, route segment static khi thích hợp. Theo tài liệu web.dev/vitals, đo trên field data Search Console là thước đo thực; lab Lighthouse chỉ là proxy trước go-live. Đừng tối ưu ảnh quá mức làm mất chất lượng thương hiệu.
Webchốt hỗ trợ migration Blogger như thế nào?
Workshop scope, audit URL, script import XML + checklist hình ảnh, staging so khớp title/meta, go-live có monitor 404. Liên hệ 0905 151 701 hoặc hi@webchot.com; xem catalog đầy đủ trên /dich-vu/ để chọn gói phù hợp và bảo trì sau bàn giao.
Liên Hệ Webchốt
Nếu bạn đã có file backup và muốn chuyển blogger sang next js mà vẫn giữ sự bình tĩnh cho SEO, hãy ưu tiên ba việc: map URL, làm sạch HTML import, và đo lại hiệu năng sau redirect. Webchốt (Uy tín & Tận tâm) có thể đồng hành từ khâu đọc blogger export xml tới ngày bật Google Analytics 4 property mới. Hotline/Zalo 0905 151 701 để nói chuyện trực tiếp với mình.
- Hotline / Zalo: 0905 151 701 — gặp anh Trường (founder/dev).
- Chat Zalo: zalo.me/0905151701 — phản hồi nhanh.
- Email: hi@webchot.com — phản hồi <12h làm việc.
- Studio: 262/1/93 Phan Anh, Phường Phú Thạnh, TP.HCM (T2–T7, 9h–18h).
Tham khảo thêm: 17 template Next.js · 10 dịch vụ web chuyên sâu · bảng giá Webchốt 2026 · 12 công cụ kế toán/tài chính miễn phí.
Reference: Next.js docs · web.dev Core Web Vitals.