BASEでコンタクト(問い合わせ)ページの項目をカスタマイズする方法

※記事内にプロモーションが含まれています。

BASEで作成しているサイトで、contact(お問い合わせ)ページをカスタマイズしたい(項目を変更したい)という方はいませんか?

私も、contactページのタイトルが「Contact」と英語になっているのを日本語に直したかったり、「電話番号」や「注文ID」などの項目はいらないので削除したいのですが。

結論、無料テーマだとコンタクトページの項目を変更することはできないようです。
(ただし、購入したデザインテーマを利用している方はおそらく可能だと思います)

(※当記事内容は、2023年2月時点の仕様です。今後変更される可能性はあります)

BASEのコンタクトページをHTML編集でカスタマイズできるか?

コンタクトページ中身そのものをカスタマイズしたいなと思ったのですが、デザイン画面の、ナビゲーションのところからは何もできません。

そこで、「HTML編集」というのがあるらしいのでそれを使ってみます。

(ちなみに、html編集は、html/cssを触ったことのない方が使うのは私はおすすめしません。間違えるとエラーが出て壊れます。これから勉強したいという方であればまだ挑戦しても良いかも)

まだ使ったことのない方は、ログイン後メニューの右上「Apps」をクリック。

「html」と検索すると出てくるので、まだの方はインストールします。インストールしただけでサイトに何か変更が加わることはないので、機能を見たいものはインストールしてしまっても大丈夫です。

そうすると、デザイン画面に「HTML編集」が追加されます。

ただし、これやってみると、「新規作成」と「購入したテーマを元に新規作成」しかないんですね。

つまり、HTML編集ができるのは、シンプルな一番素の状態のサンプルテーマか、購入したデザインテーマだけです。無料のオフィシャルテーマは、HTML編集ができません。だから無料テーマだとコンタクトページもカスタマイズできません。

私も無料のオフィシャルテーマでやっていたので、コンタクトページのカスタムは断念。。。残念!

有料のデザインテーマの場合は、コンタクトページもカスタマイズできるはず

私は無料のテーマを使っているので、おそらくの話ではありますが、購入したテーマならばHTML編集でさわれるのでコンタクトページもある程度カスタムできるはずです。

HTML編集で、編集ページを開きます。

パソコンの『command』を押しながら『F』を押す。するとそのページ内を文字検索できるので「contact」と検索する。

すると該当の箇所が見つかるはずです。(上の画像はサンプルテーマなので中身が違いますよ)

あとは、タイトルの「Contact」を変えたいならh1の箇所を書き換える。
(イメージ)
<h1>contact</h1>
↓これを
<h1>お問い合わせ</h1>
に編集。

挿入文を変えたければ、<p>タグ内</p>の「お問い合わせ内容をご入力ください」部分を書き換えれば変わります。

項目を変えたいならformタグ内を編集します。ただし、バリデーションの問題が出るかもしれないので、おすすめはしません。(というかできないかも)

アドレス、件名などの必須項目を消すと少なくとも確実にエラーで動かなくなると思いますので、項目をいじる際にはお気をつけて。

テキストだけ編集する程度であれば大丈夫です。あとは、不必要項目の電話番号、注文IDの欄を消すぐらいであればもしかしたら影響なくできるのかもしれません。やってみないとなんとも。。。(もし触る場合は、元に戻せるように最初のコードをコピペしておきましょう。)

おすすめテーマランキング[PR]

【第1位】AFFINGER6 ¥14,800円

affinger6バナー

「稼げるサイトを作りたい人」におすすめ。収益化をサポートするための仕掛けが本当に良く出来ているので、使いこなせれば成果アップにつながる。カスタマイズ自由度も高いので個性も出せる。当サイトで利用中。もちろんSEOにも強い。

【第2位】swell ¥17,600円

こちらは万人向け。いま一番売れてる有料テーマ。多機能ながらも直感的な操作ができるので、「とにかく使いやすい」。初心者〜上級者にも愛用され、導入してすぐオシャレなサイトになる。SEOにも強くバランスが良いと言える。

【第3位】Cocoon ¥0円

cocoonバナー

一言で言えば「コスパ最強」。なんでこれが無料?必要十分な機能で、シンプルなので初心者にもgood。費用をかけずとりあえずサイトを始めたい人に最適。ゼロからサイトを作る人は、レンタルサーバーの「Xサーバー」で、wordpressクイックスタート機能というのを使うのがおすすめ。即cocoonサイトができる。2個目のブログにも。

  • この記事を書いた人

きつねコード

webディレクター&プログラマー。子育て真っ最中の2児のパパ。 10年以上Web系の経験を積み、サービス立ち上げやメディア運営など、幅広いジャンルに携わってきました。若い頃に起業した経験もあるので、少し守備範囲は広めかもしれません。パソコンが苦手な方からも質問をいただくことが多く、「少しでも役に立てれば」との思いでこのブログを始めました。

人気記事

wordpressのおすすめテーマはこれ 1

この記事を書いているきつねコードは、10年以上wordpressに触れており、自身でもブログを運営しています。 当記事で紹介する以外にも、多くのwordpres ...

おすすめのASP 2

登録必須のおすすめASP(ブログ初心者〜上級者) ブログやサイトを作成したら、まずASPヘの登録は行いましょう。 結論を言うと、初心者でも上級者でも下記の王道5 ...

ラッコキーワードの使い方を徹底解説! 3

この記事でわかること ラッコキーワードを使うと何ができるのか? 他のツールと比べたときのラッコの優位性 ラッコキーワードの超具体的な使い方 (初心者向け)SEO ...

cocoonからaffinger6への移行手順 4

cocoon以外のテーマからaffinger6へ移行する場合もチェック項目は大体同じですので、参考にしてみてください。 関連記事:cocoonからswellへの ...

cocoonからswellに移行する全手順 5

cocoon以外のテーマからswellへ移行する場合でも、確認することとしては大体同じ手順となります。ご参考にしてみてください。 結論:cocoonとswell ...

AFFINGERタグ管理マネージャーとPVモニター 6

この記事でわかること 初心者に、「タグ管理マネージャー&PVモニター」が良い理由 Affinger6の専用プラグイン「タグ管理マネージャー」の使い方 Affin ...

-ITツール
-