![[Mât'nik Brazil]](http://3.bp.blogspot.com/-w5vAnoQ0YEg/UhRlPw7Zf5I/AAAAAAAAAo0/PvMFtAu7zBM/s1600/Rio%2BDe%2BJenerio%2Bin%2Bnight.jpg)
Plate-forme Google+ X
MaisonProduitsConférencesPrésentezVivezGroupes
Plate-forme Google+ Commentaires sur ce document
Plate-forme Google+
▸
Quickstart
▸
échantillon PhotoChasse
▾
Référence de l'API
Android
▸
iOS
▾
Web
+1 Bouton
Badge
Suivez bouton
Messages interactifs
Partager
Connectez-vous
Snippet
JavaScript API client
Langues supportées
▸
Hangouts
▸
API HTTP
▸
Caractéristiques
▸
Android
▸
iOS
▾
sites
+1 Bouton
Badge
Suivez bouton
Messages interactifs
Les gens et les profils
recommandations de contenu
▸
Connexion
Partager
Application activités
Snippet
Politique des boutons
▸
Hangout Apps
API pour Google Apps Nouveau!
▸
Best Practices
Téléchargements
stratégie de marque
▸
Communauté & Support
Notes de version
Google API Console
Politiques pour les développeurs
Conditions d'utilisation
+1 Bouton
Documentation
Mise en route
Un simple bouton
+1 Tag
Asynchrone Chargement en cours
Configuration
Définition de l'URL cible +1
Les paramètres des balises de script
+1 Attributs de balise
taille des boutons
Largeur d'annotation Inline
Remplissage de la Snippet +
API JavaScript
Exemples
Page de base
Charge explicite
Rendre explicite
Charge asynchrone
FAQs
Codes de langue
Vous pouvez ajouter et personnaliser le bouton +1 pour répondre aux besoins de votre site, tels que la modification de la taille du bouton et technique de charge. En ajoutant le bouton +1 à votre site Web, vous permettez à vos utilisateurs de recommander votre contenu à leurs cercles et générer du trafic vers votre site. Le bouton +1 permet également d'améliorer le temps passé sur votre site en fournissant des recommandations pour davantage de lecture.
Utilisation du bouton +1 est soumise à la politique de boutons de la plateforme Google+ .
Mise en route
Un simple bouton
La méthode la plus simple pour inclure un bouton +1 sur votre page est d'inclure la ressource JavaScript nécessaire et ajouter un bouton +1 tag:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>
Le script doit être chargé à partir du protocole HTTPS et peut être inclus à partir de n'importe quel point sur la page sans restriction. Pour plus d'informations, consultez la FAQ . Vous pouvez également charger le script de manière asynchrone pour améliorer les performances.
+1 Tag
Pour rendre simple tag +1:
<G: plusone size = "tall" > </ g: plusone>
Vous pouvez aussi utiliser une balise HTML5 valide +1 en définissant l'attribut class à g-PlusOne , et précéder tous les attributs des boutons avec des données .
<Div class = "g-PlusOne" data-size = "grand" ... > </ div>
Par défaut, le script inclus traversera les DOM et rendre +1 balises sous forme de boutons. Vous pouvez améliorer le temps de rendu sur de grandes pages en utilisant le API JavaScript pour parcourir un seul élément dans la page, ou de rendre un élément spécifique comme un bouton +1.
Asynchronous JavaScript chargement
inclusion asynchrone permet à votre page Web pour continuer le chargement tandis que votre navigateur récupère le fichier +1 JavaScript. En chargeant ces éléments en parallèle, vous vous assurez que le chargement bouton +1 fichier JavaScript n'augmente pas le temps de chargement.
Pour inclure le bouton +1 JavaScript asynchrone, utilisez le code suivant:
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
Astuce: Pour de meilleures performances, placez ce code immédiatement après la dernière balise +1.
Si vous souhaitez définir les paramètres des balises de script , utilisez la syntaxe suivante:
fenêtre . ___gcfg = {
lang : 'zh-CN » ,
parsetags : «onload '
};
Un exemple complet est inclus dans les exemples .
Configuration
Définition de l'URL cible +1
L'URL qui est +1' d est déterminé dans l'ordre suivant:
1. L'attribut href du bouton
Cet attribut définit explicitement l'URL cible +1.
2. De la page <link rel = "canonical" ... /> balise
Si l'attribut href du bouton +1 n'est pas fourni, Google utilise l'URL de la page canonique. Pour plus d'informations sur la définition de l'URL canonique pour une page, consultez cet article d'aide .
3. L'URL fournie par document.location.href , qui n'est pas recommandé.
Si aucun de ces éléments sont présents, Google utilise l'URL de la page que l'on trouve dans les DOM. Parce que cette URL peut contenir des identifiants de session, des ancres, ou d'autres paramètres qui ne sont pas réellement partie de l'URL canonique, nous recommandons fortement ce soit le réglage de la href attribut pour le bouton +1 ou en ajoutant un <lien rel="canonical" ...> tag à votre page.
Note: Le +1 est une action publique et doit être exécuté sur une URL publique. Si vous tentez d'+1 une URL qui n'est pas public, une erreur se produit.
paramètres des balises de script
Ces paramètres sont définis dans le <script /> élément. Les paramètres contrôlent la langue et le mécanisme de chargement de bouton qui sont utilisés dans la page Web entière.
Key Valeur Par défaut Description
lang code de langue fr-fr Définit la langue à utiliser pour les boutons +1 sur la page. Par disponibles code de langue valeurs, voir la liste des codes de langue pris en charge et un lang exemple .
parsetags explicite, onload onload Définit le mécanisme de chargement à utiliser.
onload
Tous les boutons +1 sur cette page sont automatiquement rendus après chargement de la page. Voir l' exemple de chargement asynchrone .
explicite
+1 Boutons sont rendus uniquement pour les appels explicites à gapi.plusone.go ou gapi.plusone.render .
Lorsque vous utilisez l' explicite charge en conjonction avec aller et rendre les appels qui pointent vers des conteneurs spécifiques dans votre page, vous empêcher le script de traverser l'ensemble du DOM, ce qui peut améliorer bouton temps de rendu. Voir le gapi.plusone.go et gapi.plusone.render exemples.
+1 Attributs de la balise
Ces paramètres contrôlent les paramètres de chaque bouton. Vous pouvez configurer ces paramètres comme attribut = valeur sur le bouton +1 balises , ou que JavaScript clé: valeur paires dans un appel à gapi.plusone.render .
Cette fonctionnalité est actuellement en avant-première plate-forme .
Attribuer Valeur Par défaut Description
href URL à +1 page courante URL Définit l'URL de +1. Définissez cet attribut lorsque vous avez un bouton +1 à côté d'une description de l'article dans une autre page et que vous voulez le bouton +1 à la page référencée et non la page courante. Si vous définissez cet attribut en utilisant gapi.plus.render , vous devriez ne devriez pas échapper à l'URL.
taille
faible
moyenne
norme
haut
norme Définit la taille du bouton +1 à rendre. Voir la taille des boutons pour plus d'informations.
annotation
aucun
bulle
inline
bulle Définit l'annotation à afficher à côté du bouton.
aucun
Ne pas rendre annotations supplémentaires.
bulle
Afficher le nombre d'utilisateurs qui ont +1' d la page dans un graphique à côté du bouton.
inline
Afficher photos de profil des utilisateurs connectés qui ont +1' d la page et le nombre d'utilisateurs qui ont +1' d la page.
largeur int - Si annotation est réglé sur « inline », ce paramètre définit la largeur en pixels à utiliser pour le bouton et son annotation en ligne. Si la largeur est omis, un bouton et ses inline utilisation 450px d'annotation.
Voir largeurs annotation Inline pour des exemples de la façon dont l'annotation est affichée pour divers paramètres de largeur.
aligner
à gauche
droite
à gauche Définit l'alignement horizontal des actifs du bouton dans son cadre.
Agrandirpour liste séparée par des virgules
supérieur
droite
inférieur
à gauche
liste vide
Définit les positions préférées à afficher vol stationnaire et les bulles de confirmation, qui sont par rapport au bouton. Définissez ce paramètre si votre page contient certains éléments, tels que des objets Flash, qui pourraient interférer avec le rendu des bulles.
Par exemple, en haut affichera le vol stationnaire et les bulles de confirmation au-dessus du bouton.
S'il est omis, la logique de rendu devinera la meilleure position, généralement défaut au-dessous du bouton en utilisant le bas valeur.
callback fonction (jsonParam) - S'il est spécifié, cette fonction est appelée lorsque l'utilisateur clique sur le bouton +1. La fonction de rappel doit être dans l'espace de noms global et accepter un seul paramètre, ce qui est un objet JSON avec la structure suivante:
{
"Href": URL cible ,
"Etat": "on" | "off"
}
L' état des biens est réglé sur " sur "un +1, et" off "pour le retrait d'un +1.
onstartinteraction fonction (jsonParam) -
S'il est spécifié, cette fonction est appelée, soit quand un vol stationnaire écrans de bulles, qui est causée par l'utilisateur passant la souris sur le bouton +1, ou quand une confirmation s'affiche à bulles, qui est causée par le +1' utilisateur tion la page. Vous pouvez utiliser cette fonction de rappel pour modifier votre page, comme une pause d'une vidéo lorsque la bulle apparaît.
Cette fonction doit être dans l'espace de noms global et accepter un seul paramètre, qui est un objet JSON avec la structure suivante:
{
"Id": URL cible ,
"Type": hover | confirm
}
onendinteraction fonction (jsonParam) -
S'il est spécifié, cette fonction est appelée lorsque l'un hover ou bulle de confirmation disparaît. Vous pouvez utiliser cette fonction de rappel pour modifier votre page, comme la reprise d'une vidéo lorsque la bulle se ferme.
Cette fonction accepte un seul paramètre, qui est identique dans sa structure au paramètre passé à onstartinteraction .
recommandations vrai faux vrai Pour désactiver l'affichage des recommandations dans le hover bulle +1, mis recommandations à faux .
dénombrer vrai faux vrai Obsolète: Pour désactiver l'affichage du compteur, utilisez annotation = "none" .
taille des boutons
La spécification d'une hauteur qui est plus petite que la plus petite hauteur de rendu soutenu que la hauteur plus petite charge. D'autres hauteurs rendent sur le bouton qui s'insère verticalement et centre cette icône dans l'espace requis. Si l'espace est suffisant horizontalement, les petites et standards boutons rendent le nombre total de +1' s pour cette page.
Type de bouton (annotation) Exemple Largeur (px) Largeur maximum (px) Hauteur (px)
Petit (aucun) 24 - 15
Petit (bulle) - 70 15
Medium (aucun) 32 - 20
Medium (bulle) - 90 20
Standard (aucun) 38 - 24
Standard (bulle) - 106 24
Grand (aucun) 50 - 20
Grand (bulle) 50 - 60
Largeurs d'annotation Inline
L'affichage des annotations dans le texte varie en fonction de la valeur de la largeur de paramètre.
Si le paramètre de largeur n'est pas spécifié, un bouton +1 et son annotation en ligne utilisent une largeur de 450px.
L'annotation en ligne nécessite un minimum de 120px à afficher. Des valeurs inférieures sont automatiquement redimensionnées. La largeur minimale recommandée est de 250px.
Pour d'autres largeurs, l'affichage de inline photos de profil et le texte variera en fonction de la largeur définie, comme le montrent les exemples ci-dessous.
Largeur +1 Button (www.google.com)
250px
300px
350px
indéterminée (450px)
Remplissage de la Snippet +
Après avoir cliqué sur le bouton +1, l'utilisateur a la possibilité de partager la page Google+ via un affichage bulle d'actions . Cette bulle d'actions avec l'activité Google+ poste résultant comprend un aperçu, ou + Snippet , qui contient le titre de la page, une brève description de la page, et une image miniature. Ces ensembles de données sont extraites du contenu trouvé à l' URL cible et peut être facilement spécifiée par l'éditeur de contenu.
Pour plus d'informations et de personnaliser votre propre code, voir la documentation de code .
API JavaScript
Le bouton +1 JavaScript définit deux fonctions bouton-rendu sous la gapi.plusone espace de noms. Vous devez appeler une de ces fonctions si vous désactivez le rendu automatique en réglant parsetags à " explicite ".
Méthode Description
gapi . PlusOne . rendre (
conteneur ,
paramètres
) Rend le conteneur spécifié comme un widget +1 bouton.
conteneur
Le conteneur est rendu comme le bouton +1. Spécifiez l'ID du conteneur (string) ou de l'élément DOM lui-même.
paramètres
Un objet contenant une attributs de la balise que des paires de clés de valeur =, par exemple, {"taille": "grand", "rappel": myCallbackFunction} .
gapi . PlusOne . go (
opt_container
) Rend tout +1 balises et des classes dans le conteneur spécifié. Cette fonction devrait être utilisée uniquement si parsetags est réglé explicite , que vous pourriez faire pour des raisons de performances.
opt_container
Le récipient contenant le bouton +1 balises à rendre. Spécifiez l'ID du conteneur (string) ou de l'élément DOM lui-même. Si le opt_container paramètre est omis, toutes les balises +1 sur cette page sont rendus.
Exemples
Page simple
<html>
<head>
<title> +1 démo: Basic
Charge explicite
<html>
<head>
<title> +1 démo: Explicite
Rendre explicite
<html>
<head>
<title> +1 Démo: Explicite
le bouton +1 </ a>
<div id = "PlusOne-div" > </ div>
</ body>
</ html>
Charge Asynchrone
<html>
<head>
<title> +1 Démo: Async
Foire aux questions
L'accord FAQ ci-dessous avec les considérations techniques et les détails de mise en œuvre. Pour obtenir des ressources supplémentaires, consultez la FAQ générale et le forum de discussion de la plate-forme .
Puis-je placer plusieurs boutons sur une seule page que tout +1 URL différente?
Oui. Utilisez le href attribut tel que spécifié dans une paramètres de la balise pour indiquer l'URL à être +1' d.
Où dois-je placer le bouton +1 sur mes pages?
Vous connaissez votre page et vos utilisateurs le meilleur, c'est pourquoi nous recommandons de mettre la touche où vous pensez qu'il sera le plus efficace. Dessus du pli, près du titre de la page et près de partage de liens est souvent un bon emplacement. Il peut également être efficace pour placer le bouton +1 à la fin d'un article ou une histoire ainsi que le début.
Yat-il un impact sur la latence de la position de la <script> tag dans la page?
Non, il n'y a pas d'impact de la latence importante de la mise en place du <script> tag. Toutefois, en plaçant l'étiquette au bas du document, juste avant la balise de fermeture de corps, vous pouvez améliorer la vitesse de chargement de la page.
Le <script> étiquette doivent être inclus avant la balise +1?
Non, la <script> balise peut être incluse n'importe où dans la page.
Le <script> étiquette doivent être inclus avant qu'une autre <script> tag appelle l'une des méthodes dans le API JavaScript section?
Oui, si vous utilisez des API JavaScript méthodes, ils doivent être placés dans la page après la <script> inclusion.
Qu'advient-il si je +1 une URL privée?
Le bouton ne fonctionnera pas. Seul le travail de +1' pour les URL public.
Dois-je utiliser le href attribut?
Le href attribut n'est pas obligatoire. Voir +1 URL cible pour plus d'informations
Fais tout mes pages besoin d'avoir un rel = "canonical" tag?
Non, mais nous le recommandons. Si le href attribut n'est pas défini, Google va ensuite chercher le rel = "canonical" tag sur la page. Si ce n'est pas trouvé, Google va utiliser le document.location.href . Cette dernière valeur peut parfois être trompeuse en raison de variables d'état souvent conservés dans l'URL. Ainsi, en utilisant un rel = "canonical" tag peut vous aider à spécifier l'URL exacte que vous voulez +1' d.
Certains de mes utilisateurs obtenir un avertissement de sécurité quand ils voient les pages avec le bouton +1. Comment puis-je me débarrasser de cela?
Le code du bouton +1 nécessite un script depuis les serveurs de Google. Vous pouvez obtenir cette erreur en incluant le script via http:// sur une page qui est chargé par https:// . Nous vous recommandons d'utiliser https:// pour inclure le script:
<Scénario de type = "text / javascript" src = "https://apis.google.com/js/plusone.js" > </ script>
Si votre page Web utilise https:// , certains navigateurs et les outils de vérification montreront une erreur lors d'actifs sur cette page sont appelées par http:// . Si votre site sert pages par https:// , assurez-vous que le code du bouton +1 sur les pages utilise également https:// . (En fait, il est bon d'utiliser https:// dans le code du bouton pour toutes les pages, même si elles ne sont servis par http:// .)
Puis-je suivre le bouton +1 interactions avec Google Analytics?
Oui, la dernière version de Google Analytics effectue automatiquement tous les boutons +1 interactions sans aucune modification à votre code de suivi. Vous pouvez afficher les mesures d'ordre social avec des rapports en vertu Visiteurs> Social . En savoir plus sur le propos de Social Plug-in Analytics page Centre d'aide.
Pourquoi la bulle hover est coupée par le contenu Adobe Flash?
Par contenu Flash par défaut rend surtout autre contenu HTML. Cela comprend les bulles de survol et d'autres contenus rendue par le bouton +1. Cela pourrait entraîner une certaine +1 contenu bouton apparaissant à être coupée par des éléments Adobe Flash dans votre page.
La solution dépend de votre situation. Si vous ne pouvez éditer le code source HTML de l'objet Flash sur votre page, vous pouvez simplement ajouter une propriété à l'élément objet. Toutefois, si l'élément flash est ajouté à votre page par un script (comme c'est le cas typique d'annonces), vous aurez besoin d'une solution plus sophistiquée.
Tout d'abord, si vous avez accès au code source HTML de l'objet Flash sur votre page, vous devez définir le wmode paramètre ' transparent '. Vous pouvez le faire en ajoutant un paramètre à l'élément de l'objet Flash:
<Object ... >
<param nom = "wmode" valeur = "transparent" >
... </ object>
Pour les autres cas, où l'élément Flash n'est pas ajoutée par un script, vous pourriez encore être en mesure de résoudre ce problème. Vous pouvez ajouter par programme le paramètre décrit ci-dessus en utilisant JavaScript. FlashHeed est un exemple de cette technique. Cela ne fonctionnera tant que le flash n'est pas incorporé dans une iframe. Si l'élément Flash n'est pas à l'intérieur d'un iframe, vous devez repositionner soit le contenu Flash ou le bouton +1 pour éviter un chevauchement.
Je mets mon code du bouton +1 dans une iframe. Pourquoi le dialogue social étant coupée dans certains navigateurs web?
Lorsque vous cliquez sur le bouton +1, nous affichons un dialogue social. Ce dialogue est beaucoup plus grande que le bouton +1 elle-même. Pour cette raison, si vous mettez +1 code du bouton dans un iframe qui est plus petit que le dialogue social, les parties du dialogue social peuvent être coupés et deviennent inaccessibles aux utilisateurs.
Pour contourner cela, il est préférable d'inclure directement le bouton +1 Code source dans vos pages. Si vous devez utiliser une iframe pour envelopper le bouton +1, assurez-vous qu'il ya suffisamment d'espace pour le dialogue social.
J'ai mis le l'alignement de mon bouton de droite , mais le bouton n'est pas aligné à droite sur la page.
Si align = "right" est réglé, Google va droit aligner les actifs de bouton dans son cadre. Cependant, pour le bouton pour être aligné à droite sur votre page, vous devez définir l'alignement du conteneur de touche. Par exemple:
<Div style de = " float : droit " >
<g: plusone aligner = "right" > </ g: plusone>
</ div>
Les recommandations contenues dans le +1 hover ne sont pas appropriés pour mon site, comment puis-je les supprimer?
Veuillez nous faire savoir pourquoi les recommandations ne fonctionnent pas sur votre site afin que nous puissions améliorer le produit et améliorer l'expérience de votre site web. Si vous devez désactiver ces recommandations, vous pouvez définir les recommandations attribuent à faux sur le tag +1.
Quels sont les navigateurs pris en charge?
Tous les plugins Google+ supportent les mêmes navigateurs Web comme interface web Google+ :
Fenêtres: Chrome, Firefox 3.6 et plus, Internet Explorer 8 et plus
Linux: Chrome, Firefox 3.6 et plus
Mac: Chrome, Firefox 3.6 et plus, Safari 4 et jusqu'à
Codes de langue
Langue Valeur
Afrikaans af
Amharique h
Arabe ar
Basque eu
Bengali bn
Bulgare bg
Catalan ca
Chinois (Hong Kong) zh-HK
Chinois (simplifié) zh-CN
Chinois (Traditionnel) zh-TW
Croate hr
Tchèque cs
Danois da
Néerlandais nl
English (UK) fr-FR
English (US) fr-fr
Estonien et
Filipino Fil
Finnish fi
Français fr
Français (Canadien) fr-CA
Langue Valeur
Galicien gl
Allemand de
Grecque el
Gujarati gu
Hébreu iw
Hindi salut
Hongrois hu
Islandais est
Indonésien Identifiant
Italien cela
Japonais ja
Kannada kn
Corée ko
Letton lv
Lituanien lt
Malay ms
Malayalam ml
Marathi mr
Norwegian pas
Persique FA
Polonais pl
Langue Valeur
Portugais (Brésil) pt-BR
Portugais (Portugal) pt-PT
Roumain ro
Russie ru
Serbe sr
Slovaque sk
Slovène sl
Espagnol es
Espagnol (Amérique Latine) ES-419
Swahili sw
Swedish sv
Tamil TA
Telugu te
Thai e
Turque tr
Ukrainienne Royaume-Uni
Urdu ur
Vietnamien vi
Zulu zu
Sauf mention contraire, le contenu de cette page est sous licence Commons License 3.0 Attribution créative , et des exemples de code sont sous la licence Apache License 2.0 . Pour plus d'informations, consultez nos Politiques du site .
Dernière mise à jour 3 Juillet 2013.
GoogleConditions d'utilisationPolitique de confidentialitéOffres d'emploiRapporter un bug
Anglais
id:[djouko972 https://docs.google.com/file/d/0B74GQgH9cyVFMFdDRW5wU0g5STQ/preview
