Wixの使い方を動画で完全解説!「公開」と「編集履歴」についても詳しく解説

基本操作

プログラミングの知識がなくても簡単におしゃれで超高機能なWebサイトを作成できる『Wix』ですが、「操作方法が分からない」「使ったことないけどどんなことができるんだろう」という方のために、使い方を完全解説していきます。

 

Wixエディタの画面構成

Wixでサイトを作成する場合、どのテンプレートでも基本的に、

・ヘッダー

・ページボディ

・フッター

の3つのエリアでページが構成されます。

昔のサイトですと、メニューが左に配置されているレイアウトなんかもありましたが、現在は様々な端末での表示を考慮され、このようにメニューが上に配置されている例が多くなりました。

メニューを左に配置するレイアウトにすることも可能ではあるのですが、うまく表示できない端末も出てくるので、基本的にはWixの推奨するレイアウトをそのまま利用しましょう。

 

サイトの全体構成について

上の章で説明した、ヘッダー・ページボディ・フッターのそれぞれの仕様や扱い方について、次の動画で解説していきますのでご覧ください。

Wixの使い方 基本操作編 「サイトの全体構成について」

 

上部メニューの使い方

次に、具体的に画面を編集していくためのWixエディターの機能について解説していきます。まずは画面上部の各メニューについて解説していきます。

Wixの使い方 基本操作編 「上部メニューの使い方」

 

左メニューの使い方

左メニューの使い方について解説していきます。ページにパーツ・機能を追加するには主にこのメニューを利用することになります。

Wixの使い方 基本操作編 「左メニューの使い方」

補足

便利な機能を「アプリ」として追加していきますが、Wixでは現在、300を超えるアプリが用意されており、それぞれの機能や使い方については別記事で詳しく解説していきます。

 

Wixの特徴・ポイント

以下の特徴が、Wixの優れているポイントになります。

ページの追加や並び替えが、直観的な操作で簡単にできる

Webサイトを運営していると、新しいページを作りたいと思うことは多々あります。そんなときに、もともとあるページと並び替えたい、ページが多いので分類したいなどといった操作がややこしいと、編集に苦労します。

Wixでは、ページの追加はボタン一つ。並び替えもドラッグ&ドロップで簡単です。これなら、「後から簡単に並び替えられるから最初は適当に始めてみよう」といった、気軽な気持ちで始められます。

 

背景色や背景画像に対して、サイト全体で調和がとれやすいようにサポート機能がある

背景色とパーツとテキストの間で、色相やトーンの調和を取るにはけっこうややこしい知識が本来は必要です。

しかしWixなら、調和のとれた色の組み合わせを数十種類から選ぶだけですし、画像に色を足すことで、サイトのテーマカラーと調和を取ることもできます。こういったことをPhotoShopのような画像編集ツールでやるにはかなり手間がかかるので、非常に助かります。

 

膨大な量のパーツを無料で使える

上の画像でヘッダーに表示しているイルカの画像は、エディタの左メニューの「追加」メニューから、「ベクターアート」の中から選択して配置しました。

Wixではこのようなアートパーツが大量に、しかも無料で簡単に利用できるのでとても便利です。

が、「自分のサイト専用のロゴが欲しい」という方のために、独自のロゴを作成できるアプリもWixには用意されていますので、別の記事でご紹介したいと思います。

 

エディタで使えるショートカットキー

動画では紹介できませんでしたが、Wixのエディタでは以下のようなショートカットキーを使えます。ほとんどがExcelなどのWindows系のアプリケーションと同じものなので、直観的に操作できて便利です。

 

操作 説明
Ctrl + X 切り取る
Ctrl + C コピー
Ctrl + V ペースト
Ctrl + D 複製
Delete Backspace パーツを削除
Ctrl + ← 背面へ移動
Ctrl + → 前面へ移動
Ctrl + Shift + ← 最背面へ移動
Ctrl + Shift + → 最前面へ移動
←, ↑, →, ↓ 1ピクセル移動 (Nudge など)
Ctrl + ↑, ↓ 10ピクセル移動
Ctrl + Z 元に戻す
Ctrl + Y やり直す
Ctrl + M 次のパーツを選択
Ctrl + Shift + M 前のパーツを選択
Ctrl を押しながらパーツをクリック 複数のパーツを選択
Shift を押しながらパーツをクリック 複数のパーツを選択
Shift を押しながらパーツを回転 パーツを15度ずつ回転
Shift を押しながらパーツをドラッグ 同じXとY軸にパーツを整列
Ctrl + S 保存
Ctrl + P プレビュー
Shift + f エディタコントロールを表示・非表示

 

まとめ

ここまで見ていただくと、プログラミングの知識は一切必要ないことがお分かりになるかと思います。しかも、デザインの知識がなくても、世界中のデザイナーが用意したテンプレートを利用することで、まるでデザイナーが作ったようなサイトを作成することが可能ですし、パーツの配置・配色も綺麗になるようサポート機能が充実しています。ホームページ作成ツールは多くありますが、デザインにこだわりたいなら是非Wixを試していただきたいと思います。