Migrasi WordPress ke Static Website

Oleh Sugeng 5 Sep 2026

WordPress adalah CMS paling populer di dunia, tetapi juga merupakan salah satu platform yang paling berat dan rentan terhadap serangan. Migrasi dari WordPress ke website statis menawarkan kecepatan, keamanan, dan biaya yang jauh lebih baik. Artikel ini membahas cara memigrasi WordPress ke static website secara lengkap.

Pengertian Migrasi WordPress ke Static Website

Migrasi WordPress ke static website adalah proses mengubah konten yang sebelumnya dikelola oleh WordPress (PHP + MySQL) menjadi file HTML/CSS/JS statis yang berjalan tanpa server backend. Website statis menghasilkan file HTML di build time, bukan di request time.

Mengapa Migrasi ke Static Website?

  • Kecepatan: Website statis 10-100x lebih cepat dari WordPress
  • Keamanan: Tidak ada database, PHP, atau admin panel yang bisa dieksploitasi
  • Biaya: Tidak perlu server database atau hosting mahal
  • Skalabilitas: Static website bisa menangani traffic berapa pun tanpa load balancing
  • Performance: CDN statis didistribusikan ke seluruh dunia
  • Maintenance: Tidak perlu update WordPress, plugin, atau security patches

Alat yang Dibutuhkan

  • Akses ke WordPress yang akan dimigrasi
  • Node.js terinstal
  • Static site generator (SSG)
  • Tidak perlu server atau database

Pilihan Static Site Generator

1. Next.js (Recommended)

Framework React yang mendukung Static Site Generation (SSG):

bash
npx create-next-app@latest my-portfolio

2. Astro

Astro sangat ideal untuk konten-heavy website:

bash
npm create astro@latest

3. Hugo

Generator tercepat, ditulis dalam Go:

bash
# Install Hugo
apt install hugo

# Buat project baru
hugo new site my-portfolio

4. Eleventy (11ty)

JavaScript-based static generator:

bash
npm init eleventy@latest

Langkah-Langkah Migrasi

1. Export Konten WordPress

bash
# Export semua konten dari WordPress
# Dashboard WordPress → Tools → Export
# Hasilnya file XML

Atau gunakan WP-CLI:

bash
wp export --dir=/tmp/wordpress-export

2. Konversi Konten ke Markdown

Gunakan wordpress-export-to-markdown:

bash
# Install tool
npm install -g wordpress-export-to-markdown

# Konversi XML ke Markdown
wordpress-export-to-markdown \
  --input-file /tmp/wordpress-export.xml \
  --output-folder ./content \
  --wordpress-url https://masyarakat.id

3. Buat Struktur Static Website

kode
my-portfolio/
├── content/
│   ├── blog/
│   │   ├── artikel-1.md
│   │   ├── artikel-2.md
│   │   └── artikel-3.md
│   ├── about.md
│   └── contact.md
├── src/
│   ├── components/
│   ├── layouts/
│   └── styles/
├── public/
│   ├── images/
│   ├── m.png
│   └── og.png
├── package.json
└── next.config.js

4. Konfigurasi Markdown ke HTML

javascript
// next.config.js (Next.js)
const withMarkdown = require('@next/third-party/markdown');

/** @type {import('next').NextConfig} */
const nextConfig = {
  pageExtensions: ['js', 'jsx', 'ts', 'tsx', 'md', 'mdx'],
};

module.exports = withMarkdown(nextConfig);

5. Buat Halaman dari Konten

tsx
// src/pages/articles/[slug].tsx
export async function getStaticPaths() {
  const posts = getAllPosts(); // Baca dari Markdown files
  return {
    paths: posts.map(post => ({ params: { slug: post.slug } })),
    fallback: false,
  };
}

export async function getStaticProps({ params }) {
  const post = getPostBySlug(params.slug);
  return { props: { post } };
}

export default function Article({ post }) {
  return (
    <article className="fade-in">
      <h1>{post.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: post.content }} />
    </article>
  );
}

6. Pertahankan URL Lama (Redirect)

Agar SEO tidak hilang, redirect URL WordPress ke URL baru:

javascript
// next.config.js
module.exports = {
  async redirects() {
    return [
      {
        source: '/:path*',
        has: [{ type: 'host', value: 'masyarakat.id' }],
        destination: 'https://masyarakat.id/:path*',
        permanent: true,
      },
      // Redirect lama ke baru
      {
        source: '/2024/01/:slug',
        destination: '/articles/:slug',
        permanent: true, // 308 redirect
      },
    ];
  },
};

Konfigurasi SEO untuk Migrasi

1. Pertahankan Meta Tags

tsx
// Setiap halaman artikel
export async function generateMetadata({ params }) {
  const post = getPostBySlug(params.slug);
  return {
    title: post.title,
    description: post.excerpt,
    openGraph: {
      title: post.title,
      description: post.excerpt,
      images: ['/og.png'],
    },
  };
}

2. Redirect 301 untuk URL Lama

javascript
// Redirect semua URL lama WordPress
const oldUrls = [
  '/2024/01/judul-artikel/',
  '/?p=123',
  '/category/teknologi/',
];

// Buat redirect di Vercel
// vercel.json
{
  "rewrites": [
    { "source": "/2024/(.*)", "destination": "/articles/:splat" }
  ],
  "redirects": [
    { "source": "/:path*", "destination": "https://masyarakat.id/:path*", "permanent": true }
  ]
}

3. Sitemap Baru

javascript
// app/sitemap.ts
export default async function sitemap() {
  const posts = await getAllPosts();
  const baseUrl = 'https://masyarakat.id';
  
  return [
    { url: baseUrl, lastModified: new Date() },
    ...posts.map(post => ({
      url: `${baseUrl}/articles/${post.slug}`,
      lastModified: new Date(post.date),
      changeFrequency: 'weekly' as const,
    })),
  ];
}

Backup dan Rollback

1. Backup WordPress Sebelum Migrasi

bash
# Backup database
mysqldump -u root -p wordpress_db > wordpress_backup.sql

# Backup file WordPress
tar -czf wordpress-files-backup.tar.gz /var/www/html/

2. Jaga WordPress Aktif Sebagai Redirect

bash
# Jangan hapus WordPress langsung
# Biarkan WordPress jalan dengan redirect ke static website

3. Rollback Plan

bash
# Jika ada masalah, aktifkan kembali WordPress
systemctl start apache2
# Atau restore dari backup

Verifikasi Migrasi

1. Cek Semua Halaman Berfungsi

bash
# Crawl website untuk cek broken links
npx @vercel/analytics
npx serve -s dist
curl -s http://localhost:3000 | grep -c "404"

2. Cek Redirect Berfungsi

bash
# Test redirect lama ke baru
curl -I https://masyarakat.id/2024/01/judul-artikel/
# Harusnya return 308 → new URL

3. Cek SEO

bash
# Verifikasi Google Search Console
# Submit sitemap baru
# Cek semua halaman terindex

Kesimpulan

Migrasi WordPress ke static website memberikan peningkatan kecepatan, keamanan, dan biaya yang signifikan. Dengan tools modern seperti Next.js atau Astro, konten WordPress dapat dikonversi ke format Markdown dan di-generate menjadi website statis yang cepat dan aman.

Kunci utama:

  • Backup WordPress sebelum migrasi
  • Gunakan redirect 301 untuk mempertahankan SEO
  • Konversi konten ke Markdown dengan tool otomatis
  • Jaga WordPress sebagai redirect sampai migrasi selesai
  • Verifikasi semua URL dan redirect berfungsi
  • Submit sitemap baru ke Google Search Console
  • Pertahankan semua meta tag dan OG image
Catatan penting: Jangan pernah menghapus WordPress secara langsung sebelum memastikan semua konten sudah berhasil dimigrasi dan semua URL redirect sudah berfungsi. Backup database dan file WordPress sebelum memulai proses migrasi. Selalu pertahankan URL lama yang berfungsi sebagai redirect ke URL baru agar peringkat pencarian dan traffic tidak hilang. Proses migrasi sebaiknya dilakukan secara bertahap — mulai dari beberapa halaman, verifikasi, lalu luncurkan secara penuh.
Ingat: Migrasi WordPress ke static website bukan berarti konten Anda hilang — ini adalah peningkatan dari sistem yang berat ke sistem yang ringan dan efisien. Konten Anda tetap sama, hanya cara penyajiannya yang berubah. Website statis tidak kehilangan SEO, justru mendapatkannya karena kecepatan dan performance yang lebih baik.
Dipublikasikan untuk membantu para administrator WordPress dalam bermigrasi ke website statis yang lebih cepat dan aman.

Artikel Terkait