Skip to main content

Customize your site preview in Google Search results with new snippet settings

There are now more tools for websites to customize your webpage preview in the Google Search Results.

When a page from your blog or website appears in the Google Search results, it will show a title and snippet. The snippet is a brief description that shows how the result relates to the search query. Google creates the snippet automatically from the web page content, including your site text; structured data for content like reviews, recipes, events; and meta description tags.

Google Search result for "verification" with snippet

Previously you could only indicate that there should be no snippet for a webpage. Now you can add code that helps specify what content to use in the snippet.

Learn more and get instructions for implementing these on your Blogger blog:.
A word of caution: only make changes if you are sure you understand the consequences. Some changes could negatively affect the way your site appears in the Google Search results.

Note: To comply with new copyright law, in late October Google will no longer show preview content in France for European news publications unless they indicate they want a preview displayed. They can use the new settings to do that. Learn more.

Use the data-nosnippet HTML attribute to exclude text from snippets

You can add the data-nosnippet HTML attribute on span, div, and section elements to exclude text  from appearing in snippets in the Google Search results.

For example:

<p><span data-nosnippet>I do not want this text to be included in snippets.</span> This text may be included in a snippet.</p> 

To add this to text in a Blogger blog post, switch to Compose mode at the top left of the post editor to edit your post HTML.

See more examples in the developer documentation.

Note: this will not affect your snippets in search results until later this year.

Control Google Search snippets with a robots meta tag

You can add a robots meta tag with snippet specifications for text length, video preview duration or image preview size. This must be between inside web page's head section (between <head> and </head>).

<meta name="robots" content="max-snippet:100, max-video-preview:10, max-image-preview:standard">

Replace the red text with your desired settings from the options below:

"nosnippet" No snippet shown for the page.

"max-snippet:[number]" Maximum number of characters for the snippet. Replace [number] with the number of characters.

"max-video-preview:[number]" Maximum length of the animated video preview in seconds. Replace [number] with the number of seconds.

"max-image-preview:[setting]" Maximum size of the image preview. Replace [setting] with none, standard, or large.

You can use one or more of the settings, separated with commas, as shown in the example.

If you have a Blogger blog, you can enable the nosnippet tag in your blog's settings.


1. Sign in to Blogger and select your blog

2. Click Settings on the left menu

3. Next to Custom robots header tags click Edit

4. Next to Enable custom robots header tags? click Yes

5. Select nosnippet for your Home page, Archive and search pages, and/or Posts and pages
    Caution: be careful that you don't include tags that might prevent your site from appearing in the search results.

6. Save changes

Currently the only way to add the new tags to your Blogger blog is by editing the HTML of your blog theme. Be sure to save a copy of your theme before you make any changes!

More information


Comments

Post a Comment

Spam and personal attacks are not allowed. Any comment may be removed at my own discretion ~ Peggy