What are the main steps to migrate content from WordPress to Hygraph?
The migration process from WordPress to Hygraph involves several key steps:
1. Content Audit: Assess your existing WordPress content to determine what needs to be migrated, archived, or updated.
2. Content Mapping: Map your WordPress data structure (e.g., Posts, Authors) to Hygraph models and fields.
3. Content Export: Export your WordPress data using a plugin (such as 'WordPress data to XML/CSV') to obtain CSV files for posts, authors, and assets.
4. Project Setup: Create a new project in Hygraph, configure permissions, and set up your schema (models and fields) using the UI or Management SDK.
5. Content Import: Use scripts or the Hygraph UI to import your CSV data into the corresponding models. Assets can be uploaded via GraphQL mutations.
6. Verification: Check your Hygraph console to ensure all content and assets have been imported correctly.
For a detailed walkthrough, see the official migration guide.
How can I export my WordPress content for migration?
To export your WordPress content, install the WordPress data to XML/CSV plugin. This allows you to export posts, authors, and assets as CSV files, which can then be mapped and imported into Hygraph. If you use the default WordPress export, you'll get XML files, so the plugin is recommended for CSV output. Sample CSV files are provided in the migration guide.
What is the typical timeframe for migrating from WordPress to Hygraph?
The migration timeframe can vary based on project complexity. For example, the Voi team migrated from WordPress to Hygraph in 1-2 months, including building the new website structure and migrating content. (Source: Voi Case Study)
How does Hygraph handle content migration from WordPress?
Hygraph supports content migration from WordPress using GraphQL mutations. You can create mutations for posts and authors, run scripts to upload your data, and verify the results in the Hygraph console. The process is documented in the migration guide.
Why should I consider migrating from WordPress to Hygraph?
WordPress can present challenges such as slow site performance, security concerns, and limited customization, especially as projects grow and accumulate plugins or custom code. Hygraph offers a more flexible, scalable, and secure alternative with advanced GraphQL capabilities and a modern headless CMS architecture. (Source: WordPress Alternatives)
What was the migration experience like for Voi when moving from WordPress to Hygraph?
The Voi team completed their migration from WordPress to Hygraph in one to two months. They independently built the new website structure, powered it through their backend, and then migrated content into Hygraph. The API migration was straightforward, and both blog posts and static pages were moved smoothly. (Source: Voi Case Study)
Features & Capabilities
What makes Hygraph a strong alternative to WordPress?
Hygraph is well-suited for both simple and complex projects, especially those involving advanced content interactions and user-generated content. Its GraphQL-native architecture and flexible content modeling provide more power and flexibility than WordPress, which relies on REST APIs and plugins for advanced features. (Source: Hygraph vs WordPress)
How does Hygraph optimize content delivery performance?
Hygraph delivers published content through a globally distributed edge cache, ensuring rapid content distribution and responsiveness. This improves user experience, engagement, and search engine rankings by reducing bounce rates and increasing conversions. (Source: Headless CMS Checklist)
Does Hygraph provide an API for content management?
Yes, Hygraph offers a powerful GraphQL API for efficient content fetching and management. This API enables flexible integration with various front-end frameworks and applications. (Source: Hygraph API Reference)
What integrations does Hygraph support?
Hygraph supports a wide range of integrations, including: Hosting & Deployment: Netlify, Vercel eCommerce: BigCommerce, commercetools, Shopify Localization: Lokalise, Crowdin, EasyTranslate, Smartling Digital Asset Management: Aprimo, AWS S3, Bynder, Cloudinary, Mux, Scaleflex Filerobot Personalization & AB Testing: Ninetailed Artificial Intelligence: AltText.ai Miscellaneous: Adminix, Plasmic
For a full list, visit the Hygraph Integrations page.
Is technical documentation available for Hygraph?
Yes, Hygraph provides comprehensive technical documentation covering all aspects of building and deploying projects, including migration, API usage, and integrations. Access the docs at Hygraph Documentation.
Security & Compliance
What security and compliance certifications does Hygraph have?
Hygraph is SOC 2 Type 2 compliant, ISO 27001 certified, and GDPR compliant. These certifications ensure enterprise-grade security and data protection. For more details, visit the Hygraph Security Features page.
How does Hygraph protect my data during and after migration?
Hygraph provides robust security features such as SSO integrations, audit logs, encryption at rest and in transit, and sandbox environments to protect sensitive data throughout the migration process and beyond. (Source: Hygraph Security Features)
Pricing & Plans
What is Hygraph's pricing model?
Hygraph offers a free forever Hobby plan, a Growth plan starting at $199/month, and custom Enterprise plans. For the latest details, visit the Hygraph Pricing page.
Support & Implementation
What support is available during and after migration to Hygraph?
Hygraph provides 24/7 support via chat, email, and phone. Enterprise customers receive dedicated onboarding and expert guidance. All users have access to detailed documentation, video tutorials, and a community Slack channel. (Source: Hygraph Contact Page)
How easy is it to get started with Hygraph?
Getting started with Hygraph is straightforward. You can sign up for a free-forever account, access onboarding guides, and use comprehensive documentation and tutorials. Even non-technical users can begin using Hygraph quickly. (Source: Hygraph Documentation)
Competition & Comparison
How does Hygraph compare to WordPress?
Hygraph offers a more streamlined experience than WordPress, especially for complex content interactions and user-generated content. While WordPress can suffer from plugin integration issues and clunky content editing, Hygraph provides a modern, GraphQL-native, headless CMS with flexible content modeling and advanced API capabilities. (Source: Hygraph vs WordPress)
Use Cases & Customer Success
What types of projects or companies benefit most from migrating to Hygraph?
Hygraph is ideal for modern software companies, enterprises looking to modernize their tech stack, and brands aiming to scale across geographies or re-platform from traditional CMS solutions. It supports roles such as developers, IT decision-makers, content creators, and project managers. (Source: ICPVersion2_Hailey.pdf)
Can you share a customer success story related to migration?
Yes. For example, Voi migrated from WordPress to Hygraph in 1-2 months, building a new website structure and moving content smoothly using Hygraph's API. (Source: Voi Case Study)
Technical Requirements & Resources
Where can I find more resources and guides for migrating to Hygraph?
What programming languages and tools are used in the migration process?
The migration process typically uses Node.js for scripting, along with packages such as @hygraph/management-sdk, csvtojson, graphql-request, and dotenv. These tools help automate schema creation, asset upload, and content import via GraphQL mutations. (Source: Migration Guide)
Migrating from WordPress to Hygraph: A how-to guide
We’ll walk you through the key steps in transitioning from a traditional CMS to a headless one and show you how easily you can migrate your content from WordPress to Hygraph.
Written by Malomo
on Jun 13, 2024
You are not alone if you feel that the traditional CMSs you used to rely on, such as WordPress, Joomla, and Drupal, no longer meet your needs, especially when other technologies in your stack outgrow them. This means your CMS is holding you back from modernizing your stack.
The older a WordPress project is, for example, the more likely it is to cause problems. There may be too many plugins installed, and it's unclear what can be removed, or there may be too much outdated custom code that breaks every time you change it.
However, if you’ve stayed with a traditional CMS long enough, migrating to a headless CMS can seem like a leap of faith. As you migrate, you want to ensure you are doing everything right.
That's why in this post, we’ll walk you through the key steps in transitioning from a traditional CMS like WordPress to a headless one and show you how easily you can migrate your content from WordPress to Hygraph.
For this walk-through, we will introduce you to Hygraph, a next-generation content platform that goes beyond headless CMS. It helps you power many-to-many relationships between different content sources and devices. We’ll use a WordPress news website as our traditional CMS to launch our content on Hygraph’s platform.
Editor's Note
Not sure whether to make the move to headless CMS? Check out Hygraph’s guide on why and how to select the bestheadless CMS for your needs. It will talk you through how to define your organization’s needs, address technological bottlenecks, and how a headless CMS can address your biggest challenges.
While headless CMS can help make development a breeze, migrating from a traditional CMS to a headless CMS can feel more like a challenging headwind. Thus, you’ll need a carefully planned migration strategy to make sure your content transfer is smooth sailing. You’ll need to follow a few important steps as you plan your content migration, but don’t worry, we’ll walk you through it step by step.
Start by downloading the files for our sample WordPress news website below. We’ve already exported these for you, but if you’re following along with your own WordPress site, you’ll need to install the WordPress data to XML/CSV plugin to facilitate the export.
This section shows five quick steps to migrating WordPress’s traditional CMS content to Hygraph’s headless CMS.
Step 1: Content audit
A comprehensive contentaudit will help you identify what needs to be migrated, archived, or updated. Assessing the content's volume, structure, and quality will inform the migration process on Hygraph.
To get started, you'll need to analyze the existing content on the sample news website and determine how it can be represented in Hygraph. In this case, we have a Post with associated Author(s). The Post has a Date, Title, and Author, while the Author has a Name and Location.
Step 2: Content mapping
It is important to carefully map out the data structure and relationships between elements in the existing CMS to consider how Hygraph’s features can represent them. Additionally, prioritizing the order of migration is important. For instance, in the case of our sample news website, migrating news Authors before their Posts is essential, as Posts will reference already created Authors.
With the audit in mind, you can map the audited content using Hygraph’s features. For the news website, you’ll create two models (Post and Author) with corresponding fields as shown below:
Content name
Field
Field type
date (Post model)
Single line text field
Date
title (Post model)
Single line text field
String
Name (Author model)
Single line text field
String
Location ((Author model)
Single line text field
String
Furthermore, you must create a relationship between the Post and the Author models, linking the authors to their posts. Further details on this will be provided during the implementation step.
Step 3: Content export
Having a detailed migration plan outlining the methods to use (such as Hygraph’s UI or Management SDK), roles, and permissions is crucial. This is important because non-technical users can leverage Hygraph’s intuitive UI to facilitate migration, while technical users can utilize the SDK. Additionally, Hygraph provides flexibility in setting permissions, allowing users to collaborate on content and ship it as needed.
By default, WordPress will only allow you to export your data in XML format. You'll need to install a plugin to export it as CSV or in other formats. (You can skip this step if you’re using our provided CSV files from the introduction to this guide.)
Install plugin
In the admin panel, go to Plugins > Add New Plugin. Search for WordPress data to XML/CSV and install.
Export the data
On install, you’ll see a new All Export menu; click it, select the entity you want to export, and export.
Step 4: Set up the project on Hygraph
Log into your Hygraph console and create a project. Projects and associated contents on Hygraph are secure unless you explicitly define permissions. Since you’ll be importing contents into Hygraph, you must set the required permissions. To do this, navigate to the Project settings menu, under the API Access submenu, navigate to the Permanent Auth Token, click the “+ Add token” button, input the token name, and Add & configure permissions.
Next, you must update the created token permission to enable assets and content upload. Navigate to the Content API section, click the Yes, initialize defaults button, and modify the defaults by adding more permissions to perform operations, as shown below.
Similarly, navigate to the Management API section and initialize default permissions by clicking the Yes, initialize defaults button. Additionally, modify the permissions by adding the permission options for Update existing fields, Update existing models, and Update, as these options are not included in the default permissions and are needed for the migration process.
Step 5: Migrate the content to Hygraph (implementation step)
To get started, initialize an empty Node.js project by running the command below:
npm init -y
Install the required dependency.
npm i @hygraph/management-sdk csvtojson graphql-request dotenv
@hygraph/management-sdk is a helper that is used to execute operations without the UI.
csvtojson is a package for converting CSV data to JSON.
graphql-request is a minimal GraphQL client.
dotenv is a package for loading environment variables.
Next, update the package.json file by adding "type": "module". This will allow you to use the import statement in your code.
Set up the environment variables
Create a .env file in your project directory and add the snippet below:
HYGRAPH_ENDPOINT=<REPLACEWITHCONTENTAPI>
HYGRAPH_TOKEN=<REPLACEWITHPERMANENTTOKEN>
You can get the Content API and Token from your project settings.
Add sample data
Create a data folder and add the downloaded sample data.
Create the project schema
Before you move your data, you need to set up a structure to store it in Hygraph. Think of this as creating a table with columns to store your data in a database. In Hygraph, you'll use Model and Fields to define and represent your data.
To do this, create a src/schema-creation.js and add the snippet below:
import'dotenv/config';
import{
Client,
SimpleFieldType,
RelationalFieldType,
}from'@hygraph/management-sdk';
const client =newClient({
authToken: process.env.HYGRAPH_TOKEN,
endpoint: process.env.HYGRAPH_ENDPOINT,
});
// create model for news post and authors
client.createModel({
apiId:'Post',
apiIdPlural:'Posts',
displayName:'Post',
});
client.createModel({
apiId:'Author',
apiIdPlural:'Authors',
displayName:'Author',
});
// add fields to post
client.createSimpleField({
apiId:'title',
displayName:'Title',
modelApiId:'Post',
type:SimpleFieldType.String,
});
client.createSimpleField({
apiId:'date',
displayName:'Date',
modelApiId:'Post',
type:SimpleFieldType.Date,
});
// add fields to author
client.createSimpleField({
apiId:'name',
displayName:'Name',
modelApiId:'Author',
type:SimpleFieldType.String,
});
client.createSimpleField({
apiId:'location',
displayName:'Location',
modelApiId:'Author',
type:SimpleFieldType.String,
});
// add relation to News for Author posts
client.createRelationalField({
parentApiId:'Post',
apiId:'author',
displayName:'Written By',
type:RelationalFieldType.Relation,
reverseField:{
modelApiId:'Author',
apiId:'posts',
displayName:'Posts',
isList:true,
},
});
client.run();
The snippet above does the following:
Imports the required dependencies
Creates a Post and Author models with required fields
Adds an Author relationship to the Post model and then run the migration
With that done, run the script in your terminal.
node src/schema-creation.js
You should see the created model and associated fields in your Hygraph console.
Upload assets to Hygraph
To upload your asset, create an asset-upload.js file inside the src directory and add the snippet below:
const data =awaitcsv().fromFile('src/data/news_images.csv');
for(const obj of data){
awaitprocessQueue(obj);
}
}catch(error){
console.error(error);
}
};
run();
The snippet above does the following:
Imports the required dependencies
Creates a mutation to upload assets using the URL
Creates a helper function to use a queue to upload the assets and return appropriate responses
Converts the assets' sample data to JSON, loops through it, and uploads individual items
With that done, you can run the script and check the Hygraph console to see uploaded assets.
node src/asset-upload.js
Editor's Note
Depending on the size, you may need to wait a bit for uploaded assets to appear in the console (Uploaded assets must not be larger than 100MB).
Import contents
Next, you must upload sample data for the news website posts and their author. To do this, create a content-upload.js file inside the src directory and add the snippet below:
Creates a GraphQL mutation for Post and Authors with corresponding fields
Creates a run function to get sample data, loops through the data, and uses it to create the required entity.
With that done, run the script and check Hygraph’s console for the uploaded contents.
node src/content-upload.js
And that’s it! Now, your original content has found its new home in Hygraph’s headless CMS, where you won’t have to worry about your content getting left in the wake of technological shifts and slow lags to market.
#Beyond migration: Publishing content, caching, and integration with frontend
Hygraph allows you and your team to release content instantly or schedule it for later using either the intuitive UI or the API. When contents are published, you can access them from a wide range of applications across multiple platforms.
Published contents are delivered through Hygraph's globally distributed edge cache. When users query your Hygraph-powered applications, responses are cached across multiple data centers worldwide, resulting in a faster user experience. Additionally, Hygraph offers a High-Performance Content API.
The endpoint also lets you distribute and integrate content across various front-end web and mobile frameworks and libraries. Explore this repository for integration examples; the complete source code can be found on GitHub.
Congratulations! You’ve now successfully migrated your traditional CMS content to Hygraph’s headless platform. (Or at least get some practice with the sample data we provided!) Migrating to a headless CMS is just the first step in taking your content to the next level. You can join the Slack community to stay updated on the latest developments and connect with fellow Hygraph developers. Plus, check out these guides on Migrating to Hygraph and Content modeling on Hygraph for more information.
Hygraph offers you the high-performance, futureproof severability your organization needs in the ever-evolving technological world. By migrating to Hygraph, you’re liberating your developers and unlocking your content’s greatest potential.
Download eBook: Future of Content
Insights from 400 tech leaders on CMS pain points and trends.
Demola is an experienced product designer, software developer, and technical writer who is passionate about building products and creating engaging content. Beyond his professional career, Demola loves to cook, explore new places, and watch movies.
Share with others
Sign up for our newsletter!
Be the first to know about releases and industry news and insights.