DevOpsADTEK LABS JOURNAL

Tôi Đã Chuyển Website WordPress Sang Cloudflare Pages Như Thế Nào?

Quy trình chuyển một website đang chạy WordPress trên VPS thành website tĩnh trên Cloudflare Pages, sau đó tắt PHP, database và hủy VPS.

adtekCập nhật
Tôi Đã Chuyển Website WordPress Sang Cloudflare Pages Như Thế Nào?

Mình có một website đang chạy WordPress trên VPS. Website vẫn hoạt động tốt, nhưng để duy trì nó thì phía sau phải có đủ thứ chạy 24/7:

VPS
├── Linux
├── Nginx / Apache
├── PHP
├── WordPress
└── MySQL / MariaDB

Đi kèm với đó là tiền thuê VPS, cập nhật hệ điều hành, vá WordPress và plugin, backup database, theo dõi dung lượng, chống brute force vào wp-admin và xử lý mỗi khi server có vấn đề.

Trong khi đó, website của mình chủ yếu là bài viết. Nội dung chỉ thay đổi khi đăng bài mới, không có tài khoản thành viên, giỏ hàng hay dữ liệu cần xử lý theo thời gian thực.

Vì vậy mình quyết định chuyển nhà:

WordPress đang chạy trên VPS

Xuất toàn bộ website thành HTML tĩnh

Đưa source lên GitHub

Cloudflare Pages phục vụ website

Tắt WordPress và hủy VPS

Mục tiêu không phải giữ WordPress chạy ở một nơi khác. WordPress chỉ được dùng để tạo bản website hoàn chỉnh cho lần chuyển nhà này. Khi bản static trên Cloudflare Pages đã chạy ổn định, VPS, PHP và database cũ sẽ được tắt hoàn toàn.

Trước và sau khi chuyển nhà

Trước đây, mỗi lượt truy cập đi qua toàn bộ hệ thống WordPress:

Browser → VPS → Nginx → PHP → WordPress → MySQL → HTML

Sau khi chuyển, Cloudflare chỉ cần trả về những file đã được tạo sẵn:

Browser → Cloudflare Pages → HTML / CSS / JS / Images

Kết quả mình cần đạt được là:

  • website vẫn giữ giao diện và nội dung cũ;
  • các URL bài viết cũ không bị thay đổi;
  • hình ảnh, category, tag, sitemap và internal link vẫn hoạt động;
  • không còn PHP, MySQL và wp-admin trên website public;
  • không còn VPS dành riêng cho WordPress;
  • không còn tiền thuê và công việc vận hành VPS đó.

Website nào phù hợp với cách này?

Cách chuyển này phù hợp với blog, tài liệu, portfolio hoặc website giới thiệu mà nội dung sau khi xuất bản gần như cố định.

Nếu website đang dùng các chức năng sau thì không thể chỉ export thành HTML rồi tắt WordPress:

  • WooCommerce và giỏ hàng;
  • đăng nhập thành viên;
  • bình luận WordPress;
  • tìm kiếm phụ thuộc database;
  • form xử lý trực tiếp bằng plugin WordPress;
  • dữ liệu thay đổi theo thời gian thực.

Các chức năng đó phải được bỏ hoặc thay bằng một dịch vụ khác trước khi đóng VPS.

Bước 1: Kiểm kê website WordPress hiện tại

Trước khi làm, mình lập danh sách những phần cần mang sang nhà mới:

  • trang chủ;
  • toàn bộ bài viết và page;
  • category và tag;
  • menu;
  • hình ảnh trong Media Library;
  • CSS, JavaScript và font của theme;
  • robots.txt;
  • sitemap;
  • trang 404;
  • title, description và canonical;
  • toàn bộ URL hiện có.

Danh sách URL rất quan trọng. Có thể lấy chúng từ sitemap của website cũ để sau này đối chiếu với bản chạy trên Cloudflare.

Bước 2: Backup WordPress và VPS

Trước khi thay đổi bất cứ thứ gì, mình sao lưu:

  • database WordPress;
  • thư mục wp-content;
  • cấu hình Nginx hoặc Apache;
  • cấu hình DNS hiện tại;
  • một bản backup đầy đủ của VPS nếu có thể.

Ở giai đoạn này chưa tắt và cũng chưa hủy VPS. Website cũ vẫn phải chạy cho tới khi bản mới được kiểm tra xong.

Bước 3: Dọn website trước khi export

Bản static sẽ chụp lại những gì website đang hiển thị. Vì vậy mình hoàn thiện website WordPress trước:

  • sửa các link đang lỗi;
  • xóa plugin hoặc widget không còn dùng;
  • kiểm tra menu, category và tag;
  • tối ưu hình ảnh quá lớn;
  • kiểm tra giao diện mobile;
  • xóa cache để tránh export nhầm nội dung cũ;
  • tắt hoặc thay thế những form cần PHP xử lý.

Làm sạch từ đầu sẽ đỡ phải sửa hàng loạt file HTML sau khi export.

Bước 4: Cài Simply Static

Trong WordPress, vào Plugins → Add New Plugin, tìm Simply Static, cài đặt và kích hoạt.

Simply Static sẽ crawl website giống như một trình duyệt, tải các trang và tài nguyên rồi tạo ra một phiên bản gồm:

HTML
CSS
JavaScript
Images
Fonts

Đây là bộ source sẽ thay thế WordPress trên website public.

Bước 5: Cấu hình URL đích

Vào Simply Static → General, tìm phần Replacing URLs.

Nếu website sau khi chuyển vẫn chạy trên domain cũ, chọn Absolute URLs và nhập domain production, ví dụ:

https://adtek.io.vn

Có thể bật Force URL replacements để plugin thay các URL WordPress nằm trong HTML, CSS và JavaScript.

Mục tiêu là sau khi export, source không còn trỏ đến IP VPS, hostname nội bộ hoặc domain tạm của WordPress.

Bước 6: Bật Enhanced Crawl

Trong Simply Static, bật Enable Enhanced Crawl để plugin tìm đầy đủ hơn các thành phần của website:

  • homepage;
  • post và page;
  • category và tag;
  • pagination;
  • sitemap;
  • theme assets;
  • plugin assets;
  • uploads;
  • wp-includes.

Nếu website có trang không xuất hiện trong menu hoặc sitemap, cần bổ sung URL đó vào danh sách crawl để tránh bị bỏ sót.

Bước 7: Export toàn bộ website

Chọn Full Site rồi bắt đầu export. Tùy dung lượng website, quá trình crawl có thể mất một lúc.

Sau khi hoàn thành, tải file ZIP và giải nén. Cấu trúc thường tương tự:

website-static/
├── index.html
├── wp-content/
├── wp-includes/
├── category/
├── tag/
├── ten-bai-viet/
│   └── index.html
├── sitemap.xml
└── robots.txt

File index.html của trang chủ phải nằm ở root. Mỗi bài viết thường là một thư mục chứa index.html, nhờ vậy URL có thể giữ dạng /ten-bai-viet/ như trên WordPress.

Bước 8: Chạy thử bản static trước khi đưa lên mạng

Không nên chỉ bấm trực tiếp vào index.html, vì cách đó có thể che giấu lỗi đường dẫn. Mình chạy một web server local ngay trong thư mục đã giải nén, ví dụ:

npx serve .

Sau đó kiểm tra:

  • trang chủ;
  • vài bài viết cũ và mới;
  • category, tag và phân trang;
  • menu và internal link;
  • hình ảnh, CSS, JavaScript và font;
  • giao diện desktop và mobile;
  • robots.txt và sitemap;
  • Developer Tools xem có request 404 hay không.

Mình cũng tìm trong toàn bộ source xem còn URL của VPS hoặc hostname WordPress cũ hay không. Nếu còn, cần sửa trước khi deploy.

Bước 9: Đưa source static lên GitHub

Tạo một repository mới trên GitHub. Repository có thể để private.

Mở terminal tại đúng thư mục có index.html, sau đó chạy:

git init
git add .
git commit -m "Initial static WordPress migration"
git branch -M main
git remote add origin https://github.com/USERNAME/REPOSITORY.git
git push -u origin main

Repository này chỉ chứa website static. Không đưa database dump, mật khẩu, token, file .env hoặc backup VPS lên GitHub.

Bước 10: Tạo project Cloudflare Pages

Vào Cloudflare Dashboard, chọn Workers & Pages → Create → Pages → Connect to Git. Kết nối GitHub rồi chọn repository vừa tạo.

Vì source đã là HTML hoàn chỉnh nên không cần framework và không cần bước build:

Production branch: main
Framework preset: None
Build command: exit 0
Build output directory: .
Root directory: để trống

Cloudflare Pages sẽ publish website lên một địa chỉ dạng:

https://ten-project.pages.dev

Đây là nhà mới, nhưng lúc này domain chính vẫn chưa chuyển sang đó.

Bước 11: Kiểm tra bản pages.dev

Mình lặp lại toàn bộ checklist trên địa chỉ pages.dev, đồng thời đối chiếu các URL lấy từ sitemap cũ.

Với mỗi URL quan trọng, kết quả mong muốn là:

Trang chủ       → 200
Bài viết        → 200
Category / tag  → 200
Ảnh và CSS      → 200
URL không có    → 404 đúng giao diện

Nếu đổi đường dẫn, cần tạo redirect 301 bằng file _redirects. Tuy nhiên trong một cuộc chuyển nhà, giữ nguyên URL cũ vẫn là phương án ít rủi ro nhất.

Bước 12: Gắn domain thật vào Cloudflare Pages

Khi bản pages.dev đã ổn, vào Cloudflare Pages → Project → Custom domains → Set up a custom domain rồi nhập domain thật.

Nếu DNS của domain đã được quản lý trên Cloudflare, Cloudflare sẽ hướng dẫn hoặc tự tạo record cần thiết. Sau khi DNS cập nhật, domain cũ sẽ đưa người dùng sang website static mới.

Tiếp tục kiểm tra:

  • HTTPS và certificate;
  • canonical có đúng domain thật;
  • sitemap không chứa domain pages.dev;
  • robots.txt không chặn bot;
  • ảnh và asset không gọi về VPS cũ;
  • các URL từ sitemap cũ vẫn trả về 200.

Bước 13: Tắt thử WordPress cũ

Đây là bước xác nhận quan trọng nhất.

Sau khi DNS đã trỏ sang Cloudflare Pages, mình tắt WordPress hoặc dừng VPS cũ nhưng chưa hủy ngay. Sau đó mở website bằng mạng khác hoặc cửa sổ riêng để kiểm tra lại.

Nếu website vẫn hoạt động đầy đủ khi VPS đã tắt, điều đó chứng minh traffic không còn phụ thuộc vào PHP và database cũ.

Nếu một hình ảnh, CSS hoặc trang nào đó mất khi tắt VPS, source static vẫn còn tham chiếu về máy cũ. Cần bật lại VPS, bổ sung tài nguyên bị thiếu, deploy lại và kiểm tra lần nữa.

Bước 14: Hủy VPS

Khi website đã chạy ổn định mà không cần máy cũ, mình thực hiện lần cuối:

  1. tạo backup cuối cùng của database và wp-content;
  2. tải backup ra khỏi VPS và lưu ở nơi an toàn;
  3. xác nhận VPS không chạy chung dịch vụ nào khác;
  4. xác nhận DNS không còn record trỏ về IP cũ;
  5. hủy VPS.

Đến đây cuộc chuyển nhà mới thực sự hoàn tất:

WordPress: đã tắt
PHP: đã tắt
Database: đã tắt
VPS: đã hủy
Website public: Cloudflare Pages

Sau khi bỏ WordPress thì cập nhật nội dung thế nào?

Đây là đánh đổi cần hiểu trước khi chuyển: sau khi hủy VPS, mình không còn đăng nhập wp-admin để viết bài.

Nếu website gần như đã hoàn thiện và ít cập nhật, có thể sửa trực tiếp các file HTML rồi push lại lên GitHub. Nhưng nếu vẫn muốn viết blog thường xuyên bằng một quy trình gọn gàng, mình gợi ý chuyển website sang Astro: bài viết được lưu bằng Markdown, source được quản lý bằng Git và Cloudflare Pages tự build lại website sau mỗi lần push.

Cách chuyển từ bản WordPress static sang Astro, tổ chức bài viết và thiết lập quy trình đăng bài sẽ được mình trình bày trong bài tiếp theo. Bài này chỉ tập trung vào việc mang nguyên website WordPress hiện có sang Cloudflare Pages và bỏ hẳn VPS.

Chi phí sau khi chuyển

Khoản tiết kiệm rõ nhất là tiền thuê VPS cho WordPress. Mình cũng không còn phải duy trì hệ điều hành, web server, PHP và database.

Cloudflare Pages có gói miễn phí với các giới hạn sử dụng riêng. Website static nhỏ thường có thể hoạt động trong gói này, nhưng nên kiểm tra giới hạn Cloudflare Pages tại thời điểm triển khai.

Domain vẫn là chi phí riêng. Nếu website cần form, search hoặc dịch vụ bên ngoài thì các phần đó cũng có thể phát sinh chi phí.

Kết luận

Điểm quan trọng của giải pháp này không phải là đặt một lớp Cloudflare trước WordPress, cũng không phải giữ WordPress chạy ngầm để export định kỳ.

Đây là một cuộc chuyển nhà hoàn chỉnh:

Website WordPress đang chạy trên VPS

Simply Static chụp lại toàn bộ website

Kiểm tra HTML, URL và tài nguyên

GitHub lưu source static

Cloudflare Pages phục vụ website

Chuyển domain

Tắt WordPress và hủy VPS

Với một blog hoặc website nội dung không cần backend động, kết quả là website vẫn truy cập bằng domain và URL cũ, nhưng phía sau không còn WordPress, PHP, database hay một VPS phải chăm sóc mỗi ngày.