【SWELL】グローバルナビの右端－ブログパーツ＋「ヘッダー内部」
SWELLを使うようになって、10か月。
このブログが「SWELL」関連のキーワードで検索上位にいるせいか、時々質問をいただいています。
今までで一番多い質問は、今回紹介する「グローバルナビ右端のボタン」の設置方法です。
SWELL公式サイトでは、ショッピングカートのアイコンと「購入する」という四角いボタンになっています。
SWELLのグローバルナビ右端にボタン設置方法
この質問が多いのは、たぶんグローバルナビと「ヘッダー内部」という言葉が違う印象なので、SWELL公式のマニュアルで見つけにくいのではないかと思います。
数人の方からは「これはどのようにすればできますか？ 独自？」と、スクリーンショット付きの質問が届きました。
グローバルナビ右端のこの部分を何と表現していいのかわからないので、間違いがないようスクリーンショットが添付されたのだと思います。
私の場合は、Favoritesプラグインのブックマーク入口に使っています。
CSSをゴニョゴニョせず、簡単に目立つボタン（やいろいろ）にできる「ヘッダー内部」は使えるヤツです。
Favoritesプラグインの解説ページにある「一覧ページへのリンクを作る（SWELLの場合）」にも簡単に書きましたが、詳しくは下記の通りです。
やるコトは2つ
- ブログパーツにボタンを作る
- ウィジェット「ヘッダー内部」に配置
SWELLブロックから「SWELLボタン」を選択。好みのボタンを作る。
「ブログパーツ」一覧に戻り、呼び出しコードをコピー（ctrl＋C）。
サンプル画像と違い、今は「あなたのブックマーク」としていますが…。
余談ですが…
「Favorites」は訪問者各自のブックマークページをサイト内に作れるプラグインですが、「ブックマーク」という言葉があまりにも普通すぎて、「あなた専用のブックマークですよ」と短い単語で言い表すのがすごく難しです。
何と表記したら、迷いなくスルーされずにこのボタンの意味を伝えられるかしら…という事で、時々名称が変わってしまうのでした。ダメですね。
「ヘッダー内部」使い方あれこれ
このウィジェット「ヘッダー内部」は1つのボタンだけでなく、複数のボタンやSNSアイコンも配置できます。
「ヘッダー内部」に複数のボタンを配置
ボタンを複数配置することもできます。
ボタンがたくさん並んでしまうと、どれも全然目立たなくなるので、バランスを見て上手に使うのが肝心です。
ボタンの数だけカラムを設定
上記サンプルはボタン2個、2カラム
カラムに入れないとボタンが横並びになりません
ボタンを色違いにするなど工夫すれば、どちらも目立つかもしれません。
でもまぁ、ボタン1つが断然目立つとは思いますが…。
「ヘッダー内部」にSNSアイコンを配置
これ見よがし（笑）のSNSリンクより、こんな場所の大人しいアイコンの方が私は好きです。
（外観 → カスタマイズ）ヘッダーバーに「SNSアイコンリストを表示する」にチェックを入れていると、SNSアイコンがダブってしまうので、どちらかにする必要があります。
大人しく、でも少し目立たせたい…なら、「SNSアイコンリストを表示する」のチェックを外し、上記のようにした方が良いかもしれません。
自身の公表したいSNSのURLを入力
SNS以外にもRSSやお問い合わせページにも対応しています
アイコンはカスタマイズで設定したメインカラーになります。可愛い！
画像も配置できます
ボタンと同じ手順で画像（リンク設定などして）も配置できます。
プロフィールにジャンプさせたい時はボタンより自分のアイコンにした方が効果的かもしれません。
楽天のROOMの入口にするなら、ROOMのロゴを配置するとか…いろいろ工夫できる場所です。
SWELLのブログパーツは変幻自在、使い道がたくさんあって嬉しい、楽しい！
