【SWELL】PC・SPヘッダーの右上に電話番号やお問合せボタンを設置する方法｜画像を使って分かりやすく解説！

こんな疑問をお持ちではないでしょうか

この記事では、SWELLでのPC・SPヘッダーの右上に電話番号やお問合せボタンを設置する方法を解説していきます

電話番号をヘッダーの右上に設置する方法

まずは電話番号を設置する方法を解説していきます

電話番号のブログパーツを作成する

まず、ブログパーツに電話番号を作成します

ホーム画面の左側にある「ブログパーツ」＞「新規追加」をクリック

電話番号を入力して、リンクを追加します

タイトルはご自身の分かりやすいもので大丈夫です

リンクができたら、「公開ボタン」をクリック

そうすると、ブログパーツのところに電話番号のパーツが登録されます

この呼び出しコードをコピーしておきましょう

ヘッダー内部にブログパーツを設置する

次にヘッダー内部に先ほど作成したブログパーツを設置していきます

「外観」＞「ウィジェット」をクリック

「カスタムHTML」の「ヘッダー内部」を選択して、「ウィジェットを追加」をクリック

右側にある「ヘッダー内部」＞「カスタムHTML」の内容のところに先ほどコピーしておいた呼び出しコードを貼り付けて保存します

そうすると、ヘッダーの右側に電話番号が設置されます

⬆︎目次に戻る

ボタンをヘッダーの右上に設置する方法

続いて、ヘッダーにお問い合わせボタンを設置する方法を解説していきます

ボタンをブログパーツで作成する

ブログパーツを新規追加するところまでの手順は一緒です

新規でブログパーツが開けたら、まずSWELLのボタンを作ります

左上の+ボタンをクリック

「SWELLブロック」にある「SWELLボタン」を選択

表示させたいテキストを入力します

購入カートは右側の歯車のアイコンをタップ

「アイコン設定」から任意のアイコンを選択します

リンク先を追加したら公開

この後の手順は、ヘッダー内部にブログパーツを設置すると同じになります

そうすると、購入ボタンが設置されます

同じ手順でお問合せや資料請求のボタンを作ることも可能です

⬆︎目次に戻る

スマホのヘッダーにボタンを設置する方法

最後に、スマホ画面でヘッダーにお問合せボタンを設置する方法を解説していきます

カスタムボタンからヘッダーにボタンを設置する方法

ホーム画面の「外観」＞「カスタマイズ」をクリック

「ヘッダー」を選択します

最下部にある「カスタムボタン設定」から設定していきます

そうすると、スマホ画面で見たときに、ボタンが表示されるようになります

カスタムボタンが表示されない場合は、「検索ボタン設定」で「表示しない」設定になっていないか確認しましょう

「カスタムボタンにセット」を選択すると、解決します

⬆︎目次に戻る

まとめ

以上、SWELLでのPC・SPヘッダーの右上に電話番号やお問合せボタンを設置する方法を解説しました

ヘッダーにボタンを設置しておくと、目につきやすいためクリックされる確率が上がります

また、サイト訪問者の「お問い合わせしたいけどどこからすればいいんだろう…？」という負担を軽減できるので、ぜひヘッダーにボタンを設置してみてください！