In diesem Leitfaden wird erläutert, wie Entwickler von Drittanbieter-Apps die
MerchantSupport
um eine In-App-Diagnoseseite für ihre Händler zu erstellen.
Sie können mit diesem Dienst zur Erstellung von Benutzeroberflächen ähnlich dem Merchant Center-Konto Diagnose-Tool und Produktdiagnose-Tool .
Der MerchantSupport
-Dienst ist nur für Benutzer-UIs von Drittanbietern verfügbar. Anfragen sollten
wird ausgelöst, wenn ein Händler mit der Benutzeroberfläche Ihrer App interagiert. Zum Automatisieren
Diagnose Ihres eigenen Händlerkontos finden Sie im Konto
Status, Produkt
Status und Produkt
Anleitungen.
Wir empfehlen Ihnen, die folgenden Seiten in Ihrer App bereitzustellen, damit Ihre Fehlerbehebung für Händler:
- Kontodiagnose
- Produktdiagnose
Verschiedene Möglichkeiten zur Implementierung einer Diagnoseseite
Sie können die Diagnoseseite auf verschiedene Arten implementieren. Je nach Bedarf
wählen Sie die Option aus, mit der festgelegt wird, wie komplexe Diagnoseaktionen ausgeführt werden. In
Für die Anfrage können Sie user_input_action_option
auf einen der folgenden Werte festlegen:
Optionen:
REDIRECT_TO_MERCHANT_CENTER
: Das ist die Standardoption. Aktionen, die zusätzliche Inhalte anzuzeigen oder zusätzliche Informationen vom Händler nicht vollständig in Ihrer App implementiert sind. Für sie bietet die API eine Sie gelangen dann zur entsprechenden Seite im Merchant Center, auf der der die Aktion ausführen kann.BUILT_IN_USER_INPUT_ACTIONS
: Sie können komplexe Aktionen implementieren, die Folgendes erfordern: Nutzereingabe als In-App-Lösung in Ihre App.
Diagnoseseite implementieren
In diesem Abschnitt wird beschrieben, wie Sie die Diagnoseseite implementieren. Die Standardeinstellung (einfache) Option, um komplexe Aktionen als Weiterleitungen an das Merchant Center zu verarbeiten.
Eine erweiterte Implementierung mit In-App-Aktionen finden Sie hier: und siehe Integrierte Aktion mit Nutzereingabe implementieren.
Implementierung
So sollte der Ablauf der Diagnoseseite aussehen:
- Ein Händler öffnet eine Diagnoseseite in Ihrer App.
Deine App fordert durch Aufrufen des
MerchantSupport
-Dienstes eine Diagnose an.Hier eine Beispielanfrage:
POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/renderaccountissues?timeZone=America/Los_Angeles&languageCode=en-GB {}
Ersetzen Sie {merchantId} durch die eindeutige Kennzeichnung des Konto, für das die Verarbeitung der Aktion ausgelöst werden soll.
In Ihrer App werden die Diagnosedaten und die empfohlenen Maßnahmen aus der Antwort angezeigt an den Händler gesendet. Sie sehen hier ein Beispiel:
{ "issues": [ { "title": "Misrepresentation", "impact": { "message": "Prevents all products from showing in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Products not showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eBased on the information available about your business, there is reason to believe that customers are being misled on Google. Review the Misrepresentation policy and make changes to your Merchant Center and/or online store.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure your Merchant Center and online store follow the following best practices / guidelines\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eProvide transparency about your business identity, business model, policies and how your customers can interact with you\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003ePromote your online reputation by showing reviews or highlighting any badges or seals of approval\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eUse a professional design for your online store that includes an SSL certificate\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eMake sure it's accessible for all users without any redirects and doesn't have any placeholders for text and images.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eProvide information in the business information settings in your Merchant Center\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eLink any relevant third-party platforms to your Merchant Center and create a Google Business Profile.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eFollow SEO guidelines, improve your eligibility for seller ratings and match your product data in your Merchant Center with your online store\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/6150127?hl=en-US\" class=\"content-element\"\u003eLearn more about the Misrepresentation policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e", "actions": [ { "externalAction": { "type": "REVIEW_ACCOUNT_ISSUE_IN_MERCHANT_CENTER", "uri": "https://merchants.google.com/mc/products/diagnostics/accountissues?a=672911686&hl=en-US" }, "buttonLabel": "Request review", "isAvailable": true } ] }, { "title": "Adult-oriented content", "impact": { "message": "Prevents all products from showing in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Products not showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"callout-banners\"\u003e\u003cdiv class=\"callout-banner callout-banner-info\"\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eReview requested on Aug 9, 2023. It can take a few days to complete.u003c/span\u003e\u003c/p\u003e\u003c/div\u003e\u003c/div\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eThere was a problem identified with the sale of prohibited adult products on your online store. In the case that you are intentionally selling adult items, enable Adult content in Settings in your Merchant Center. In your product file, use the \u003c/span\u003e\u003cspan class=\"segment segment-attribute\"\u003eadult\u003c/span\u003e\u003cspan class=\"segment\"\u003e attribute for specific products.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure the products meet the policy requirements\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eAdult oriented content may be prohibited or restricted depending on the product sold and the country it is sold\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eSee a full list of countries in the HelpCenter\u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eDon't list sexually explicit content that is intended to arouse or includes content such as text, image, audio, or video of graphic sexual acts intended to arouse\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eExamples: Graphic depictions of sexual acts in progress, including hardcore pornography, any type of genital, anal, or oral sexual activity; graphic depictions of masturbation or genital arousal and language explicitly referencing arousal, masturbation, cartoon porn, or hentai\u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/6150138?hl=en-US#wycd-restricted-adult-content\" class=\"content-element\"\u003eLearn more about the Adult-oriented content policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e" }, { "title": "Missing return and refund policy", "impact": { "message": "Limits visibility of all products in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Limited visibility for products showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eThere was a problem identified with the return and/or refund policy of your online store. Update your return or refund policy to provide customers a transparent shopping experience.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure your products meet the Shopping policy requirements\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eIt's available on your online store\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eWe recommend that you have a separate landing page for your policy and link to it from the other pages on your online store, so that it's easy to find.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eIt's available in the language of the country you're selling in or in English\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eMake sure that the return and/or refund policy is available in the target language or in English. Ideally, users should be given the option to select the return and/or refund policy in their own language.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eIt's accessible to everyone visiting your online store, without having to log in, sign up or enter any personal information\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/9158778?hl=en-US\" class=\"content-element\"\u003eLearn more about Missing return and refund policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e", "actions": [ { "externalAction": { "type": "REVIEW_ACCOUNT_ISSUE_IN_MERCHANT_CENTER", "uri": "https://merchants.google.com/mc/products/diagnostics/accountissues?a=672911686&hl=en-US" }, "buttonLabel": "Request review", "isAvailable": true } ] } ], "alternateDisputeResolution": { "uri": "https://support.google.com/european-union-digital-services-act-redress-options?hl=en-US", "label": "Additional options available to you" } }
Wir empfehlen, die Probleme in der Reihenfolge anzuzeigen, in der sie zurückgegeben wurden.
title
undimpact.message
. Außerdem sollten Sie dieimpact.breakdowns
des Problems, wenn der Händler den Mauszeiger auf das Problem bewegt Titel oder Beschreibung.Der Händler klickt auf ein Problem in der Liste.
In deiner App werden für jedes Problem die detaillierten
impact
-Werte procountry
angezeigt.destination
,prerendered_content
und Schaltflächen für dieactions
, die der Händler ergreifen kann, um das Problem zu beheben. Es gibt verschiedene Arten von Aktionen:- Externe Aktionen: Bewegen Sie den Mauszeiger auf die externe Seite, z. B. in Merchant Center, wo der Händler das Problem beheben kann.
- Integrierte einfache Aktionen: Bewegen Sie den Mauszeiger auf die Seite in Ihrer App, auf der kann der Händler das Problem beheben.
- Integrierte Aktionen für die Nutzereingabe: Hiermit wird ein Dialogfeld geöffnet, über das der Händler
die erforderlichen Informationen zur Verfügung stellen und die Maßnahme beantragen. Diese Art von
Aktion ist nur verfügbar, wenn
BUILT_IN_USER_INPUT_ACTIONS
war angefordert.
Der Händler folgt der Anleitung, um das Problem zu beheben.
Der Händler lädt die Diagnoseseite in Ihrer App neu.
Deine App sendet eine weitere Anfrage an den
MerchantSupport
-Dienst und zeigt eine aktualisierte Liste der Probleme an.
Sie können die Informationen, die in der fertigen App angezeigt werden, mit auf den Diagnoseseiten im Merchant Center Implementierung.
UI-Simulationen
Hier ist ein Beispiel, wie Sie die Informationen aus der
renderaccountissues
auf der Seite „Diagnose“ Ihres Kontos. Objekte in der
UI werden den entsprechenden API-Feldern im Test zugeordnet. Sie können eine ähnliche
.
So sieht die ausgefüllte Kontodiagnoseseite aus:
Stil für vorab gerenderten HTML-Code festlegen
Die Antwort auf den Aufruf des MerchantSupport
-Dienstes enthält Folgendes:
prerendered_content
die Details zu jedem Problem in HTML. Sie können
diesen HTML-Inhalt direkt in Ihre UI ein, damit das Problem in lesbarer Form
Format.
Möglicherweise sehen Sie HTML-Elemente der Klasse new-element
. Das new-element
wird auf Elemente angewendet, die dem HTML-Code hinzugefügt werden, nachdem Sie
mit dem Dienst MerchantSupport
. Wir empfehlen, Elemente zusammen mit der Klasse
new-element
, damit Sie diese Elemente gestalten können, bevor sie für
für die Nutzer in Ihrer App.
Hier ein Beispiel für den Feldwert prerendered_content
:
<div class="issue-detail">
<div class="callout-banners">
<div class="callout-banner callout-banner-info"><p><span class="segment">Review requested on Aug 9, 2023. It can take a few days to complete.</span>
</p></div>
</div>
<div class="issue-content"><p class="content-element"><span class="segment">There was a problem identified with the sale of prohibited adult products on your online store. In the case that you are intentionally selling adult items, enable Adult content in Settings in your Merchant Center. In your product file, use the </span><span
class="segment segment-attribute">adult</span><span class="segment"> attribute for specific products.</span>
</p>
<p class="content-element root-causes-intro"><span class="segment">Make sure the products meet the policy requirements</span>
</p>
<ul class="content-element root-causes">
<li><p class="tooltip tooltip-style-info"><span class="segment">Adult oriented content may be prohibited or restricted depending on the product sold and the country it is sold</span><span
class="tooltip-icon"><br></span><span class="tooltip-text"><span class="segment">See a full list of countries in the HelpCenter</span></span>
</p></li>
<li><p class="tooltip tooltip-style-info"><span class="segment">Don't list sexually explicit content that is intended to arouse or includes content such as text, image, audio, or video of graphic sexual acts intended to arouse</span><span
class="tooltip-icon"><br></span><span class="tooltip-text"><span class="segment">Examples: Graphic depictions of sexual acts in progress, including hardcore pornography, any type of genital, anal, or oral sexual activity; graphic depictions of masturbation or genital arousal and language explicitly referencing arousal, masturbation, cartoon porn, or hentai</span></span>
</p></li>
</ul>
<a href="https://support.google.com/merchants/answer/6150138?hl=en-US#wycd-restricted-adult-content"
class="content-element">Learn more about the Adult-oriented content policy</a></div>
</div>
So sieht es aus, wenn Sie den vorherigen HTML-Code
prerendered_content
in Ihrer App ohne Stile:
Sie können mehrere CSS-Klassen verwenden, um anzupassen, wie die Inhalte in Ihrer Benutzeroberfläche gerendert werden. Hier ist ein CSS-Beispiel, das Sie verwenden können:
issue-detail {
text-align: left;
width: 700px;
border-radius: 8px;
background: white;
margin: 16px;
padding: 16px;
}
.content-element {
margin: 8px 0 8px 0;
display: block;
}
/* callout banners */
.callout-banners {
margin: 0 0 16px 0;
}
.callout-banner {
display: block;
padding: 16px 16px 6px 16px;
margin: 0 0 8px 0;
border-radius: 8px;
}
.callout-banner-info {
background: #e8f0fe;
}
.callout-banner-warning {
background: #fef7e0;
}
.callout-banner-error {
background: #fce8e6;
}
/* add an icon to the callout banner */
.callout-banner p {
background-repeat: no-repeat;
padding-left: 32px;
}
.callout-banner-error p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/error/default/20px.svg");
}
.callout-banner-warning p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/warning/default/20px.svg");
}
.callout-banner-info p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/search/default/20px.svg");
}
/* segments with style */
.segment-attribute {
color: #198639;
font-family: monospace, monospace;
}
.segment-bold {
font-weight: bold;
}
.segment-italic {
font-style: italic;
}
/* tooltip */
.tooltip {
position: relative;
}
.tooltip-style-info .tooltip-icon:before {
content: '(i)';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
margin-left: 5px;
}
.tooltip-style-question .tooltip-icon:before {
content: '(?)';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
margin-left: 5px;
}
.tooltip .tooltip-text {
visibility: hidden;
text-align: left;
background: white;
border-radius: 8px;
padding: 5px 0;
border: 1px solid;
padding: 10px;
box-shadow: 3px 7px 12px #c1c1c1;
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltip-text {
visibility: visible;
}
/* table */
table.content-element {
margin: 16px 0 16px 0;
border: 1px solid #ccc;
border-collapse: collapse;
margin: 1em 0;
}
table.content-element th {
background-color: #eee;
}
table.content-element th, table td {
border: 1px solid #ddd;
font-size: 0.9em;
padding: 0.3em 1em;
}
/* hidde elements added in future, until they are supported in your application */
.new-element {
visibility: hidden;
}
So sieht der gerenderte Inhalt aus, wenn Sie den vorherigen CSS-Code verwenden:
Sie können Kurzinfos auch mit CSS konfigurieren und anzeigen:
Integrierte Aktion mit Nutzereingabe implementieren
Eine integrierte Aktion mit Nutzereingabe ermöglicht Ihnen, eine komplexe Diagnose durchzuführen als In-App-Lösung in Ihrer Anwendung. Wir empfehlen, als Dialogfeld, in dem der Händler Feedback geben, zusätzliche Informationen und bestätigen Sie die Anfrage.
Jede Aktion enthält einen oder mehrere Aktionsabläufe. Bei einigen Aktionen können mehr als einen Ablauf. Zum Beispiel könnte es einen anderen Ablauf geben, wenn der Der Händler bittet um eine zusätzliche Überprüfung, da er mit der Entscheidung nicht einverstanden ist. und einem anderen Ablauf, wenn sie das Problem bereits behoben haben.
Wenn Sie Daten anfordern möchten, um komplexe Aktionen mit Nutzereingabe zu implementieren, müssen Sie
das Feld user_input_action_option
auf den Wert BUILT_IN_USER_INPUT_ACTIONS
.
POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/renderaccountissues
{
"user_input_action_option": "BUILT_IN_USER_INPUT_ACTIONS"
}
Ersetzen Sie {merchantId} durch die eindeutige Kennzeichnung des Konto, für das die Verarbeitung der Aktion ausgelöst werden soll.
Implementierung
Hier sehen Sie, wie wir den Ablauf der Diagnoseseite vorschlagen, auf der Nutzer sollte wie folgt aussehen:
Der Händler klickt auf die Aktionsschaltfläche.
- Sind mehrere Abläufe verfügbar, bietet Ihre App alle an, sodass der kann der Händler je nach Absicht eine Option auswählen.
- Der Händler wählt den Vorgang aus.
In Ihrer App werden der Titel, die Nachricht, die Zusatzinformationen und das Nutzereingabeformular für die Aktionsablauf ausgewählt. Wir empfehlen, diese Details in einem Dialogfeld.
- Die Zusatzinformationen (falls vorhanden) enthalten wichtige Informationen, um besser zu verstehen, wie die Aktion funktioniert um erfolgreich zu sein. Wir empfehlen, diese Nachricht hervorzuheben und zu gestalten entsprechend dem Schweregrad des Callouts.
- Wenn es im Ablauf Eingabefelder gibt, müssen diese angezeigt werden, damit der kann der Händler Werte angeben. Falls das Eingabefeld erforderlich ist: darf der Händler die Anfrage erst dann über Ihre App senden, den Wert bereitstellen.
Der Händler liest die Informationen und stellt die angeforderten Werte bereit.
Der Händler bestätigt seine Anfrage, indem er auf die Schaltfläche klickt.
Ihre App löst die Verarbeitung der Aktion aus, indem sie die Methode
MerchantSupport
-Dienst. Hier eine Beispielanfrage:POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/triggeraction { actionContext: "ActionContextValue=", actionInput: { actionFlowId: "flow1", inputValues: [ { input_field_id: "input1", checkbox_input_value: { value: true } } ] }
Ersetzen Sie {merchantId} durch die eindeutige Kennzeichnung des Konto, für das die Verarbeitung der Aktion ausgelöst werden soll.
Um auf die Methode
triggeraction
fürBuiltInUserInputAction
zuzugreifen, senden Sie einen mit dieserIn deiner App wird die Bestätigungsnachricht angezeigt, die von
MerchantSupport
zurückgegeben wurde .- Wenn der Dienst einen Validierungsfehler mit der Fehlermeldung
INVALID_ARGUMENT
zurückgibt Status enthält, enthält sie detaillierte Informationen und Eine lokalisierte Fehlermeldung, die dem Händler angezeigt werden sollte. Wir empfehlen, in der Nähe des betroffenen Eingabefelds. Hier ein Beispiel: einer Beispielantwort:
{ "error": { "code": 400, "message": "[actionInput.inputValues] Invalid user input", "status": "INVALID_ARGUMENT", "details": [ { "@type": "type.googleapis.com/google.rpc.ErrorInfo", "reason": "invalid", "domain": "global" }, { "@type": "type.googleapis.com/google.rpc.BadRequest", "fieldViolations": [ { "field": "actionInput.inputValues.input", "description": "The field is required" } ] } ] } }
- Gibt der Dienst einen ungültigen Status oder einen internen Fehler zurück, wie durch die
FAILED_PRECONDITION
undINTERNAL
hat, sollte die App die um die Seite zu aktualisieren oder es später noch einmal zu versuchen.
- Wenn der Dienst einen Validierungsfehler mit der Fehlermeldung