Please note that the official procedure is as follows.

• Uploading assets performantly

In principle, following the steps on this page should suffice, but in this article we shall introduce the procedure with a slight modification to the prerequisites.

Get media data

WordPress provides a REST API that enables retrieval of media-related data. For instance, accessing https://public-api.wordpress.com/wp/v2/sites/{site}.wordpress.com/media
allows retrieval of a list of media items. However, when attempting to verify the target data using Postman, the following error is displayed:

On the other hand, it is possible to export data concerning media managed within WordPress in XML format. By navigating to the 'Tools' → 'Export' screen within the WordPress admin panel and selecting 'Media', you can retrieve media-related data in XML file format.

By utilising the following items within the format of the output XML data, you can retrieve the original image.

This time, we shall customise it to enable its use. Note that if data can be retrieved normally via the API, the official procedure alone will suffice.

Addition of media-related scripts

First, add ./migrations/import-wp/lib/wpImageFetch.ts as a script to retrieve media data from WordPress when such data exists within articles or similar content. For BASE_URL, the same value used when fetching article data is employed.

Add the file ./migrations/import-wp/lib/sanityUploadFromUrl.ts as the code for uploading the acquired data to Sanity.

To enable image referencing, add the file ./migrations/import-wp-lib/sanityIdToImageReference.ts as a reference.

Create a script for uploading images. Use the previously created ID to upload to Sanity. At this stage, check whether any images have been uploaded previously. Add the file ./migrations/import-wp/lib/sanityFetchImages.ts.

Finally, add the above process to the file `./migrations/import-wp/index.ts`. The key points are as follows:

• const limit = pLimit(5) to control the number of parallel processes
• We will check whether the image has already been uploaded.
• To control parallel processing, change from using a for loop to utilising limit(async).

The modified code is as follows.

If the API is available, executing the following command will upload the image to Sanity, where it can be viewed in the admin interface.

This concludes the procedure for retrieving and uploading images using the WordPress API.

Import using XML

In the environment currently in use, it is not possible to retrieve images using the WordPress API; therefore, the following additional steps are required.

Preparing XML files

Add the files downloaded beforehand from WordPress to migrations/import-wp/lib/WordPress.assets.xml. This XML file will be used to retrieve and upload the original images.

Add upload procedure

In the actual code, we add packages to utilise XML data on Node.js.

Next, add the script for fetching data from files: migrations/import-wp/lib/wpImageFetchXML.ts.

Next, we will modify the processing in `migrations/import-wp/lib/transformToPost.ts` when uploading images. There are two changes.

Reference: https://github.com/haramizu/sanity-wordpress/commit/e8b0bc1ec273a53c6fb012de4529ed2d84c806b6

Upload

Execute the following command to upload the image assets used in the post.

Upon successful completion of the process, thumbnail images for Studio articles, along with the images specified within the articles, are now uploaded and referenced as follows.

Summary

This time, whilst referencing the official site's procedure, I have compiled steps to obtain the URL for an asset from the XML containing its information, rather than via the API, and then upload it. The code up to this point is published below.

• https://github.com/haramizu/sanity-wordpress/tree/step-4

In the next step, we shall proceed with handling the rich text area.