Categories
URL / Rewrite Filter

How to make Gutenberg block editor work, when WordPress Address & Site Address are different domains

Recently, I worked on a project where the WordPress site needed to have one domain for Site Address(SITE URL) and another one for WordPress Address(HOME URL). Everything was working fine. Except, whenever we tried to publish a post in Gutenberg editor, we were getting an error saying “Updating failed. “. This is also the case when you are using WordPress as headless CMS.

Soon, I realized that as we were accessing the site admin section from the Site Address, and when we were hitting the update or publish button on Gutenberg editor, it was sending a request to the REST API with WordPress Address(HOME URL) as it’s base URL. The REST API URL should be the same domain from which the request is being sent. So, we just have to make WordPress Gutenberg editor use the Site Address (SITE URL) instead of WordPress Address(HOME URL) as a base for API.

Here is the snippet code is given below, which uses ‘rest_url‘ filter to replace the HOME URL in REST API URL to SITE URL.

// change WordPress API URL to HOME URL
add_filter('rest_url', 'wptips_home_url_as_api_url');
function wptips_home_url_as_api_url($url) {
    $url = str_replace(home_url(),site_url() , $url);
    return $url;
}

Please let me know in the comment section below if you ever had to work on a project where you had to assign different domains to Site Address and WordPress Address.

By Murali Kumar

I am a Full Stack Web Developer with over 12 years of experience. I love WordPress & WooCommerce.

If you need help of a WordPress developer for your website, get in touch now!.

Follow me on Twitter : @geekz

Leave a Reply

Your email address will not be published. Required fields are marked *