logo
 

AddThisで複数のソーシャルボタンを横並びにまとめて設置

Facebook, Twitter, Googleプラスの複数のソーシャルボタンを横並びにまとめて設置するにはAddThisが便利です。

このサイトでもAddThisを使っています。以前は複数のソーシャルボタンを個別に設置していました。ところが、ブラウザによる表示の違いや各SNSの仕様変更に対応するのが面倒になり、AddThisに乗り換えました。ここでは、AddThisを使って複数のソーシャルボタンを横並びにまとめて設置する方法をまとめます。

AddThisのアカウントがない方は、先にAddThisのアカウントの取り方のページをご覧ください。

MODXサイトでのAddThisの使い方

AddThisにアクセスして、[Tool Gallery]から[Original Sharing Buttons]で[Get Code]。

AddThisで複数のソーシャルボタンを横並びにまとめて設置

[Services]で設置したいボタンを選びます。必要なボタンは左の[Available Services]から右の[Selected Services]にドラッグします。不要なボタンは、右の[Selected Services]から左の[Available Services]にドラッグします。

AddThisで複数のソーシャルボタンを横並びにまとめて設置

[Get The Code]からコードをコピーし、MODX管理画面でチャンクを作って、貼り付けます。[Get The Code]には2つの欄があります。そのウェブページで他にAddThisのスクリプトを使っていなければ、下段のスクリプトのコードもコピーして、同じチャンクに貼り付けます。

AddThisで複数のソーシャルボタンを横並びにまとめて設置

チャンクに必要なコードが入っていることを確かめて、「更新」します。AddThisに戻って[Update]して画面を閉じます。

AddThisで複数のソーシャルボタンを横並びにまとめて設置

MODX管理画面でテンプレートを開いて、ソーシャルボタンを設置したい場所に、AddThisのチャンクを貼り付けて「更新」します。

AddThisで複数のソーシャルボタンを横並びにまとめて設置

関連記事

MODXとは

新着情報

 
RSS