titleタグを編集しよう

店舗運営が楽しくなるtips

titleタグとは

titleタグ(タイトルタグ)とは、その名の通り作成したショップの「タイトル」を設定するhtmlのコードになります。

え?html??コード???むずかしそう・・・。

きみ

わたし

初めてコードをさわる人でもすぐ編集できるから安心して。

タイトルは「WEBブラウザのタブ」や「お気に入りに登録したときのサイト名」としてお客様の目に触れやすい場所へ表示されます。

初期のタイトルタグ

Cafe24でショップを作成すると、最初はこのような表示になっていると思います。ぜひご自身のショップのタイトルをWEBブラウザのタブで確認してみてください。

基本レイアウトって表示されているね。

きみ

ちょっとダサい・・・。

ぼく

わたし

そうだね。じつは見た目がダサいだけじゃなくて、このtitleタグの内容はSEO(検索サイトの検索結果)的にも重要な要素になっているので、設定しないと損してしまう場合があるんだ。

titleタグを編集しよう

titleタグを編集する場合、デザインのコードを編集する必要があります。難しくないので順番に作業していきましょう。

スマートデザインを開く

Cafe24の管理画面からスマートデザイン画面を開きましょう。

プロモード:PCデザイン>デザイン管理>Myデザイン>メインデザイン>編集
スマートモード:デザイン管理>Myデザイン>メインデザイン>編集

スマートデザイン画面を開く
layout.htmlファイルを開く

スマートデザイン画面が開いたら、左下の検索窓にlayout/basic/layout.htmlと入れて検索結果のファイルを開いてみましょう。

layoutファイルを開く

※使用するデザインテンプレートによってファイル名が異なる場合があります。

タイトルを入力する

<title>基本レイアウト</title> と記載されている部分がありますでしょうか?この<title>と</title>で挟まれている部分がサイトのタイトルになります。

タイトルタグを編集する

さっそくショップのタイトルに変えてみましょう。

保存する

タイトルを変更したら、スマートデザイン画面左上の「保存」ボタンを押しましょう。これで変更完了です。サイトのタブに表示される名前が変わっているか確認してみてください。

設定を保存する
思ったより簡単だね!

ぼく

わたし

よかった。使用するデザインテンプレートによって、たまにtitleタグが書かれているファイルや行数が違う場合があるんだけど、大体同じだよ!

みなさまもお分かりいただけましたでしょうか?titleタグは1か所変えていただくと、全てのページに反映されます。ぜひお試しください。