• WordPressに、『LINEで送る』ボタンを設置

    Posted on by pasoko in wordpressカスタマイズ.
    wordpress カスタマイズ
    『LINEで送る』ボタンを設置
    wordpressのプラグインを使う。 wordpressのプラグインを使う。

    ちまたで話題になっている『 LINE 』!

    スマートフォン1つで、メッセージや写真、位置情報や動画も送れたりするので、「フェイスブック」や「ツイッター」とともに、人気のSNSになっています。

    「ツイートボタン」とか「いいねボタン」とか、色んなソーシャルメディアのボタンをWEBサイトに設置することができますが、LINEもできるようになりました。

    WordPressでは、プラグインもあるので、設置がとても簡単です。

    WordPressのプラグイン「WP Social Bookmarking Light」を使って「LINEで送る」ボタンを設置します。

    LINEで送るボタン

    これで、ホームページやブログに設置して、記事をブックマークしたり、拡散したりできるようになりますね!

    スマホで記事を見ている人が、この「 LINE で送るボタン」を押すと、記事タイトルや URL を、みんなで簡単にシェアすることができるというわけです。

    すでに「いいねボタン」や「ツイートボタン」を表示させるために、WP Social Bookmarking Lightをインストールされている方は、設定画面から、「LINE」をドラッグアンドドロップさせるだけで表示させることができます。

    wordpress LINEに送る

    ただし、 WP Social Bookmarking Lightで、「LINEで送る」ボタンが追加されたのはバージョン1.7.3以降ですので、古いバージョンの方は、アップデートが必要ですよ。

    「WP Social Bookmarking Light」のインストールがわからない方は、こちら。

    [button color="#E3315C" size="5" style="3" dark="0" radius="auto" link="★" target="blank"]「WP Social Bookmarking Light」のインストール[/button] [su_/service]
    パソナビ
    スマホで閲覧している人にのみ「LINEで送るボタン」を表示させたい スマホで閲覧している人にのみ「LINEで送るボタン」を表示させたい

    ただ、現在はスマホのみ対応のようで、PC で閲覧している人が「 LINE で送るボタン」を押してしまうと、LINE の公式サイトへとジャンプしてしまいます。

    せっかく見に来てくれている閲覧者を、自分のサイトからはなれさせるだけで、迷わせてしまいますね。「スマホでは表示して、PCサイトでは非表示にしたいな。」という人は、以下のモバイル分岐を使ったタグを、直接テンプレートの表示したい部分に貼り付けて使用してください。

    画像アドレス、画像サイズはお好みの画像に合わせ記入してください。(画像アドレスはhttp://から、画像サイズにpxは不要です。)

    ★プラグインを使わず、手動で設置する場合

    <!-- LINEで送るボタン(モバイルのみ表示) -->
    <?php if ( function_exists('wp_is_mobile') && wp_is_mobile()): ?>
    <a href="http://line.naver.jp/R/msg/text/?<?php the_title(); ?>%0D%0A<?php the_permalink(); ?>"><img alt="LINEで送る" src="★画像アドレス" width="★" height="★" /></a>
    <?php elseif ( is_search() || is_home() || is_archive() ) : ?>
    <?php else: ?>
    <?php endif; ?>
    <!-- // LINEで送るボタン(モバイルのみ表示) -->
    

    (まずソースを展開をクリックしてください。クリップボードにコピーは、タグをマウスオーバーするとアイコンが出てきます。左から2番目のアイコンをクリックするとコピーできます。そのまま右クリックで貼り付けを選び、挿入してください。)

    [button color="#689D20" size="5" style="3" dark="0" radius="auto" link="http://media.line.naver.jp/howto/ja/" target="blank"]LINEボタンをダウンロードする。[/button] ※ページ下部にあります。

    パソナビ


    カスタマイズ免責事項 カスタマイズ免責事項

    すべての環境で、Pasonaviで解説しているカスタマイズがうまくいくとは限りませんので、ご注意くださいませ。バックアップはきちんと取って、あくまでも自己責任の下でお願いいたします。


    [spacer size="40"]


    一緒に読まれている記事⇒
Comments are closed.