Versions Compared

Old Version 3

changes.mady.by.user Manon Stremplewski

Saved on

compared with

New Version 4

changes.mady.by.user Manon Stremplewski

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
<script>
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.0";
        fjs.parentNode.insertBefore(js, fjs);
    }
    (document, 'script', 'facebook-jssdk'));
</script>

...

Facebook (post)

Intégration

Balises Balise à intégrer dans le site, à l’endroit où le service doit s’afficher.

Réglages pour la classe g-plusone :

...

data-size : small, medium, tall ou rien

...

data-annotation : inline, none ou rien

...

Code Block
<div class="tac_facebookpost" data-appId="<votre identifiant d'application>" data-url="<votre url>"
    width="<votre largeur>" height="<votre hauteur>"></div>

Marqueur originel

A supprimer si installé.

Code Block
<iframe allowtransparency="true" scrolling="auto"
    src="https://www.facebook.com/plugins/post.php?href=<votre url>&amp;width=<votre largeur>&amp;show_text=false&amp;appId=<votre identifiant d'application>&amp;height=<votre hauteur>"></iframe>

Google+

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

Réglages pour la classe g-plusone :

  • data-size : small, medium, tall ou rien

  • data-annotation : inline, none ou rien

  • data-width : largeur en pixels

Réglages pour la classe g-plus :

...

Code Block
<div class="g-plus" data-action="share" data-annotation="vertical-bubble" data-height="60"></div>

Marqueur originel

A supprimer si installé.

Code Block
<script src="https://apis.google.com/js/platform.js" async defer> {lang: 'fr'} </script>

Google+ (badge)

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

  • class : g-page ou g-person

  • data-layout : landscape (format paysage) ou rien (format portrait)

  • data-theme : dark (thème sombre) ou rien

  • data-width : largeur en pixels

  • data-href : URL Google+

  • data-showtagline : true (afficher la description) ou false (ne pas l’afficher)

  • data-showcoverphoto : true (afficher la photo de couverture) ou false (ne pas l’afficher)

...

  • (ne pas l’afficher)

...

Code Block
<div class="g-page" data-theme="dark" data-href="//plus.google.com/u/0/<votre identifiant de page>" data-rel="publisher" data-showtagline="true" data-showcoverphoto="true"></div>

...

Code Block
<div class="g-pageperson" data-themelayout="darklandscape" data-href="//plus.google.com/u/0/<votre identifiant de page>" data-rel="author" data-showtagline="false" data-showcoverphoto="publisher" data-showtagline="true" data-showcoverphoto="true"></div>

...

"false"></div>

Marqueur originel

A supprimer si installé.

Code Block
<script src="https://apis.google.com/js/platform.js" async defer> {lang: 'fr'} </script>

Instagram

Intégration

Balise à intégrer dans le site, à l’endroit où le service doit s’afficher.

Code Block
<div class="g-person" data-layout="landscape" data-href="//plus.google.com/u/0/instagram_post" postID="<votre identifiant de page>" data-rel="author" data-showtagline="false" data-showcoverphoto="falsepost>"
    width="<votre largeur>" height="<votre hauteur>"></div>

Marqueur originel

A supprimer si installé.

Code Block
<script<iframe src="https://apiswww.googleinstagram.com/js/platform.js" async defer> {lang: 'fr'} </script><votre identifiant de post>/embed"
    width="<votre largeur>" height="<votre hauteur>" frameborder="0"></iframe>

LinkedIn

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<span class="tacLinkedin"></span>
<script type="IN/Share"></script>

Marqueur originel

A supprimer si installé.

Code Block
<script src="//platform.linkedin.com/in.js" type="text/javascript"> lang: en_US </script>

Pinterest

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<span class="tacPinterest"></span>
<a href="//www.pinterest.com/pin/create/button/" data-pin-do="buttonBookmark"
    data-pin-shape="round" data-pin-height="32"></a>

Marqueur originel

A supprimer si installé.

Code Block
<a href="//www.pinterest.com/pin/create/button/" data-pin-do="buttonBookmark">
    <img src="//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_gray_20.png" />
</a>
<script type="text/javascript" async src="//assets.pinterest.com/js/pinit.js"></script>

...

Identifiant de site : chaîne de caractères, identifiant fourni par le service.

Intégration

Balise à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<div class='shareaholic-canvas' data-app='share_buttons' data-app-id='<votre identifiant d'application>'></div>

Marqueur originel

A supprimer si installé.

Code Block
<script type="text/javascript">
    (function() {
        var shr = document.createElement('script');
        shr.setAttribute('data-cfasync', 'false');
        shr.src = '//dsms0mj1bbhn4.cloudfront.net/assets/pub/shareaholic.js';
        shr.type = 'text/javascript';
        shr.async = 'true';
        shr.onload = shr.onreadystatechange = function() {
            var rs = this.readyState;
            if (rs && rs != 'complete' && rs != 'loaded') return;
            var site_id = '<votre identifiant de site>';
            try {
                Shareaholic.init(site_id);
            }
            catch (e) {}
        };
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(shr, s);
    })();
</script>

...

Identifiant : chaîne de caractères, identifiant fourni par le service.

Intégration

Balise à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<span class="tacSharethis"></span><vos spans de services>

Marqueur originel

A supprimer si installé.

Code Block
<script type="text/javascript">
    var switchTo5x=true;
</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript">
    stLight.options({
        publisher: "<votre identifiant d'éditeur>",
        doNotHash: false,
        doNotCopy: false,
        hashAddressBar: false
    });
</script>

Twitter

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<span class="tacTwitter"></span>
<a href="https://twitter.com/twitter_username" class="twitter-follow-button" data-show-count="false"
    data-size="large" data-dnt="true"></a>

Marqueur originel

A supprimer si installé.

Code Block
<script>
    !function(d,s,id){
        var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
        if(!d.getElementById(id)){
            js=d.createElement(s);
            js.id=id;
            js.src=p+'://platform.twitter.com/widgets.js';
            fjs.parentNode.insertBefore(js,fjs);
        }
    }(document, 'script', 'twitter-wjs');
</script>

Twitter (cartes)

Intégration

Balises Balise à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<div class="twitterembed-canvas" tweetid="<votre identifiant de tweet>" data-width="<votre largeur>"
    theme="<light ou dark>" cards="<show ou hidden>" conversation="<show ou none>"
    data-align="<left, center ou right>"></div>

Marqueur originel

A supprimer si installé.

Code Block
<script>
    !function(d,s,id){
        var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
        if(!d.getElementById(id)){
            js=d.createElement(s);
            js.id=id;
            js.src=p+'://platform.twitter.com/widgets.js';
            fjs.parentNode.insertBefore(js,fjs);
        }
    }(document, 'script', 'twitter-wjs');
</script>

Twitter (fil d'actualités)

Intégration

Balises à intégrer dans le site, à l’endroit où le service doit s’afficher.

...

Code Block
<span class="tacTwitterTimelines"></span>
<a class="twitter-timeline" href="<votre URL twitter>" data-tweet-limit="<votre limite de tweets>"
    data-dnt="<true ou false>" data-width="<votre largeur>" data-height="<votre hauteur>"
    data-theme="<dark ou light>" data-link-color="<votre couleur>"></a>

Marqueur originel

A supprimer si installé.

Code Block
<script>
    !function(d,s,id){
        var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';
        if(!d.getElementById(id)){
            js=d.createElement(s);
            js.id=id;
            js.src=p+'://platform.twitter.com/widgets.js';
            fjs.parentNode.insertBefore(js,fjs);
        }
    }(document, 'script', 'twitter-wjs');
</script>

...