Pomóż czytelnikom znaleźć Twoją witrynę za pomocą preferowanych źródeł w wyszukiwarce Google

Jeśli jesteś właścicielem witryny, możesz pomóc odbiorcom znaleźć Twoją publikację jako preferowane źródło w wyszukiwarce Google. Gdy użytkownik wybierze Twoją witrynę jako preferowane źródło, Twoje treści będą częściej pojawiać się w sekcji Najważniejsze artykuły i będą oznaczone plakietką „Preferowane”. W Trybie AI i przeglądach od AI Twoje treści mogą być wyróżnione plakietką „preferowane” dla użytkowników, którzy wybrali Twoją witrynę jako preferowane źródło.

Preferowane źródła w Najważniejszych artykułach

Dostępność funkcji

Funkcja preferowanych źródeł jest dostępna na całym świecie w sekcji „Najważniejsze artykuły” we wszystkich językach, w których działa wyszukiwarka Google. Preferowane źródła mogą też pojawiać się w Trybie AI i przeglądach od AI we wszystkich językach i regionach, w których te funkcje są dostępne.

W narzędziu do ustawiania preferencji dotyczących źródeł mogą się wyświetlać tylko witryny na poziomie domeny i subdomeny. Na przykład https://www.example.com/ i https://code.example.com/ kwalifikują się jako preferowane źródła, ale podkatalog https://www.example.com/blog już nie.

Jak sprawić, aby użytkownicy uznali Twoją witrynę za preferowane źródło informacji

Jeśli Twoja witryna pojawia się w narzędziu do ustawiania preferencji dotyczących źródeł (aby to sprawdzić, wpisz adres witryny w polu wyszukiwania narzędzia), możesz użyć tych metod, aby zachęcić czytelników do wybrania Twojej witryny jako preferowanego źródła:

Standardowa implementacja JavaScriptu (zalecana): umieść na swoich stronach internetowych interaktywny przycisk, który pozwoli czytelnikom bezproblemowo dodać Twoją witrynę jako preferowane źródło i wrócić na Twoją stronę. Dodanie tylko 2 wierszy do kodu HTML powoduje wyświetlenie automatycznie zlokalizowanego przycisku w stylu Google, który obsługuje dostosowywanie do urządzenia i języka.
Zaawansowana implementacja JavaScriptu z niestandardowymi zasobami projektowymi: jeśli chcesz użyć własnych zasobów projektowych i dostosować standardowy przycisk JavaScript, postępuj zgodnie z instrukcjami zaawansowanej implementacji JavaScriptu. Interfejs użytkownika pozostaje taki sam jak w przypadku standardowej implementacji JavaScriptu.
Implementacja precyzyjnego linku: jeśli nie możesz zaimplementować przycisku interaktywnego (np. Twój system CMS go nie obsługuje), możesz użyć precyzyjnego linku, aby przekierować użytkowników do dodania Twojej witryny jako preferowanego źródła. Możesz to zrobić, dodając do stron internetowych link tekstowy lub klikalny obraz. Możesz też użyć precyzyjnego linku w postach w mediach społecznościowych, newsletterach lub promocjach.

Standardowa implementacja JavaScriptu (zalecana)

Dodając tylko 2 wiersze do kodu HTML, możesz dodać automatycznie przetłumaczony, interaktywny przycisk, który umożliwia czytelnikom bezproblemowe dodanie Twojej witryny jako preferowanego źródła i powrót do miejsca, w którym przerwali czytanie na Twojej stronie. Możesz też ustawić motyw przycisku (ciemny lub jasny) i zastąpić jego język. Zalecamy tę implementację, ponieważ zapewnia ona czytelnikom najlepsze wrażenia.

Oto jak to będzie wyglądać:

Aby umieścić przycisk JavaScript na stronie internetowej:

Dodaj do strony internetowej ten tag <script> (najlepiej w elemencie <head>), który wczytuje bibliotekę preferowanych źródeł.
```
<script async src="https://news.google.com/swg/js/v1/publisher.js"></script>
```
Dodaj tag <div> w dowolnym miejscu w treści strony internetowej, w którym chcesz wyświetlać przycisk.
```
<div google-add-preferred-source-btn></div>
```

Ustawianie motywu przycisku

Domyślnie przycisk „Dodaj do preferowanych źródeł” wyświetla się w jasnym motywie. Aby dostosować motyw, dodaj atrybut danych data-theme do elementu <div> i ustaw go na light lub dark:

<div google-add-preferred-source-btn data-theme="dark"></div>

Zastępowanie języka przycisku

Domyślnie przycisk „Dodaj do preferowanych źródeł” wyświetla się w języku użytkownika na podstawie ustawień jego przeglądarki. Aby zmienić to zachowanie, dodaj atrybut danych data-lang do elementu <div> i ustaw go na preferowany kod języka (pobierz listę obsługiwanych kodów języków):

<div google-add-preferred-source-btn data-lang="en"></div>

Pobierz obsługiwane kody języków

Zaawansowana implementacja JavaScriptu z niestandardowymi zasobami projektowymi

Domyślnie standardowy przycisk JavaScript automatycznie skanuje DOM pod kątem elementów z atrybutem google-add-preferred-source-btn i renderuje standardową plakietkę. Jeśli jednak chcesz używać integracji niestandardowych, w których proces ma być uruchamiany przez Twoje elementy interfejsu lub etapy aplikacji, możesz zainicjować klienta automatycznie i powiązać proces z niestandardowymi aktywatorami.

Podczas integrowania biblioteki preferowanych źródeł z niestandardowymi interfejsami użytkownika, etapami aplikacji lub nowoczesnymi aplikacjami frameworka możesz w pełni programowo kontrolować ustawienia środowiska wykonawczego i inicjowanie przepływu za pomocą naszego pakietu JavaScript SDK. W zależności od narzędzi i architektury oferujemy 2 różne podejścia do integracji: importowanie modułów ES (ESM) i standardowe kolejki wywołań zwrotnych skryptów (IIFE). Oba modele dystrybucji udostępniają identyczne funkcje i metody.

Importy modułów ES

W przypadku nowoczesnych konfiguracji kompilacji i środowisk opartych na modułach zaimportuj bibliotekę bezpośrednio do kodu.

import { preferredSource } from
  "https://news.google.com/swg/js/v1/publisher.mjs";

// 1. Initialize directly using the imported module instance
preferredSource.init({
  theme: 'light', // Theme choice: "light" or "dark" (default "light")
  lang: 'en'      // Optional: override language (defaults to page language)
});

// 2. Programmatically bind flow invocation using a click handler
const button = document.querySelector('#myButton');
button.onclick = () => {
  preferredSource.addPreferredSource();
};

Kolejki wywołań zwrotnych standardowych skryptów

W przypadku standardowych integracji tagów skryptu wczytaj ten skrypt w sekcji <head> dokumentu z atrybutem preferred-sources-control="manual", aby zapobiec automatycznemu renderowaniu przycisku:

<script async preferred-sources-control="manual" src="https://news.google.com/swg/js/v1/publisher.js"></script>

Uwaga: jeśli atrybut preferred-sources-control="manual" zostanie pominięty, zostaną wyszukane i natychmiast zainicjowane wszystkie elementy z atrybutem google-add-preferred-source-btn.

Następnie użyj globalnej kolejki wywołań zwrotnych PREFERRED_SOURCE, aby zainicjować opcje i powiązać niestandardowe reguły:

<script>
  (self.PREFERRED_SOURCE = self.PREFERRED_SOURCE || []).push(
    function(preferredSource) {
      // 1. Initialize with options
      preferredSource.init({
        theme: 'light',
        lang: 'en'
      });

      // 2. Programmatically bind trigger button
      const button = document.querySelector('#myButton');
      button.addEventListener('click', () => {
        preferredSource.addPreferredSource();
      });
  });
</script>

Aby zapoznać się z interaktywnymi implementacjami frontendu i backendu, które pokazują wykorzystanie na żywo przycisków, kontenerów deklaratywnych, skryptów IIFE i pakietów modułów ES, zapoznaj się z wersją demonstracyjną preferowanych źródeł.

Implementacja precyzyjnych linków

Jeśli nie możesz używać JavaScriptu w swojej witrynie, możesz użyć precyzyjnego linku, aby przekierować użytkowników do narzędzia do ustawiania preferencji dotyczących źródeł, gdzie mogą dodać Twoją witrynę jako preferowane źródło i potwierdzić swój wybór.

Użyj poniższego formatu adresu URL i zastąp example.com nazwą domeny swojej publikacji, która przenosi użytkowników bezpośrednio do Twojej witryny w narzędziu do ustawiania preferencji dotyczących źródeł:

https://www.google.com/preferences/source?q=Your_Website's_URL

Przykładowy link tekstowy

<a
  href="https://www.google.com/preferences/source?q=example.com">
  Add as Preferred Source
</a>

Przykładowy klikalny link do zdjęcia

<a
  href="https://www.google.com/preferences/source?q=example.com">
  <img src="path/to/your/button.png" alt="Add as Preferred Source">
</a>

Komponenty z obrazem przycisku

Możesz zaprojektować własną plakietkę promocyjną lub pobrać oficjalne przetłumaczone zasoby graficzne udostępnione przez Google:

Pobierz zasoby przycisku