Bouton de partage Facebook et texte personnalisé

Question

Existe-t-il un moyen de créer un bouton de partage facebook qui affiche un texte personnalisé sur le mur ou le fil d'actualité ?

Answer 1

Nous utilisons quelque chose comme ça [utiliser en une seule ligne] :

<a title="send to Facebook" 
  href="http://www.facebook.com/sharer.php?s=100&p[title]=YOUR_TITLE&p[summary]=YOUR_SUMMARY&p[url]=YOUR_URL&p[images][0]=YOUR_IMAGE_TO_SHARE_OBJECT"
  target="_blank">
  <span>
    <img width="14" height="14" src="'icons/fb.gif" alt="Facebook" /> Facebook 
  </span>
</a>

Answer 2

Pour donner des paramètres personnalisés au partage facebook, il est préférable de ne donner que le lien et facebook reçoit le sien. Titre + Description + Image automatiquement à partir de la page que vous partagez. Pour "aider" l'API de Facebook à trouver ces éléments, vous pouvez placer les éléments suivants dans l'en-tête de la page que vous partagez :

<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />

Vérifiez ici

Si la page n'est pas sous votre contrôle, utilisez ce qui suit AllisonC a partagé ci-dessus.

Pour un comportement de type popup modalview :

Utilisez votre propre bouton/lien/texte et vous pouvez ensuite utiliser une fenêtre contextuelle de type "vue modale" de cette manière :

<script type= 'text/javascript'>
$('#twitterbtn-link,#facebookbtn-link').click(function(event) {
var width  = 575,
    height = 400,
    left   = ($(window).width()  - width)  / 2,
    top    = ($(window).height() - height) / 2,
    url    = this.href,
    opts   = 'status=1' +
             ',width='  + width  +
             ',height=' + height +
             ',top='    + top    +
             ',left='   + left;

window.open(url, 'twitter', opts);

return false;
});
</script>

où twitterbtn-link et facebookbtn-link sont tous deux des identifiants d'ancres.

Answer 3

Utiliser cette fonction dérivée du lien fourni par IJas

function openFbPopUp() {
    var fburl = '';
    var fbimgurl = 'http://';
    var fbtitle = 'Your title';
    var fbsummary = "your description";
    var sharerURL = "http://www.facebook.com/sharer/sharer.php?s=100&p[url]=" + encodeURI(fburl) + "&p[images][0]=" + encodeURI(fbimgurl) + "&p[title]=" + encodeURI(fbtitle) + "&p[summary]=" + encodeURI(fbsummary);
    window.open(
      sharerURL,
      'facebook-share-dialog', 
      'width=626,height=436'); 
    return  false;
}

Vous pouvez également utiliser la dernière version de FB.ui Function si vous utilisez FB JavaScript SDK pour une fonction de rappel plus contrôlée.

référer : FB.ui

    function openFbPopUp() {
        FB.ui(
          {
            method: 'feed',
            name: 'Facebook Dialogs',
            link: 'https://developers.facebook.com/docs/dialogs/',
            picture: 'http://fbrell.com/f8.jpg',
            caption: 'Reference Documentation',
            description: 'Dialogs provide a simple, consistent interface for applications to interface with users.'
          },
          function(response) {
            if (response && response.post_id) {
              alert('Post was published.');
            } else {
              alert('Post was not published.');
            }
          }
        );
    }

Answer 4

Vous avez plusieurs possibilités :

1. Utilisez le bouton de partage FB standard et définissez le texte via API Open Graph et les métabalises sur votre page.
2. Au lieu de Partager, utilisez FB.ui Cette méthode vous permet de contrôler l'URL, le titre, la légende, la description et la vignette au moment de l'exécution.
3. Ou utilisez http://www.facebook.com/sharer.php avec les paramètres appropriés.

Answer 5

Vous pouvez personnaliser la boîte de dialogue de partage de Facebook en utilisant le kit de développement JavaScript asynchrone fourni par Facebook et en définissant les valeurs de ses paramètres.

Jetez un coup d'œil au code suivant :

<script type="text/javascript">
  $(document).ready(function(){
    $('#share_button').click(function(e){
      e.preventDefault();
      FB.ui(
        {
          method: 'feed',
          name: 'This is the content of the "name" field.',
          link: 'URL which you would like to share ',
          picture: ‘URL of the image which is going to appear as thumbnail image in share dialogbox’,
          caption: 'Caption like which appear as title of the dialog box',
          description: 'Small description of the post',
          message: ''
        }
      );
    });
  });
</script>

Avant de copier et coller le code ci-dessous, vous devez d'abord initialiser le SDK et configurer la bibliothèque jQuery. S'il vous plaît cliquez ici pour connaître une étape par étape comment définir l'information sur le même.