[Fixed] Why Does Yoast Not Generate A Sitemap – Sitemap_index.xml 404

So I have been struggling to fix a problem with my sitemap. It was working properly before, until I moved the server.

The problem is I didn’t know up until this morning. I moved my site to the new server two weeks ago.

And Google noticed that too:

sitemap-404 error

That doesn’t look good, does it?

So I, like you guys right now, search the web for a solution. I was running Rankmath. I tried to change to Yoast SEO and other sitemap plugins but still the 404 error persisted.

By the way, my site is on an Nginx server.

Yoast SEO  has a post here showing the solution or half of the solution. They provided the code below but didn’t tell where to put the code:

location ~ ([^/]*)sitemap(.*).x(m|s)l$ {
  ## this rewrites sitemap.xml to /sitemap_index.xml
  rewrite ^/sitemap.xml$ /sitemap_index.xml permanent;
  ## this makes the XML sitemaps work
  rewrite ^/([a-z]+)?-?sitemap.xsl$ /index.php?xsl=$1 last;
  rewrite ^/sitemap_index.xml$ /index.php?sitemap=1 last;
  rewrite ^/([^/]+?)-sitemap([0-9]+)?.xml$ /index.php?sitemap=$1&sitemap_n=$2 last;
  ## The following lines are optional for the premium extensions
  ## News SEO
  rewrite ^/news-sitemap.xml$ /index.php?sitemap=wpseo_news last;
  ## Local SEO
  rewrite ^/locations.kml$ /index.php?sitemap=wpseo_local_kml last;
  rewrite ^/geo-sitemap.xml$ /index.php?sitemap=wpseo_local last;
  ## Video SEO
  rewrite ^/video-sitemap.xsl$ /index.php?xsl=video last;
}

I put it in the server block, didn’t work.

Then I tried to put this inside the location / block inside the server block and the problem was solved.

nginx configuration to fix sitemap 404 error

Remember to put the configuration block inside location /

And that’s all the fix needed to make your sitemap.xml working again.

 

How To Add Custom CSS/Javascript In Elementor Free Version

If you are using the free version of Elementor, you’ll notice that adding custom css to the page isn’t supported. Elementor says that it’s a feature of the pro version.

custom css in elementor free version
custom css in elementor free version

What can you do? Are you going to upgrade? Well, if you can, I recommend you to do so. It’s worth the price.

However, if you just need to add some CSS and not quite ready to upgrade yet, let me show you a walk around.

Adding custom CSS in Elementor free version

Now, let’s find the HTML element and drag it into your page:

Now, you’ll see the HTML on your page look like this:

It doesn’t look very attractive. However, you don’t need to worry about that. It will not show up on your final page (the page that your visitors see).

Now, let’s hover your cursor over the HTML element, you will see the edit icon appears:

Then, you’ll see the HTML box appears on the left of your screen:

While it says HTML code, there is nothing prevent us to enter CSS code 😉

Let’s enter some CSS code:

<style>
body p {
    color: red;
}
    
</style>

And you’ll see, my page has red text:

Now, update your page and see the changes.

Conclusion

Some of you may say that, putting style tag inside the body is not recommended. Well, that’s a thing of the past. HTML5 is finally allow the style tag in the body. If you don’t mind reading length specification page, here you go.

You don’t limit to put just css in the HTML box. You can put HTML (of course) and also javascript code. This enable some very interesting feature that you cannot do with the default elements provided by Elementor.