1

I have a recipe site and have submitted sitemaps for it with images, here is an example of a single recipe:

<url>
<loc>https://www.hungrydemocracy.com/shalima-tp/pothu-varattiyadh-kerala-beef-curry</loc>
<image:image>
<image:loc>https://firebasestorage.googleapis.com/v0/b/hungrydemocracy-prod.appspot.com/o/pothu-varattiyadh-kerala-beef-curry%2Fshalima-tp%2F331482A5-BD29-4DCC-8289-AA2C0C4C8972.jpeg?alt=media&token=51f3e4a6-8a8a-425f-b887-065faf874399</image:loc>
</image:image>
<image:image>
<image:loc>https://firebasestorage.googleapis.com/v0/b/hungrydemocracy-prod.appspot.com/o/pothu-varattiyadh-kerala-beef-curry%2Fshalima-tp%2F530A01DE-8767-4729-B9AB-C8A87DB8A097.jpeg?alt=media&token=21d9ecbf-4ff6-4186-9d6e-09f6b91befd1</image:loc>
</image:image>
<lastmod>2023-01-04</lastmod>
<changefreq>weekly</changefreq>
<priority>1.0</priority>
</url>

Google does crawl my site and does not show any crawl/sitemaps errors. But when you search for the keyword "pothu curry" on google, my site comes up on the first page without an image.

enter image description here

I had a bug earlier where the images on my site were not public, which I fixed a month ago. I started submitting images as part of the sitemaps after.

I also have JSON-LD setup for the site and the markup shows up correct. Here is the markup:

"image": {
        "@type": "ImageObject",
        "url": "https://firebasestorage.googleapis.com/v0/b/hungrydemocracy-prod.appspot.com/o/pothu-varattiyadh-kerala-beef-curry%2Fshalima-tp%2F331482A5-BD29-4DCC-8289-AA2C0C4C8972.jpeg?alt=media"
    },

Do you see anything wrong with the way images are rendered on the page?

3
  • Once Google finds an error, it seems to take forever to recover. I find that I have to request it to index those pages Jan 17, 2023 at 2:04
  • Can you host the images on your site instead of firebasestorage? That might be contributing to the difficulties? Jan 18, 2023 at 4:12
  • I use firebase as my backend and thats where all images are uploaded. Unfortunately I don't think you can change the domain name for where the images are stored :(
    – sharath
    Jan 21, 2023 at 1:43

1 Answer 1

3

I was unable to verify that you are using a pagemap in your sitemap. But I may not have guessed the sitemap you are using. I guessed sitemap.xml?

There is a "programmable search engine help" for search thumbnails from google at https://support.google.com/programmable-search/answer/1626955?hl=en&ref_topic=2642610

I was unable to find this in the webmaster SEO guides Google provides, but the programmable search engine is the same data as the web search engine ... although the programmable search engine can be used as a site or multi-site search; I find it useful for analyzing search results. It removes the local and perhaps other bias.

Although they don't show an example of a thumbnail in the pagemap within the sitemap. They show a pagemap for the thumbnail and a separate sitemap with a pagemap for other pagemap values ... But it should be something like when combined.

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
       xmlns:content="http://www.google.com/schemas/sitemap-content/1.0">
 <url>
   <loc>http://www.example.com/foo</loc>
   <PageMap xmlns="http://www.google.com/schemas/sitemap-pagemap/1.0">
    <DataObject type="thumbnail">
      <Attribute name="src" value="http://www.example.com/recipes/applepie/applepie.jpg"/>
      <Attribute name="width" value="100"/>
      <Attribute name="height" value="130"/>
    </DataObject>
  </PageMap>
...

They do show an easier method.

<meta name="thumbnail" content="http://example/foo.jpg" />

I like easy. Unless I have a CMS which is building the sitemap with pagemaps inside for me. But then using the CMS is easier so I still like easy.

Image Search vs web search.

It looks like the code in your question is from or based on ... https://developers.google.com/search/docs/crawling-indexing/sitemaps/image-sitemaps

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
  <url>
    <loc>https://example.com/sample1.html</loc>
    <image:image>
      <image:loc>https://example.com/image.jpg</image:loc>
    </image:image>
    <image:image>
      <image:loc>https://example.com/photo.jpg</image:loc>
    </image:image>
  </url>

This gets images into image search. But does not it-self create a thumbnail for the page on web search, (the example you are showing), Although I don't yet see the image in question on https://images.google.com/ searching for "site:example.com" But google may not have yet determined it can index your images from the prior issue you fixed.

script type="application/ld+json" class="yoast-schema-graph"

One of those sites in your image is using ...

"thumbnailUrl":"https://www.example.com/wp-content/uploads/2014/07/3-Ummas-pothu-curry.jpg"

... to add the thumbnail. Looks like a WordPress plugin, if that helps you out.

1
  • Thank you for such a detailed answer. Learnt a lot !!
    – sharath
    Jan 21, 2023 at 1:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.