6月18日4 分

WixのHTMLテンプレートを3ステップでカスタマイズする方法

最終更新: 6月24日

更新日 2024年6月18日(公開日 2013年6月18日)

ウェブサイトの見た目を一新したい、でもテンプレートのカスタマイズ、どこからはじめたらいいかわからない...そんな悩みを抱えていませんか?

そこで、本記事では、Wix の無料テンプレートを自分らしくアレンジするための 3 つの簡単なステップをご紹介します。これらのテクニックを使えば、プログラミングの専門知識がなくても、魅力的でユニークなホームページを作成できるようになります。さあ、豊富なテンプレートから、オリジナリティあふれるホームページ作成にさっそく取り掛かりましょう。

目次

おすすめのテンプレートカテゴリー

STEP 1. 背景と色を変更する

STEP 2. メニューやヘッダーのスタイルを変更する

STEP 3. ページに画像やパーツを追加する

\900種類以上のテンプレートが無料/

Wix のホームページテンプレートとは

Wix の HTML テンプレートは、ウェブデザイン未経験のかたでも、直感的に編集することができる、無料のホームページテンプレートです。画像生成などの便利な機能も豊富なので、適切なアプローチさえ知っていれば、効率的に自分好みのデザインを実現できます。

さっそく、Wix の無料テンプレートを用いて、オリジナルウェブサイトを作成するための 3 ステップを紹介しましょう。まず、ステップ1に入る前に、テンプレートページから自分にあったテンプレートを選びましょう。カテゴリー別に多彩なレイアウトとデザインが選べます。

おすすめのテンプレートカテゴリー

1. 個人サイト

2. ポートフォリオ テンプレート

3. 自己紹介サイト テンプレート

4. 白紙テンプレート

5. ランディングページテンプレート

6. 近日公開テンプレート

ほかにも、人気テンプレートもぜひチェックしてみてください。

STEP 1. 背景と色を変更する

自分の理想に近いテンプレートが見つかったら、まずは背景と色を変更しましょう。コレだっ!というスタイルが見つかるまで、様々な背景や色を試すことができます。左側のツールバーから「サイトデザイン」アイコンをクリックし、「サイトテーマ」を選択。豊富な背景オプションやテーマから、好きなものを選びましょう。サイトテーマを変更すると、フォントやカラーパレットが、一括で全てのページに適応されるため、デザインの統一感を失わず、一瞬でオリジナルホームページへとカスタマイズすることができます。

写真をアップロードして背景として使う場合には、画像サイズに注意しましょう。モバイルからの表示を必ずチェックし、理想の写真の見え方であるか確認する必要があります。

また、「カラーテーマを編集」からアクセントカラーを別々に編集することができ、サイトの雰囲気をクリック一つで一新することもできます。

アクセントカラーを変更すると、背景、ナビゲーションメニュー、フォントの色に影響がでます。

STEP 2. メニューやヘッダーのスタイルを変更する

前ページに表示されるナビゲーションメニューのスタイルを変更することで、サイトにオリジナル感ができます。Wix サイトのナビゲーションメニューは全て、カスタマイズすることができるので、お好みのメニューデザインを作成しましょう。

メニュー部分をクリックし、右に表示される「…」から、「ヘッダーデザインを変更」を選んで、ヘッダースタイルを変更しましょう。ここで、パーツの背景や枠線の色などの詳細をカスタマイズできます。

STEP 3. ページに画像やパーツを追加する

「パーツを追加」アイコンをクリックして、お好みのテキストや画像、ボタンなどを自由に追加することができます。

例えば、「ギャラリー」を選択すると、オリジナルの画像ギャラリーが追加できます。スライドショーやグリッドギャラリーなどのレイアウトを選んで「画像の整理」から、早速オリジナルの画像を追加しましょう。

ほかにも、便利な「セクションを追加」アイコンを選択すると、セクションごとに機能の追加できるため、さらにお手軽にカスタムホームページにすることができます。

「サイトページとメニュー」アイコンからは、ページの追加や削除、複製など、サイトのページ管理に関することはここで全て設定できます。また各ページの SEO 設定もここで管理します。

あとはオリジナルのテキストやコンテンツを追加して、自分だけのサイトを完成させましょう。テキストや画像が伝えるあなただけのコンテンツが、真のオリジナルサイトを作る肝となります。さっそく、ホームページ作成をはじめましょう。

ライター: Wix Team