BASEのショップでAboutやContactの文字を編集したい場合

BASEのショップでAboutやContactの文字を編集したい場合

こんにちは、トーモです。

BASEでショップを作ったときにデフォルトで表示される「About」や「Contact」の文字。

これって編集したいなーって思いませんか?

About Contact 編集箇所

オシャレな雑貨やアパレルなど取り扱うお店でイメージに合っているならいいかもですが、お客さまが使いやすいショップにしたいなら英語表記はちょっと頂けないかなと。

「About」なら「〇〇〇(ショップ名)について」とか、「Contact」なら「お問い合わせ」のほうが親切ですよね。

そう思われるショップオーナーさんも多いかと思います。

HTMLを使えば簡単に編集できますので、その方法をご紹介しますね。

スポンサーリンク



BASEのショップでAboutやContactの文字を編集する方法

BASE Appsで「HTML編集」をインストールする

AboutやContactの文字を編集するにはHTMLをいじってあげる必要がありますので、まずBase Appsから「HTML編集」をインストールします。

管理画面の右上にあるAppsのアイコンをクリックします。

Appsをクリックする

 

Appsを選べる画面にとびますので、その中から「HTML編集」を選んでインストールします。

以前は有料だったそうですが、現在では無料で利用できます。嬉しいですね。

HTML編集をインストール

 

管理画面にもどって「デザイン」をクリックします。

左側にデザイン編集画面が表示されますので、その中からHTML編集をクリックします。下の画像はデザイン編集部分です。

デザイン編集部分

 

すると「HTML編集画面」に切り替わります。

HTML編集画面

 

HTMLに詳しくない方は「うっ・・」って感じで少しためらっちゃうかもしれませんが大丈夫。

該当箇所だけWordで文字を変えるのと同じように編集してあげるだけです。

HTML編集画面から該当箇所を編集する

文字を編集してあげるにはそれぞれ2箇所を変える必要があります。

1つはショップ上のメニュー部分です。2つ目はメニューをクリックして飛んだページのタイトル文字です。

ではまずメニュー部分の編集箇所をみてみましょう。

メニュー部分の編集箇所

 

ちょっと分かりづらくてすいません。

オレンジの横線で引いた箇所がメニュー部分の文字にあたります。

他のテンプレートで試していないのではっきりと分かりませんが、テンプレート毎にこの位置は変わると思います。

僕が使っているテンプレートではかなり下のほうにありました。

必ずどこかにありますので根気よく探してみてください。

 

ちなみに僕が使っているおすすめテーマについては下の記事をご参考ください。

BASEのテーマは無料・有料どちらがいいの?おすすめはこれ!

 

ここの文字をそれぞれ編集してあげると変えることができます。僕はAboutはご利用ガイドに、Contactはお問い合わせに変えました。

「Home」や「NEWS」などの項目も並んでいますので、同じように変更できます。

 

次に各ページに飛んだときのページタイトルも変更してあげます。

該当箇所は下の画像のとおりです。

ページタイトル 該当箇所

 

オレンジの下線の部分を編集してあげると、ページタイトルが変わります。こちらもテンプレートによって表示位置や内容が違ってくると思います。

ひとつ注意点があります。ここ重要です!

例えばAboutのオレンジ下線の近くを見てください。

<div id=”about”>

{block:AboutPage}

の表記がありますよね?ここにもAboutの文字があります。でも、

こういったカッコに囲まれている部分は絶対に変更しないようにしてください。

ここを変更してしまうとホームページの表示が崩れて正常に表示されなくなってしまいます。

ポイントはカッコに囲まれているかいないかです。

正しい該当箇所のAboutはカッコに囲まれていないですよね?(左右にあるカッコはAboutにはかかっていません)

カッコに囲まれていない部分は実際にホームページで表示されるテキスト部分になります。

HTML編集に慣れていない方は、まずは一ヶ所だけ変更してみて正しく表示が変わったかどうか、またレイアウトが崩れていないか確認するのが良いでしょう。

万一レイアウトが崩れてしまっても、変更箇所を元に戻してあげれば直ります。

ひとつずつ確実におこなってください。

まとめ

今回はBASEのショップでデフォルト表示されている「About」・「Contact」の変更方法でした。

英語表記のほうがデザイン的に洗練されているのでこういった表記になっているんだと思いますが、一番優先するのはお客さまが利用しやすいかどうか。

ユーザビリティに優れているかです。

僕が実際に買い物をするなら、お問い合わせがContactだったりすると「不親切だなー」って思っちゃいます。

それに扱う商材によっては英語表記は浮いちゃいますよね。

必ず変えなきゃダメということはないですが、商材や利用しやすさなど考慮して決めてみて下さい。

今日はこのへんで。

それではまた!

スポンサーリンク

ABOUTこの記事をかいた人

初めまして、妻と二人暮らしの40歳です。Photoshopで写真レタッチの仕事をメインに、3つのネットショップ運営とホームページ制作を請け負っています。 在宅で副業するならPhotoshopのスキルを習得するのが一番の近道です! 手に職をつけて「自分で稼ぐ力」を身につけましょう!そのノウハウをゼロからお教えします。