Cocoonカスタマイズ_SNSボタンについて

たとえば、Cocoonで普通に記事を投稿したら、次のように、
記事の上と下にSNSシェアボタン
記事の下にフォローボタンが表示されます。

たぶん、ほとんどの方が
「そんなもんなんだろうな~」
とあまり深く考えずにそのままにしていたか、
あるいは、SNSボタンの表示を消す方法を見つけて消していたかどちらかではないかと思います。

ここでは、
それぞれのSNSボタンの働き
SNSボタンを消す方法
表示させたまま、あるいは消した方が良いのか
などについても書いていきたいと思います。

SNSシェアボタンについて

Cocoonの場合、デフォルトだとSNSシェアボタンが上下に表示されます。



これは、両方とも非表示にしたり
あるいは下だけ表示させるなどが簡単に出来ます。

SNSシェアボタンの働き

たとえば、SNSシェアボタンのTwitterのボタンをクリックしたら

次のような画面になって、そのままツイート出来る形です。

たとえば、LINEのボタンをクリックしたら

次のような画面になりました。
(私の個人LINEなのでさすがにモザイクをかけていますが)

SNSシェアボタンは必要か?

ここまで見てきたように、
SNSシェアボタンを設置しておくと、訪問者が自分のSNSでシェアしやすくなります。

Twitterのボタンをクリックするだけで



このように、いきなりツイート出来る画面になるというのはいいですね。
あとで説明しますが、ここで自分のTwitterアカウントと関連を持たせて、自分のアカウントのフォロワーを増やすことも出来ます。

このように、シェアボタンクリックでいきなりツイートの画面になりましたが、当たり前ですがTwitterにログインしていない状態ではこうはなりません。

でも、それは大きな問題ではありません。
ほとんどがスマホからのアクセスだと思いますし、そしてスマホだったら皆さんもそうだと思いますが
Twitter、Facebook、インスタなどはアプリで常にログインした状態になってますよね。

ここからは、あくまで私の考えですが・・・
シェアしてくれたらありがたいですし、邪魔にならなければ残しておいてもいいと思います。
ただ、Cocoonでは記事上と下にシェアボタンが表示されますが
記事上のシェアボタンは取ってよいと思います。

記事下であれば、全く邪魔にならないし残しておいても良いと思います。
それにシェアするかどうか決めるのは普通、記事を読んだ後ですからね。

SNSシェアボタンの設定

WordPressのメニューで
Cocoon設定→Cocoon設定
と進んで、SNSシェアをクリック。

開いた画面をよく見て頂くと分かるのですが
トップシェアボタン(記事上に表示されるシェアボタン)
ボトムシェアボタン(記事下に表示されるシェアボタン)
ともに、
表示するかしないか
表示する場合のSNSの種類
表示する場合のボタンのデザイン
など別々に設定することが出来るようになっています。

上から順番に見ていくと

シェアボタンの表示・非表示

記事上のシェアボタンを非表示にする場合は、
メインカラムトップシェアボタンを表示のチェックを外します。

シェアボタンの表示切替


つまりどのシェアボタンを表示させるかなんですが、これは何でもいいです。
デフォルトのままでいいと思います。

シェアボタンの表示ページ

次は、シェアボタンをどのページに表示させるかの設定です。

デフォルトでは上のようになっていると思います。
最低限、投稿にチェックが入っていればいいです。

シェアボタンカラー

次は、シェアボタンの色に関する設定です。

モノクロ、ブランドカラー、ブランドカラー(白抜き)から選びますが、それぞれ次のようになります。

カラム数

たとえば次のような感じになりますが

ただ、これはスマホで表示させた場合、表示幅の関係で必ずしもここで設定したようにはなりませんので、適当に設定して下さい。

ロゴ・キャプション配置

ロゴ・キャプション左右、ロゴ・キャプション上下(デフォルト)、キャプション・ロゴ上下から選べますが、それぞれ次のようになります。

シェア数の表示

下は、シェア数表示にチェックを入れた、私のブログからのキャプチャーですが

シェアされていない場合に0と表示されるだけで、かといってシェアされた場合にその件数が表示されるわけでもないので意味がないと思います。

ここは、チェックを外したままにしましょう。

以上の設定を
トップシェアボタン
ボトムシェアボタン
それぞれ別々に行うことができます。

前に書いたように、私は
トップシェアボタンは非表示
ボトムシェアボタンは表示
ということで良いと思います。

シェアボタンと自分のTwitterアカウントとの連携

前に紹介した、Twitterのシェアボタンをクリックするだけで


このようになるのは、ブログに訪問してくれた人がシェアボタンをクリックしたら
訪問者のTwitterアカウントでツイート出来るようになるということで、ここまでだとあなたのTwitterアカウントは関係ありません。

ここに、あなたのTwitterアカウントと関連を持たせる方法です。
これを使うには
WordPressのメニューから
ユーザー→プロフィール
と進んで

この画面で、あなたのTwitterアカウントを指定します。
https://twitter.com/(あなたのTwitterユーザー名)

これで準備は完了です。

それでは、先ほどのSNSシェアの設定画面に戻って、ツイート設定という項目があります。

ここで、ツイートにメンションを含めるにチェックを入れます。
もう一つ、ハッシュタグのところに #エろ動画 と入れてみました。

これでシェアしてみると

このようにハッシュタグも入って、さらに自分のTwitterアカウントへのリンク(メンション)がされます。

@(Twitterユーザー名) とツイートすると、そのアカウントにリンクされ、またリンクされた方にも通知が行きます。
それをメンションといいます。

また、#エろ動画 と平仮名・カタカナ混ぜるのは、Twitterの凍結対策でよく使われる方法です。

SNSフォローボタンについて

SNSシェアボタンが記事の上下に表示させることが出来たのに対し、SNSフォローボタンは記事の下部だけになります。



もちろん非表示にすることも可能です。

SNSフォローボタンの働き

SNSフォローボタンというのは、自分のSNSをフォローしてもらうためのボタンなので、
WordPressのメニューから
ユーザー→プロフィール
と進んで次の画面でSNSのアカウント情報を入れておかないと意味がありません。

たとえば何も入っていない状態だと

Twitter、インスタグラム、LINE@を入れてあげると

このように表示されます。

Twitterの場合

https://twitter.com/(あなたのユーザー名)

インスタグラムの場合

https://www.instagram.com/(あなたのユーザー名)

LINEの場合

LINE公式アカウントになります。公式アカウントにログインして取得した、友達追加URLを貼り付けます。

SNSフォローボタンは必要か?

SNSフォローボタンをクリックしても、いきなりフォローされるなんてことはなくて
要するに自分のアカウントにリンクが貼られるだけです。

それだけだったら、他でも代用出来ますし、
またスマホで見たときに画面下に表示されるメニュー(フッターモバイルボタン)に入れるという方法もあります。

フッターモバイルボタンの作り方は別項目で解説しています。
また、フッターモバイルボタンであれば、記事内のフォローボタンと違って常に訪問者の目に入るので、その方がいいかもしれません。

ここも、あくまで私の考えですが・・・
無理に入れるメリットはあまりないように思います。
SNSアカウントとの連携をするつもりがなければもちろん不要です。

出会い系アフィリエイト開業パックから、このページをご覧になっている方は
Twitter・公式LINEの利用を推奨していますので、記事内のSNSフォローまたはフッターモバイルボタン(両方でも良い)を使った連携は必ず行って下さい。

SNSフォローボタンの設定

WordPressのメニューで
Cocoon設定→Cocoon設定
と進んで、SNSフォローをクリック。
ここから設定していくことになります。

フォローボタンの表示・非表示

そもそも、フォローボタンは表示しないという場合は
本文下のフォローボタンを表示するのチェックを外して下さい。

フォローメッセージ

ここからは、フォローボタンを表示するという方の設定です。

このままだと、下のように adminをフォローする とか表示されてしまいます。
これじゃあ、あんまりなんで変更して下さい。

出会い系アフィリエイト開業パックの体験談ブログの場合は、マニュアルに沿ってニックネームの変更をしてあれば、そのニックネームが表示されますから変更の必要はありません。

このように設定してあれば

次のように表示されます。

または、#{author}の部分はこのままで、「をフォローする」の部分だけ変えるか。

フォローボタンの表示ページ

次は、フォローボタンをどのページに表示させるかの設定です。

デフォルトでは上のようになっていると思います。
最低限、投稿にチェックが入っていればいいです。

feedlyの表示・RSSの表示

デフォルトだと、どちらもチェックが入っているので、そのボタンも表示されますが

他のSNSボタンが目立つように、チェックを外して表示させないようにした方がいいでしょう。

フォローボタンカラー

次は、フォローボタンの色に関する設定です。

モノクロ、ブランドカラー、ブランドカラー(白抜き)から選びますが、それぞれ次のようになります。

フォローボタンその他の項目

残りの項目はそのままでいいです。
デフォルトユーザーのところは、ユーザー→プロフィール からニックネームを設定してある人は、そのニックネームになっている筈です。

SNSボタンまとめ

それでは、SNSシェアボタン・SNSフォローボタンについて今まで書いてきたことをまとめます。

SNSシェアボタン

Cocoonでは、記事上と記事下に表示される(デフォルト)

SNSシェアボタン表示した方がいい?

記事上のボタンは邪魔に感じること、またシェアするかどうか決めるのは普通記事を読んだ後なので、
SNSシェアボタンの表示は記事下だけ残しておく。

SNSシェアボタンの働き

ブログの訪問者が、自分のSNSアカウントでシェアしてもらえるボタンなので、ブログ運営者のSNSアカウントとは関係ない。
そのため、たとえブログ運営者がSNSアカウントを持っていなかったとしても表示させておく意味はある。

Twitterの場合は、ブログ運営者のアカウントと関連させることも出来る

ユーザー→プロフィールからTwitterアカウントを設定

Cocoon設定→Cocoon設定→SNSシェアから、
ツイートにメンションを含める
にチェックを入れる。

SNSフォローボタン

Cocoonでは、記事下に表示される(デフォルト)

SNSフォローボタン表示した方がいい?

自分のSNSと関連を持たせないのなら、表示させておく意味は全くない。

SNSフォローボタンを表示させるのなら
ユーザー→プロフィールと進んで各SNSを設定しておく。

もう一つ、
ユーザー→プロフィールからニックネームを設定した方が良い。

これは、SNSシェアボタン・SNSフォローボタンどちらでも言えることですが、
記事内に表示させないで、フッターモバイルボタンに入れるという方法もあるので、その辺はお好みで。
詳しくはフッターモバイルボタンの項目で確認して下さい。

コメント

タイトルとURLをコピーしました