Insigna Google Customer Reviews a devenit noul widget al magazinului. Această versiune actualizată are un design nou și opțiuni de afișare mai vizibile pentru a evidenția mai bine evaluarea magazinului, numărul total de recenzii și informațiile despre calitate de pe site.
Codul widgetului magazinului este primul dintre cele două fragmente de cod pe care le implementezi pentru integrarea codului widgetului magazinului. Widgetul este opțional.
Pe această pagină
Instrucțiunile de integrare
Pentru a integra widgetul magazinului pe o pagină, trebuie să:
Aceste activități sunt descrise în secțiunile care urmează.
Când implementezi codul widgetului pe paginile tale, se va afișa unul dintre următoarele widgeturi:
| Widgetul Magazin de înaltă calitate | Widgetul Evaluarea magazinului | Widgetul Calitatea magazinului |
| Când: | Când: | Când: |
Dacă folosești insigna veche, aceasta va afișa una dintre cele trei versiuni ale widgetului, în funcție de evaluarea calității magazinului.
Nu ascunde widgetul cu niciun alt conținut de pe paginile tale.
Actualizează structura DOCTYPE
Asigură-te că paginile web pe care implementezi widgetul folosesc structura HTML5 DOCTYPE.
<!DOCTYPE html>
Acest doctype trebuie să fie primul element rând din codul HTML de pe pagină. Dacă folosești structura DOCTYPE HTML5, browserele web vor afișa paginile în modul standard în locul modului caracteristici speciale. Modul caracteristici speciale se referă la o tehnică folosită de anumite browsere web pentru a menține retrocompatibilitatea cu paginile web create pentru browsere mai vechi, în locul respectării stricte a standardelor W3C și IETF în modul standard.
Adaugă widgetul magazinului
Pentru a le arăta clienților tăi că folosești Google Customer Reviews, adaugă widgetul magazinului pe orice pagină de pe site unde vrei să apară.
Pentru a adăuga widgetul magazinului pe site:
- Accesează interfața de unde poți edita codul HTML al site-ului. Pentru aceasta, alege pasul care ți se potrivește cel mai bine:
- Găsește codul HTML sursă care se aplică pentru toate paginile site-ului tău.
- Accesează pagina unde vrei să afișezi widgetul.
- Copiază și inserează codul de mai jos în secțiunea
<head>a codului HTML.-
Opțional: în mod prestabilit, widgetul va fi fixat în dreapta jos a paginii. Dacă vrei să plasezi widgetul în stânga jos a paginii, înlocuiește secțiunea galbenă a codului de mai jos cu „
LEFT_BOTTOM”.
-
<!-- BEGIN MerchantWidget Code -->
<script id='merchantWidgetScript'
src="https://www.gstatic.com/shopping/merchant/merchantwidget.js"
defer>
</script>
<script type="text/javascript">
merchantWidgetScript.addEventListener('load', function () {
merchantwidget.start({
position: 'RIGHT_BOTTOM'
});
});
</script>
<!-- END MerchantWidget Code →
- Comercianții au și posibilitatea de a personaliza poziționarea widgetului. La personalizarea poziționării, sunt introduși patru parametri:
- sideMargin: numărul de pixeli ai widgetului din marginea laterală. Când poziția este setată la LEFT_BOTTOM, reprezintă marginea dinspre stângă, când este RIGHT_BOTTOM, reprezintă marginea dinspre dreapta. Valoarea prestabilită este 36.
- bottomMargin: numărul de pixeli ai widgetului din marginea laterală. Valoarea prestabilită este 36.
- mobileSideMargin: sideMargin pe ecranul dispozitivului mobil. Valoarea prestabilită este 16.
- mobileBottomMargin: bottomMargin pe ecranul dispozitivului mobil. Valoarea prestabilită este 46.
Iată un exemplu de personalizare a poziționării:
<script id='merchantWidgetScript' src="https://www.gstatic.com/shopping/merchant/merchantwidget.js" defer></script>
<script type="text/javascript">
merchantWidgetScript.addEventListener('load', function () {
merchantwidget.start({
position: 'LEFT_BOTTOM',
sideMargin: 21,
bottomMargin: 33,
mobileSideMargin: 11,
mobileBottomMargin: 19
});
});
</script>
După configurare, codul HTML ar trebui să arate precum codul de mai jos. Asigură-te că fișierul HTML are <!DOCTYPE html> ca prim rând:
<!DOCTYPE html>
<html>
<head>
<title>Exemplu Google</title>
<meta charset="UTF-8">
<meta name="description" content="Exemplu de pagină HTML cu o secțiune head">
<meta name="keywords" content="HTML, exemplu, secțiune head">
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="script.js" defer></script>
<!-- BEGIN MerchantWidget Code -->
<script id='merchantWidgetScript'
src="https://www.gstatic.com/shopping/merchant/merchantwidget.js"
defer>
</script>
<script type="text/javascript">
merchantWidgetScript.addEventListener('load', function () {
merchantwidget.start({});
});
</script>
<!-- END MerchantWidget Code --> // <- pune acest cod în secțiunea head
</head>
<body>
<h1>Bun-venit la Google!</h1>
<p>Acesta este un document HTML de bază</p>
<p>Accesează <a href="https://www.google.com">pagina de pornire Google</a>.</p>
<script>
function greetGoogle() {
alert('Salut, Google! O zi bună!');
}
greetGoogle();
</script>
</body>
</html>
- Poți și să personalizezi regiunea (opțional). Dacă nu este setat, widgetul revine la folosirea logicii de globalizare pentru a stabili regiunea.
Cum să elimini vechiul fragment de cod al widgetului Store
Instrucțiuni
- Accesează codul HTML al site-ului și găsește codul widgetului magazinului.
- Șterge următorul cod HTML pentru a elimina widgetul.
Sau
Dacă adaugi comentarii la următorul cod, acesta va fi eliminat de pe site.
<script src="https://apis.google.com/js/platform.js?onload=renderBadge" async defer></script>
<script>
window.renderBadge = function() {
var ratingBadgeContainer = document.createElement("div");
document.body.appendChild(ratingBadgeContainer);
window.gapi.load('ratingbadge', function() {
window.gapi.ratingbadge.render(ratingBadgeContainer, {"merchant_id": 0});
});
}
</script>
Întrebări frecvente
Cum vor fi afișate widgetul și panoul pe dispozitivele mobile față de computer?
Site-ul meu este gestionat folosind Shopify. Pot să implementez în continuare această funcție?
- Notă: comercianții Shopify spun că Shopify va trunchia automat toate spațiile din script. Spațiile din script sunt intenționate, deci asigură-te că acestea nu sunt trunchiate.
De unde provin datele afișate în panou? Cum pot vedea rezultatele programului?
Clienții pot închide complet widgetul?
Widgetul va fi întotdeauna vizibil. Clientul poate să dea clic pe widget pentru a maximiza panoul, iar când panoul este deschis, poate să dea clic pe pictograma de închidere pentru a minimiza panoul, în timp ce widgetul rămâne afișat.