À l'aide de “share_open_graph” Facebook de l'INTERFACE utilisateur pour créer des dynamiques de dialogue partager pour les résultats du quiz
Résumé: Mon problème est d'obtenir FB.l'interface utilisateur, via le share_open_graph méthode, afin de créer un personnalisé, partage de dialogue qui contient le titre, la description et la photo, basée sur les actions de l'utilisateur sur la page.
La question a été mon premier et je n'avait pas la réputation, de sorte que de nombreux liens ont été retirés, mais (merci à tous ceux qui m'ont donné upvotes) j'ai été en mesure de sauver les captures d'écran qui ont été à l'origine manquante.
EDIT: j'ai fini par l'avoir à l'utiliser régulièrement une fenêtre pop-up avec une part de dialogue, ce n'est pas l'idéal, mais au moins il fonctionne de manière fiable. Plus j'ai regardé partout sur le web, plus je trouve que beaucoup de haut profil respectable sites étaient encore à l'aide contextuelle de partage comme ça, alors j'ai pensé que dans ce cas, les avantages de l'utilisation d'un héritage de la solution de l'emportaient sur le travail considérable pour trouver une solution adéquate, j'ai utilisé https://developers.facebook.com/docs/sharing/reference/feed-dialog/v2.2 avec des détails dynamiques fournis via l'URL de la requête qui est au moins légèrement plus up-to-date de l'sharer.php l'utilisation j'ai été à l'origine regardant sur Buzzfeed.
Ma page:
J'ai un quiz. Dix questions, cinq réponses à chacune, un résultat est produit l'attribution de l'une des cinq options comme le "résultat". Tout autant, le quiz de grandes œuvres. Le résultat est tirée vers l'arrière lorsque le questionnaire est rempli par Ajax/jQuery - c'est ainsi que, dans le futur, je vais être en mesure de construire un PHP front-end pour d'autres personnes pour gérer la création de questionnaires.
Alors que j'ai été heureux de fournir l'URL de la page dans le code ci-dessous, mais désolé, j'ai corrigé ce problème je ne peux pas le publier publiquement, de sorte que vous ne pouvez pas y accéder!
Mon objectif:
Lorsque le résultat du test est indiqué, il doit également avoir Facebook et Twitter des boutons de partage qui ont été personnalisés pour inclure une image, le titre et la description qui est approprié à l'utilisateur de résultats du quiz.
Bouton Twitter est facile de le faire de manière dynamique
Je viens d'utiliser jQuery pour créer un bouton Twitter en utilisant le même code HTML, comme on le ferait de n'importe où, avec ma dynamique description fournie que la data-text
de la propriété, et ensuite appeler twttr.widgets.load();
pour activer le bouton.
Le Facebook bouton de Partage est le problème
- Je ne peux pas ajouter un "normal" bouton partager, il suffit d'une propriété, l'URL (ne pas changer selon les résultats du questionnaire).
- Je ne peux pas changer le générique de l'Open Graph tags qui existent sur la page d'accueil - bien que jQuery ce faire, Facebook cache signifie qu'il est inutile. Plus le générique boutons de partage (FB/Twitter/G+) sur chaque page doit rester inchangée et toujours la valeur par défaut OG balises.
Donc ce que je suis en train de faire est de créer un lien et d'ajouter à la page avec jQuery, et de définir ensuite cliquez sur le déclenchement de l'action avec jQuery trop. L'ID de l'application est déjà implanté avec succès avec la FB.init() bloc de code. Ce sont les méthodes que j'ai essayé pour la cliquez de déclenchement:
Tentative 1: FB.ui({ method: "feed" })
FB.ui({
method: 'feed',
name: "I got "+response.country+"! Which European are you destined to date?",
link: "http://advice.uk.match.com/quizzes/which-european-are-you-destined-date",
picture: response.image,
description: response.body
});
Les bases de travail de l'image, le titre et la description sont tous en accord avec les résultats du questionnaire (dans ce cas "à la française") - MAIS l'Alimentation boîte de dialogue n'est pas seulement obsolète, mais aussi très inférieure à la Part de la boîte de dialogue (voir ci-dessous). J'aimerais faire cela correctement.
Tentative 2: FB.ui({ method: "share" })
FB.ui({
method: 'share',
href: "http://advice.uk.match.com/quizzes/which-european-are-you-destined-date",
name: "I got "+response.country+"! Which European are you destined to date?",
picture: response.image,
description: response.body
});
La Dialogue partager est en cours, et vous pouvez voir les améliorations en matière de conception et de fonctionnalité par rapport à l'déconseillé de Nourrir le dialogue. Mais dans cette utilisation, il est comme un bouton partager, et malgré mes tentatives pour fournir des informations supplémentaires uniquement l'URL est utilisée et le générique de l'Open Graph tags de la page de fournir le contenu.
Tentative 3: FB.ui({ method: "share_open_graph" })
Ce qui semble être celui que je doit utiliser. J'ai juste besoin de travailler sur la façon!
* J'ai ajouté: "quiz", comme un type d'objet à mon application (nom: matchadviceuk).
* J'ai ajouté: "Partager un questionnaire" comme une histoire de type de mon application basée sur le "quiz" et les "Partager" type d'action.
* J'ai ajouté: le Open Graph prefix=""
contenu de mon <head>
déclaration
La fonction de clic sur le bouton ressemble maintenant à:
FB.ui({
method: 'share_open_graph',
action_type: 'matchadviceuk:share',
action_properties: JSON.stringify({
type: 'matchadviceuk:quiz',
url: "http://advice.uk.match.com/quizzes/which-european-are-you-destined-date",
title: "I got "+response.country+"! Which European are you destined to date?",
description: response.body,
image: response.image
})
});
Sur cliquez sur ce produit:
J'ai donc changé url
dans le code ci-dessus pour quiz
et j'obtiens:
C'est de commencer à faire sens - la page elle-même EST un article, et non, ce ne peut pas changer. Alors peut-être que je ne veux pas utiliser cette nouvelle "questionnaire" type d'objet à tous. Mais si je rentre dans le bloc au-dessus et juste changer type
à matchadviceuk:article
, on obtient la même erreur à propos de "quiz" n'étant pas défini à ce stade, cela fait zéro sens que ce soit, comme le "questionnaire" type d'objet est maintenant pas mentionné nulle part dans le code! (Possible victime de Facebook la mise en cache, ce qui est une complication supplémentaire.)
Et c'est là que je suis bloqué au-delà de toute autre idée. J'ai même essayé de supprimer type
et url
attributs entièrement, en espérant que Facebook pourrait faire sa propre chose, mais non.
Je ne suis pas encore convaincu que mes efforts pour ajouter un objet de type et d'histoire type de mon application est même nécessaire, mais de toute façon, j'ai juste ne peut pas obtenir ce travail. S'il vous plaît aider!
Comparer à:
C'est Buzzfeed qui font ce type de quiz de beaucoup, et en fait ils font un bodge travail à l'aide d'un Facebook sharer.php lien avec la dynamique du contenu fourni dans le cadre de la chaîne de requête d'URL, et en les forçant à s'ouvrir dans une nouvelle fenêtre manuellement. C'est moche, pas "officielle", pas facile, et j'ose dire que, éventuellement, présente des problèmes sur mobile et tablette navigation. Pour toutes ces raisons, je préfèrerais le faire correctement avec FB.interface utilisateur - et non seulement cela, mais sharer.php est dans un flux constant de "est-il ou n'est-il pas obsolète?", et même l'officiel FB développeur ligne (ne pouvez pas ajouter de lien à cause de pas de réputation) - est qu'il ne fonctionne pas comme cela pour longtemps.
De recherche:
J'ai fait des tonnes de recherches sur Google et de Débordement de Pile dans la recherche. Rien ne correspond à mon problème (ce qui m'étonne, mais je n'ont plus de limites comme devoir de faire tout ce traitement de manière dynamique, sans séparer PHP-infusé sur les pages de résultats). Cette question est le seul résultat sur DONC, pour "share_open_graph" et crée un objet avec FB.api et publie ensuite avec FB.ui - sons bien mis à part le fait que ce produit plusieurs postes pour le flux de l'utilisateur, ce qui se traduirait par une interdiction de Facebook. Cet utilisateur a été en mesure de s'appuyer sur PHP où j'ai besoin de la pure interactivité côté client.
- Je vais essayer de trouver cela trop. J'ai seulement trouvé le share_open_graph méthode. Pouvez-vous expliquer OÙ vous avez trouvé les actions disponibles pour cette méthode? Le FB de l'aide semble très clairsemée.
- Hey moosefetcher. En dehors de la Partager la page de boîte de dialogue qui est déjà lié, le OG actions page c'est la seul chose que j'ai trouvé jusqu'à présent. Plus j'y pense plus il va exiger l'inscription d'un Objet avec Facebook, comme décrit ici mais je ne sais pas si je dois manuellement en faire un pour chaque quiz de résultat ou de ces créé dynamiquement à chaque fois
- C'est le point de moi depuis le fasse. Je ne comprenais pas comment configurer l'objet correctement. J'ai remarqué que, dans la liste des 'histoires' impliquant mon action personnalisée, celui qui a utilisé l'objet.le titre était prometteur quant à la configuration de son titre pour le texte j'aurais besoin de combler cette lacune. c'est à dire, le titre de propriété peut être définie pour inclure le score, peut-être. Comment je pourrais faire pour avoir le titre, je ne sais pas...
- Coincé sur exactement le même problème ici. Facebook de la documentation est un gâchis. Je ne peux pas trouver quelque chose d'utile. Le dénigrent une méthode de "nourrir" qui a travaillé de nice et de la remplacer par une autre avec les très pauvres de l'aide et de la documentation.
- jetez un oeil à ce que j'ai fait. J'ai envoyé l'url, l'url de l'image, la description et le titre que je voulais partagé par l'utilisateur et de mettre ces paramètres dans une url que les actions des utilisateurs. Cette url se prend les paramètres et les met dans la og de balises meta. Je vais avoir quelques problèmes avec mon code si. Si quelqu'un peut aider, nous pouvons obtenir l'information la plus à jour de la solution pour ce problème. lien: stackoverflow.com/questions/28751908/...
Vous devez vous connecter pour publier un commentaire.
Je l'ai fait avec
share_open_graph
méthode avec un objet comme ça,,Vous étiez ici. Après que je suis allé à la page modèle référencé en " url " paramètre de 'action_properties" et ajouté
Dans votre cas, il serait
C'est tout, le partage via FB.interface fonctionne
Bien sûr au développement de votre serveur doit avoir adresse http externe (j'utilise http://ngrok.com pour de telles choses)
Edit: de toute façon, vous devez ajouter un paramètre supplémentaire à l'url selon qui peuplent les données spécifiques dans og:title, og:description, og:image meta tags sur la page, car il ne semble pas que le titre, la description et les paramètres de l'image dans action_properties vraiment travailler, par exemple,
J'ai eu un problème similaire et le détail de votre question m'a beaucoup aidé à trouver une solution, merci de mettre là-bas.
Que vous vous suggère de créer des actions personnalisées et la coutume liée à l'objet de l'action dans les paramètres de l'application dans FB. Dans votre cas, l'action est "partager" et l'objet est "quiz". Et vous devriez avoir une histoire comme "John Doe partagée d'un questionnaire par le biais de Certains super-app".
Dans votre code JS vous dit en gros à Facebook cette histoire.
Vous déjà dit FB que votre histoire a le "test" de l'objet, avec le "partage" de l'action. Alors d'abord vous dire où ce "test" objet.
Maintenant FB sait où ce "test" objet. La prochaine étape est d'avoir un "test" de l'objet à cet endroit. Vous pouvez créer un code HTML ou PHP de la page à l'URL. C'est un page HTML avec des balises meta. Ces balises meta rend votre page pour être reconnu comme un "test" de l'objet. Ci-dessous est un exemple de code HTML et commentaires:
Maintenant le code HTML (ou PHP) de la page à cette adresse URL est reconnu comme un "test" de l'objet par FB.
Dans mon cas, j'avais besoin de passer des variables à part la boîte de dialogue de bien. J'ai donc utilisé une page PHP que l'objet. JS-je faire un appel avec une ligne de la requête et de lire que les paramètres GET dans mon PHP. si le JS devient comme:
Et fichier PHP est quelque chose comme
J'espère que cette aide.
Cheers!
<meta property="og:type" content="myCustomObject">
metatag. Ce peut être parce que je suis simplement à l'aide d'un objet sur la page, mais juste un avis.l'objet doit être, ainsi, un objet
J'ai exactement le même problème. Fini par avoir à utiliser FB.api au lieu de FB.l'interface utilisateur
Il y a un exemple ici, où il est utilisé pour poster un og:aime l'action:
https://developers.facebook.com/docs/opengraph/getting-started
Vous suffit de personnaliser l'action et l'objet de poster votre propre histoire.
Pour moi, le problème, c'est qu'il poste sans leur demander d'abord avec une fenêtre pop-up comme la façon conventionnelle de boutons de partage de travail.