` to your page. If you can’t run JavaScript, use a link to `google.com/preferences/source?q=yourdomain.com`. - **Cost:** free. The button is optional. You don’t need it to be chosen as a preferred source, but it makes the choice one click away. ## What are Google preferred sources? Preferred sources is a personalisation setting in Google Search. A user searches for a site in Google’s [source preferences tool](https://www.google.com/preferences/source) and selects it. From then on, Google says that site’s content is “more likely to appear in Top Stories” for that user, marked with a “preferred” badge. The same signal now carries into Google’s AI features. In AI Mode and AI Overviews, content from a preferred source can be highlighted with the “preferred” badge for users who have selected it. Unlike most ranking factors, this one is decided by your readers, not by an algorithm. It works like a follow button for Google Search, and that is why it matters. ## Eligibility criteria: can your site appear as a preferred source? Google’s documentation lists these requirements: 1. **Domain or subdomain only.** “Only domain-level and subdomain-level sites are eligible to appear in the source preferences tool.” `https://www.example.com/` and `https://code.example.com/` qualify. `https://www.example.com/blog` does not. If your content lives in a subfolder, readers select your whole domain instead. 2. **Top Stories:** available globally, in every language where Google Search is available. 3. **AI Mode and AI Overviews:** your site must be included in Search generative AI features in Search Console. Google explains this in its [Search Console help article](https://support.google.com/webmasters/answer/16908024). If you have opted out, your site can’t be shown as a preferred source in those features. ### How to check whether your site is listed Go to [google.com/preferences/source](https://www.google.com/preferences/source) and search for your domain. If it appears, readers can already select it. The button below simply takes them straight there. ## How to get the “Add to preferred sources” button Google offers three ways to promote your site as a preferred source. None of them is required to appear as a preferred source. They just make it easier for readers to choose you. Pick the one that fits your stack. ### Method 1: Standard JavaScript button (recommended) This is the quickest option. With two lines of HTML you get an interactive button that Google translates automatically. Readers can add your site and then return to the page they were reading. **Step 1.** Add Google’s library to your page, preferably in the ``: ``` ``` **Step 2.** Place the button wherever you want it in the ``, for example under an article headline, in your footer, or next to newsletter sign-ups: ```

``` **Optional: dark theme.** The button is light by default. Set `data-theme` to `dark` for dark sections: ```

``` **Optional: fixed language.** By default the button follows the user’s browser language. To force a language, use `data-lang`. Google publishes the [list of supported language codes](https://developers.google.com/static/search/docs/appearance/preferred-sources-languages.csv). ```

``` ### Method 2: Advanced JavaScript with your own design If the standard button doesn’t fit your design system, keep your own button and let Google’s library handle the flow. You can load it as an ES module: ``` import { preferredSource } from "https://news.google.com/swg/js/v1/publisher.mjs"; preferredSource.init({ theme: 'light', // "light" or "dark" lang: 'en' // optional }); document.querySelector('#myButton').onclick = () => { preferredSource.addPreferredSource(); }; ``` Or use the standard script with `preferred-sources-control="manual"`, which stops it from rendering buttons automatically: ``` ``` Without the `manual` attribute, the script finds every element with `google-add-preferred-source-btn` and renders the default button there. ### Method 3: Deeplink (no JavaScript) If your platform doesn’t allow custom scripts, or you want to promote the feature outside your website, use a plain link. Replace `example.com` with your domain: ``` Add as Preferred Source ``` You can also wrap an image badge in the link. Google provides [official badge graphics in every language](https://services.google.com/fh/files/helpcenter/google_preferred_source_badge_all_languages.zip) (ZIP), or you can design your own: ```

``` The same deeplink works in social posts, email newsletters, author bios and campaign landing pages. ## Benefits of becoming a preferred source Google describes the direct benefits in a single sentence: your content is more likely to appear in Top Stories, and it carries a “preferred” badge there and in AI answers. For a business, that adds up to more than it sounds: - **More visibility with readers who chose you.** Your articles are more likely to surface in Top Stories for people who opted in to your site. - **A trust signal in AI answers.** In AI Mode and AI Overviews, the “preferred” badge highlights your content among cited sources. That is a rare way to stand out in AI search, where competing links are often hard to tell apart. - **An audience you own on Google.** Followers on social platforms depend on each platform’s feed. A preferred-source choice ties your readers to you in Google Search itself. - **Cheap to set up.** Two lines of code or one link. No paid placement, no new platform, no extra content. - **Works with your existing SEO and AEO.** It doesn’t replace good content, structured data or technical SEO. It gives your best readers a way to see more of that content. ## What it means for CMOs For marketing leaders, preferred sources is a new conversion goal: **turn a reader into a follower on Google**. Treat it like a newsletter sign-up. - Put the button where engaged readers are: at the end of articles, on your insights or blog index, and in the email footer. - Use the deeplink in newsletters, LinkedIn posts and author bylines. Your most loyal readers are often already in those channels. - Make the case in one line (“See our insights first in Google”) rather than relying on the button text alone. - Keep publishing regularly. A preferred source only helps when you have fresh content that can show up in Top Stories and AI answers. ## What it means for CTOs For technology leaders, the job is small but worth doing properly: - **Load the script asynchronously** (the snippet already uses `async`) so it doesn’t block rendering or hurt Core Web Vitals. - **Reserve space for the button** so it doesn’t cause layout shift (CLS) when it renders. - **Use the advanced method** if you have a design system, so the button matches your components and themes. - **Check your Content Security Policy** allows scripts from `news.google.com`. - **Confirm Search Console settings**: your site needs to be included in Search generative AI features for the AI Mode and AI Overviews badge. - **Check your domain structure.** If your content sits in a subdirectory of a larger domain, readers will be selecting the whole domain. ## Checklist: get your preferred source button live 1. Search for your domain at [google.com/preferences/source](https://www.google.com/preferences/source) to confirm it’s listed. 2. In Search Console, check that your site is included in Search generative AI features. 3. Choose a method: standard button, custom button, or deeplink. 4. Add the button to article pages and other high-engagement templates. 5. Add the deeplink to newsletters, social profiles and bylines. 6. Test it in light and dark sections, on mobile, and in a second language. ## How Supercode can help Supercode designs and builds B2B websites that are easy to find in Google and easy for AI systems to read and cite. That includes [AEO-ready website design](https://www.supercode.in/services/capabilities/aeo-website-design-services-india), [web development](https://www.supercode.in/services/web-development) with fast, clean front ends, and integrations like the preferred sources button that fit your design system without slowing your site down. Want help adding preferred sources and improving how your site shows up in Google and AI answers? [Talk to our team](https://www.supercode.in/contact). ## FAQs ### What is a preferred source in Google Search? It is a site a user has chosen in Google’s source preferences tool. Content from that site is more likely to appear for that user in Top Stories with a “preferred” badge, and can be highlighted with the badge in AI Mode and AI Overviews. ### How do I add the “Add to preferred sources” button to my website? Add `` to your page and place `

` where you want the button. Without JavaScript, link to `https://www.google.com/preferences/source?q=yourdomain.com`. ### Is my site eligible to be a preferred source? Domain-level and subdomain-level sites are eligible. Subdirectories such as `example.com/blog` are not. For AI Mode and AI Overviews, your site must also be included in Search generative AI features in Search Console. Search for your domain at google.com/preferences/source to check. ### Do I need the button to become a preferred source? No. Readers can select any eligible site in the source preferences tool. The button and deeplink only make it easier for them to find the option. ### Is the preferred sources feature available outside the US? Yes. Google says it is available globally for Top Stories in every language where Google Search is available, and in AI Mode and AI Overviews wherever those features are available. ### Can I style the button to match my brand? Yes. The standard button has light and dark themes. For full control, use the advanced JavaScript method with your own button, or link Google’s official badge graphics (or your own design) to the deeplink. _Source: [Google Search Central: Help your readers find your site through preferred sources in Google Search](https://developers.google.com/search/docs/appearance/preferred-sources)._ Have a project in mind? ## Discuss a project with Supercode From tech company redesigns to enterprise-grade platforms, we plan, design and build websites that match the ambition of the business behind them. [Discuss a project](https://www.supercode.in/contact) · [See our work](https://www.supercode.in/work) Trusted by - ![Ather](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Father.png&w=3840&q=75) - ![Zetwerk](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fzetwerk.png&w=3840&q=75) - ![Lupin](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Flupin.png&w=3840&q=75) - ![Selco](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fselco.png&w=3840&q=75) - ![Chemical Engineering, IISc](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fchemical-engg.png&w=3840&q=75) - ![Emirates Shipping Line](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fesl.png&w=3840&q=75) - ![Superform](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fsuperform.png&w=3840&q=75) - ![73 Strings](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2F73strings.png&w=3840&q=75) - ![Hex20](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fhex20.png&w=3840&q=75) - ![Aadyah Space](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Faadyah.png&w=3840&q=75) - ![Niqo Robotics](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fniqo.png&w=3840&q=75) - ![Maxis Clinical Sciences](https://www.supercode.in/_next/image?url=%2Fassets%2Flp%2Fmaxis.png&w=3840&q=75) ## Related articles [All resources](https://www.supercode.in/resources) [, AEO, How-to guides, Marketing, Website, How to Use Microsoft Clarity Agentic Analytics: A Guide for CMOs and CTOs](https://www.supercode.in/resources/insight/microsoft-clarity-agentic-analytics) · [, How-to guides, UI/UX, Web Design, How to Use Figma Specs: A Practical Guide for Designers](https://www.supercode.in/resources/insight/how-to-use-figma-specs) · [, AEO, enterprise website, Web Design, Web Development, AEO Checklist: How B2B Websites Get Cited by AI](https://www.supercode.in/resources/insight/aeo-for-b2b-websites)