Blogs migration from wordpress to builder.io

I am currently in the process of transferring a WordPress site to builder.io using Next.js and TypeScript. While facing challenges with importing and displaying blogs, I have carefully examined the provided documentation and examples, yet I find myself at a standstill. The following resources have been referenced:

I have JSON data for the blogs from the WordPress site, it does not conform to the standard structure for builder.io.

Regrettably, none of the provided information or examples offer complete solutions on how to standardize my JSON data to meet builder standards. I am seeking comprehensive guidance on initiating the process of importing and designing blogs in builder.io from scratch.

Hi @ixmmoinuddin have you see this blog post?

It might have some helpful insights! Are there specific issues you are encountering?

Hi Tim, thank you for your response. I’ve reviewed the examples you provided, as well as others, but none seem to be effective in my case. I’m encountering several challenges:

  1. How can I format JSON data retrieved from https://example.com/wp-json/wp/v2/posts to meet Builder.io standards? I’ve examined the example data here: builder/examples/next-js-cms-blog/builder/post/first-one.json at main · BuilderIO/builder · GitHub, but the JSON data from WordPress differs significantly.

  2. After creating a model for a blog article and defining fields, I encounter a 404 error when attempting to create a new entry.

  3. I’ve added a handle field to the model, but for each new entry, I’m required to manually input the handle value. Is there a way to make this process dynamic?

  4. With over 500 posts on my WordPress website, how can I import them all at once into Builder.io and automatically have them populate the created model, displaying on both the blog listing page and individual blog articles with the defined layout?

waiting for you reply. thanks.

Hello @ixmmoinuddin,

  1. Format JSON Data:

    • Utilize the migration script to format the JSON data for WordPress blog posts. Ensure it conforms to the Builder JSON body format. Refer to our detailed guide in the migration blog post.
  2. Handle 404 error:

    • If you’re encountering issues with 404 that’s because of the handle value being null when fetching blog posts, consider implementing a fallback preview URL. You can achieve this by incorporating the following logic in the blog-post section model dynamic preview URL code:

            if (contentModel.isLive) {
                return `http://localhost:3000/blog/${content.data.handle}`;
            } else {
                return `http://localhost:3000/blog/__`;
            }
      

      Learn more about fallback preview URLs here.

  3. Fallback for handle Field:

  4. Write API Script:

    • Use the Write API to execute the migration. Create a script that reads all your blog posts from WordPress, formats them to match the Builder JSON structure, and then executes the Write API call to migrate all blog posts using a loop.

If you encounter any challenges or have further questions, feel free to reach out. We’re here to assist you throughout the migration process.