Google Preferred Source Button Generator: Get readers to add your site on Google

The preview uses example.com until you enter your domain.

Live preview

Enjoyed this article?

Add Example as a preferred source on Google

Google's preferred source link

https://www.google.com/preferences/source?q=example.com

Test link
Button text
Size
Icon
Style
Accent color

Copy your button code

Same button, five formats. Pick the one your site or editor accepts.

HTML
<style>
  .preferred-source-btn-light-md {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #ffffff;
    color: #1f1f1f;
    border: 1px solid #dadce0;
    border-radius: 10px;
    font-family: system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(60,64,67,0.16);
  }
  .preferred-source-btn-light-md:hover {
    background: #f6f8fc;
  }
  .preferred-source-btn-light-md svg {
    flex: none;
  }
</style>
<a class="preferred-source-btn-light-md" href="https://www.google.com/preferences/source?q=example.com" target="_blank" rel="noopener">
  <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path fill="#2563eb" d="M12 2.6l2.8 6 6.6.7-4.9 4.5 1.4 6.5L12 17l-5.9 3.3 1.4-6.5L2.6 9.3l6.6-.7z"/></svg>
  <span>Add Example as a preferred source on Google</span>
</a>

A link plus a small <style> block with a hover state. Paste it into any page or theme template.

Google's official JavaScript button

Recommended by Google

Google also offers its own button. Its script draws a Google-styled, translated button and brings readers straight back to your page after they add you. There is no domain to set. It needs JavaScript, so it won't work in emails, Markdown or apps that block third-party scripts, where the link buttons above do.

HTML from Google Search Central
<script async src="https://news.google.com/swg/js/v1/publisher.js"></script>
<div google-add-preferred-source-btn data-theme="light"></div>
Google's preferred sources guideOfficial badge images by Google (ZIP)

The script and badge images are provided by Google in its Search Central documentation. Google is a trademark of Google LLC. This generator is not affiliated with Google, and its own button styles don't use Google's logo.

About this google preferred source button generator

This free Google preferred source button generator makes the button that asks your readers to add your site as a preferred source on Google. Enter your domain, pick a style and a language, and copy the code for HTML, inline CSS, Markdown, WordPress or React. Every button links to https://www.google.com/preferences/source?q= with your domain, the deeplink Google documents for publishers, so a reader lands on Google's source preferences with your site already searched.

The preview updates as you type, and Test link opens the real Google page so you can check that your site is listed. The custom styles keep Google's logo out of your design.

If you'd rather use Google's own JavaScript button, the generator also gives you the official embed code, with light or dark theme and any of its supported languages. A Google preferred sources button works best at the end of articles, in newsletters and in a slim sticky bar.

What are Google preferred sources?

Preferred sources let people pick the sites they want to see more of in Google Search. When a reader selects your site, your stories are more likely to appear for them in Top Stories, marked with a preferred label.

Google says the same choice also shapes AI Mode and AI Overviews, where those features are available. For that, your site must be included in Search generative AI features in Search Console. Top Stories support is available in every language Google Search supports.

Who sees the button, and who it helps

  • Every reader sees it

    The button is a normal link on your page, so anyone can click it, signed in to Google or not.

  • Only clicks that confirm count

    The link opens Google's source preferences with your site searched. The reader ticks your site to save it.

  • It only changes their results

    Signed-in readers keep the choice in every browser they use. Nobody else's results change.

A preferred source button is not a ranking boost for everyone. It helps you stay in front of the readers who already like your work, which matters most for news sites, blogs and newsletters that publish often.

Where to place your preferred source button

  • Add us as a preferred source

    Article footer

    Right after the last paragraph, when a reader has just finished a story they liked. This is the most natural spot and the one to start with.

  • Add us as a preferred source

    Newsletter

    Your subscribers already trust you. Use the Inline CSS version without the icon, since many email apps strip style tags and some block SVG.

  • Preferred source

    Sticky bar

    A slim bar at the bottom of article pages, shown after some scrolling and easy to close. Keep it out of the way of the content.

How to check that it works

  1. 1

    Check that your site is eligible

    Click Test link in the generator. Google's source preferences tool opens with your domain searched. If your site appears, it's eligible. Only domains and subdomains are listed, not folders like example.com/blog.

  2. 2

    Click the button on your live page

    It should open google.com/preferences/source with your domain in the search box, in a new tab, so the article stays open.

  3. 3

    Add your own site and look for it

    Tick your site, then search a recent news topic you cover. Your stories can show more often in Top Stories with a preferred label, though Google doesn't promise a spot.

  4. 4

    Measure clicks

    Add a click event in your analytics tool to see how many readers start the flow. The event tells you who clicked, not who confirmed on Google.

Everything here follows Google's preferred sources guide for publishers, including the link format the buttons use.

Adding the button is optional. Google says readers can pick your site as a preferred source either way.

How to use Google Preferred Source Button Generator

  1. 1

    Enter your domain

    Type your site, like example.com. Google lists whole domains and subdomains, not folders.

  2. 2

    Pick a style

    Choose light, dark, pill, outline or compact badge, then the size, icon and accent color.

  3. 3

    Set the text

    Use your site name or "us" in one of seven languages, or write your own label.

  4. 4

    Copy and test

    Copy HTML, inline CSS, Markdown, WordPress or React code, then click Test link to check it on Google.

More free SEO tools

“I am absolutely obsessed with SEO. I spend my days mastering the backlinks and growth strategies you need to scale on auto-pilot.”
TiboTiboFounder of Outrank, SuperX
Outrank

Grow organic traffic on auto‑pilot

Outrank writes and publishes SEO articles and builds backlinks for you, every day.

Try Outrank free

Frequently asked questions

What is a Google preferred source button?

A button or link that sends readers to Google's source preferences with your site already searched, so they can add it as a preferred source in two clicks. It uses the link format Google documents for publishers.

What is the link to add a site as a preferred source on Google?

https://www.google.com/preferences/source?q=example.com, with your own domain in place of example.com. It's the deeplink Google gives publishers in its Search Central guide, and every button from this generator uses it.

Does Google have an official preferred sources button?

Yes. Google offers a JavaScript button, a script tag plus a div, that draws a translated, Google-styled button in light or dark, and it publishes downloadable badge images. The generator gives you that official code too, next to link buttons you can style yourself.

Can I put the Google logo on my button?

Not on a button you design yourself. Google's brand terms require its approval before you use its logos. Use Google's JavaScript button or its badge images for Google's own look; the custom styles here use the word Google without the logo.

Does a preferred source button improve my rankings?

Not for everyone. It only changes results for the readers who add your site. For them, your stories are more likely to show in Top Stories, and Google says the choice also shapes AI Mode and AI Overviews.

Which sites can be added as a preferred source?

Domains and subdomains, like example.com or news.example.com, that Google lists in its source preferences tool. Folders such as example.com/blog aren't eligible. Click Test link to see whether your site appears.

Does the button work in emails and newsletters?

Yes, the link version does. Use the Inline CSS code and turn off the icon, since many email apps strip style tags and some block SVG. Google's JavaScript button won't run in email.

Where is Google preferred sources available?

Google says the feature works in Top Stories in every language where Google Search is available, and in AI Mode and AI Overviews wherever those features exist.