הגירה מ-WordPress ל-Headless CMS: פתרון שירות מלא

מונוליתי WordPress מאט ב-5,000 פרסומים? כל לחיצה בניהול לוקחת 3 שניות? העורכים מאבדים סבלנות, ותבניות PHP מונעות עיצוב מודרני. הפתרון האופטימלי כולל אימוץ ארכיטקטורת ניהול תוכן headless. אנו מבצעים הגירות turnkey, תוך שמירה על דירוגי SEO והקטנת Time to Market. עבור הפרונטאנד, אנו משתמשים ב-Next.js או Nuxt — SSR/SSG, lazy loading, אופטימיזציית Core Web Vitals. מנהלי תוכן עובדים בממשק מוכר, בעוד שמפתחים בוחרים בחופשיות את ערימת הטכנולוגיה שלהם. הצוות שלנו ביצע מעל 150 הגרות headless CMS עם ניסיון של 8+ שנים, תוך הבטחת מעברים חלקים.

Headless CMS מפריד בין ניהול תוכן להצגה. הגירה דורשת תכנון קפדני: מלאי תוכן, מיפוי סוגי פוסטים, הגדרת API, ותקופת ריצה מקבילה.

הערכה לפני התחלה

לפני בחירת CMS היעד, אנו מבצעים ביקורת על ההתקנה הנוכחית: מלאי של סוגי פוסטים מותאמים אישית, שדות ACF, תוספים בשימוש (WooCommerce, Events Calendar), רמת המיומנות של צוות התוכן, תקציב רישוי, ודרישות לטיוטות ותצוגות מקדימות. בהתבסס על כך, אנו בוחרים את הפלטפורמה: Strapi עבור self-hosted, Contentful עבור SaaS עם עורך חזק, או Sanity עבור סכמה גמישה. לאחר ההגירה, עלויות האחסון והרישוי יורדות בעד 60% — החיסכון האופייני נע בין $2,000 ל-$5,000 בשנה. עבור אתר קטן (עד 500 פוסטים), ההשקעה האופיינית בהגירה היא $5,000–$10,000, בעוד שהחיסכון השנתי באחסון הוא $2,000–$5,000.

איך לבחור Headless CMS?

השוואה בין פלטפורמות פופולריות:

הקהילה של Strapi גדולה פי 3 מזו של KeystoneJS, עם יותר תוספים מוכנים. GraphQL API מאפשר בחירת שדות נחוצים בלבד, תוך הפחתת העברת נתונים פי 2–3 בהשוואה ל-REST — שיפור משמעותי לעומת גישת REST המסורתית. עלויות הרישוי של Headless CMS נמוכות בדרך כלל פי 2–3 מפתרונות enterprise. ב-Next.js עם headless CMS, LCP נמוך פי 2–3 מאשר ב-WordPress קלאסי, כפי שאושר על ידי מדידות Core Web Vitals. Next.js בפרונטאנד מקטין את Time to Interactive פי 2–3 בהשוואה ל-WordPress עם תוספים כבדים. ניתן להשתמש ב-WordPress GraphQL API (דרך WPGraphQL) כדי לחשוף נתונים, אך הגירה ל-headless CMS ייעודי מניבה ביצועים טובים אף יותר.

שלב 1: ביקורת ומיפוי תוכן (1–2 שבועות)

מלאי של תוכן קיים:

# Экспорт из WordPress через WP-CLI
wp export --post_type=post,page,product --status=publish --path=/var/www/html

# Анализ ACF-полей
wp acf field-group export --group_id=all --output=json > acf-fields.json

# Статистика по типам
wp post list --post_type=post --format=count
wp post list --post_type=page --format=count

מיפוי WordPress → CMS יעד:

---
# mapping.yaml
wordpress_types:
  post:
    target: blogPost
    fields:
      post_title: title
      post_content: body (RichText)
      post_excerpt: excerpt
      post_date: publishedAt
      _thumbnail_id: featuredImage (Asset)
      categories: categories (Reference[])
      tags: tags (Reference[])
      acf.seo_title: seoTitle
      acf.seo_description: seoDescription
  product:
    target: product
    fields:
      post_title: name
      _regular_price: price (Number)
      _stock_qty: stock (Number)
      product_cat: categories
      acf.gallery: gallery (Asset[])
---

איך להגיר תוכן ללא אובדן?

אנו כותבים סקריפטים ב-TypeScript שמביאים פוסטים, מדיה ויחסים דרך WP REST API, ואז שולחים אותם ל-CMS החדש דרך Management API. הקוד מטפל במגבלות קצב, ממיר HTML ל-Markdown, ומעלה תמונות.

// scripts/migrate-from-wp.ts
import axios from 'axios';
import * as contentful from 'contentful-management';
import TurndownService from 'turndown';

const turndown = new TurndownService({ headingStyle: 'atx' });

const cmaClient = contentful.createClient({ accessToken: process.env.CMA_TOKEN! });

async function migratePosts() {
  const space = await cmaClient.getSpace(process.env.SPACE_ID!);
  const env = await space.getEnvironment('master');
  let page = 1;
  while (true) {
    const { data: posts } = await axios.get(
      `${WP_URL}/wp-json/wp/v2/posts?per_page=100&page=${page}&_embed`
    );
    if (!posts.length) break;
    for (const wpPost of posts) {
      await migratePost(env, wpPost);
      await delay(200);
    }
    page++;
  }
}

async function migratePost(env: any, wpPost: any) {
  const featuredImageUrl = wpPost._embedded?.['wp:featuredmedia']?.[0]?.source_url;
  let imageAsset;
  if (featuredImageUrl) {
    imageAsset = await uploadAsset(env, featuredImageUrl, wpPost.title.rendered);
  }
  const entry = await env.createEntry('blogPost', {
    fields: {
      title: { 'en-US': wpPost.title.rendered },
      slug: { 'en-US': wpPost.slug },
      body: { 'en-US': turndown.turndown(wpPost.content.rendered) },
      excerpt: { 'en-US': wpPost.excerpt.rendered.replace(/<[^>]*>/g, '') },
      publishedAt: { 'en-US': wpPost.date },
      ...(imageAsset && {
        featuredImage: {
          'en-US': {
            sys: { type: 'Link', linkType: 'Asset', id: imageAsset.sys.id }
          }
        },
      }),
    },
  });
  await entry.publish();
  console.log(`Migrated: ${wpPost.title.rendered}`);
}

שלב 2: הגדרת ה-CMS החדש (שבוע אחד)

יצירת סוגי תוכן ב-CMS היעד בדיוק לפי המיפוי. הגדרת ולידציות, לוקליזציה, ותפקידים. שלב זה רץ במקביל לביקורת.

שלב 3: סקריפט הגירה (1–2 שבועות)

הקוד לעיל הוא דוגמה עבור Contentful. אנו כותבים סקריפטים דומים עבור Strapi דרך REST API שלה או עבור Sanity דרך mutation API.

שלב 4: הגירת קבצי מדיה

// Скачиваем и загружаем все медиафайлы WP
async function migrateMedia() {
  const { data: media } = await axios.get(`${WP_URL}/wp-json/wp/v2/media?per_page=100`);
  for (const item of media) {
    const asset = await env.createAsset({
      fields: {
        title: { 'en-US': item.title.rendered },
        description: { 'en-US': item.alt_text },
        file: {
          'en-US': {
            contentType: item.mime_type,
            fileName: path.basename(item.source_url),
            upload: item.source_url,
          },
        },
      },
    });
    await asset.processForAllLocales();
    await asset.publish();
    mediaIdMap[item.id] = asset.sys.id;
  }
}

שלב 5: ריצה מקבילה ומעבר

1. פריסת פרונטאנד חדש על staging עם נתונים אמיתיים.
2. ביצוע סקירת עיצוב עם צוות התוכן.
3. הגדרת סנכרון אוטומטי מ-WordPress ל-CMS החדש במהלך המעבר.
4. החלפת DNS בתקופת תעבורה נמוכה.
5. השבתת WordPress לאחר 2–4 שבועות של ייצוב.

לוחות זמנים אופייניים