よく使われる基本的なボタン
フッターモバイルボタンでよく使われる基本的なボタン、おそらくほとんどのブログで使われている基本的なボタンです。
ホームボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
画像はこちらから選んで下さい。
動きは説明するまでもないとは思いますが、そのブログのトップページへのリンクになります。
検索ボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
画像はこちらから選ぶ。
トップボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
画像はこちらから選ぶ。
動きは分かると思いますが、現在表示しているページの先頭に戻ります。
他に表示させたいボタンがあれば省略してもいいボタンだと思います。
サイドバーボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
画像はこちらから選ぶ。
サイドバーを表示させるボタンは、あれば訪問者にとっても便利だし、他のページも回遊してもらいやすくなるので、あった方が良いですが、
表示イメージ
Cocoon設定→Cocoon設定→モバイルから、
コンテンツ下のサイドバーを表示
にチェックを入れておけば
画面下に、サイドバーの内容が表示されるようになるので
Cocoon以外の有料のテーマだと何もしなくても下にサイドバーが表示されるようになっているものが多いと思います。
サイドバーを表示させるボタンは、他に表示させたいボタンがあるときは省略してもいいと思います。
前のページで紹介しましたが
デフォルトでは次のようになっているボタンを
次のように変更しましたが、
トップボタンとサイドバーボタンを省略してるのが分かると思います。
SNS関連のボタン
SNSシェアボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
というか、これにしましょう！という決まった画像がないので、自分で好きな画像を選ぶことになります。
画像はこちらから選ぶ。
ボタンをクリックしたときの表示イメージ
SNSフォローボタン
設定例
ナビゲーションラベルは、訪問者に分かりやすい言葉なら変更可。
CSS classは、ここで画像の指定を行うので他の画像に変更可。
というか、これにしましょう！という決まった画像がないので、自分で好きな画像を選ぶことになります。
画像はこちらから選ぶ。
SNSフォローボタンは、自分のSNSアカウントを登録していないと全く意味がないので
ユーザー→プロフィールから自分のSNSアカウントを登録しておいて下さい。
当たり前ですが自分の個人ユーズのアカウントでなくブログと関連したアカウントです。
Twitter・インスタ・LINEを登録したイメージ
Twitterの場合
https://twitter.com/（あなたのユーザー名）
インスタグラムの場合
https://www.instagram.com/（あなたのユーザー名）
LINEの場合
LINE公式アカウントになります。公式アカウントにログインして取得した、友達追加URLを貼り付けます。
同じ画面でニックネームも設定しておいて下さい。
次に、Cocoon設定→Cocoon設定→SNSフォローで
feedlyフォローボタンを表示する
RSS購読ボタンを表示する
のチェックを両方外す。
ここまでやった場合の表示イメージ
このあとは、
ブログ訪問者がTwitterをクリックしたら、あなたがプロフィール画面で設定したTwitterに飛びます。
ブログ訪問者がLINEをクリックしたら、あなたがプロフィール画面で設定したLINEアカウントの友達追加画面に飛びます。
もしLINE登録済みの場合はトーク画面に飛びます。
こんなやり方もあります
上記、フォローボタンの場合、いったんこの画面になって
ここから、TwitterとかLINEとかのボタンをクリックしてくれたら、あなたのアカウントに飛びます。
それなら、ボタンの数は増えてしまいますが
TwitterボタンとLINEボタンを２つ作るという方法もあります。
TwitterボタンとLINEボタンを作る設定例
実際の表示
このようにすれば、ボタン１回クリックでTwitterまたはLINEに飛びます。
その他の活用例
たとえば、前のページで
アクセスランキング
アフィリエイト広告
こういった活用例も紹介しましたが、これを利用すれば紹介したいもの何でも同じような使い方は出来ます。
