▼この記事のポイント
- 1 2022年頃からElementor専門のWebデザイナーが大量発生
- 2 ワードプレスプラグインのエレメンターとは
- 3 ワードプレスでエレメンターを使えるテーマ・テンプレート
- 4 ワードプレスでエレメンターで作ったらレスポンシブデザインになる？
- 5 エレメンターで作成したページのデザインが崩れる原因
- 6 エレメンターでヘッダーを作成する方法・使い方
- 7 「Elementor Header & Footer Builder」プラグインの活用
- 8 エレメンターでサイトを作る最大のデメリット
- 9 ワードプレスの更新ができない？エレメンターでよく起きるサーバーエラー（500サーバーエラーなど）
- 10 500サーバーエラーが起きるレンタルサーバーの場合はスペックの高いサーバーに変更しても良いかも
WordPressでのウェブサイト構築は、多くの初心者にとって一大プロジェクトとなり得ます。しかし、Elementorプラグインの登場により、コーディングの知識がなくてもクリエイティブでプロフェッショナルなサイトが簡単に作れるようになりました。多くの人がエレメンタープラグインはすごいと絶賛しています。
無料で使えるのでたくさんの人がエレメンターを使ってサイトを作っていますが、デメリットと言いますか、メンテナンスが結構できていないなという印象もあるので、私はエレメンター非推奨な立場からこの記事で語っていきたいと思います。
2022年頃からElementor専門のWebデザイナーが大量発生
実際、2022年頃からWebデザイナー養成としてエレメンターを使って、副業だったりでWebデザイナーデビューしましょうというコンサルタントやセミナーが大量発生しました。
確かに、直感的でコードフリーのサイト作成ができ、Elementorがあれば、アイデアをすぐに直感的な操作でページに落とし込めるので初心者には入りやすいです。ページは作りやすいのですが、メンテナンスの面では少し難があり私自身はめったに使うことはないプラグインです。
デメリットやよくあるエラーを踏まえつつエレメンターについて少し語ってみたいと思います。正直、エレメンターで作成したサイトのエラーを修正するのは普通に作ったサイトに比べると複雑で面倒で確認する工数が多くなるのでエラー修正費用としても高くならざるを得ません。
ワードプレスプラグインのエレメンターとは
「Elementor（エレメンター）」は、イスラエルのソフトウェア開発会社によって2017年にリリースされたWordPress向けのページビルダープラグインです。このツールを使えば、直感的なドラッグ＆ドロップ操作で簡単にウェブページを構築できます。これは非常に優れたプラグインであると言えるでしょう。
特にWordPressの初心者にとって、HTMLやCSSなどの専門知識がなくても、美しいデザインのウェブページを作成することが可能です。一般的に、有料のWPテーマを使用する場合は、ある程度決まったレイアウトの範囲内で作業を行う必要がありますが、Elementorを使用すると、直感的な操作でスタイリッシュなウェブページを迅速に作成することができます。もちろん、ある程度のデザインセンスが求められるかもしれませんが、それはどのようなウェブページ作成方法においても同じです。
ワードプレスでエレメンターを使えるテーマ・テンプレート
エレメンターを使うには特定のテーマが必要かと考えている方もいらっしゃるかと思いますがそんなことはありません。エレメンターもWordPressで使える一般的なプラグインの一つなので、別にどのテーマを使っていてもエレメンターを使うことはできます。ただしもともとデザイン性の高いテーマを使っている場合にはエレメンターと相性があまり良くなく元々のテーマの枠を抜け出せないことがあります。エレメンターを使う場合にはできるだけシンプルなテーマ、自分が作りたいデザインに近い枠組みのテーマを利用するのが良いでしょう。
ワードプレスでエレメンターで作ったらレスポンシブデザインになる？
エレメントのプラグインを使ってサイトを作成する場合、もともとになっているテーマ（テンプレート）のデザインがレスポンシブデザインに対応しているかどうかがまず確認が必要です。現在出回っているほとんどのワードプレステーマはレスポンシブデザインになっていますのでこの部分は念のためという感じです。
そしてプラグインのエレメンターがレスポンシブデザインになっているかについては一応なっているという状態です。
一応という言葉をつけたのは、外観として設定するテーマのレスポンシブデザインのスタイルシートと、エレメントのプラグインで設定しているスタイルシートが両方適用される状態になるので崩れる場合はあります。
エレメンターで作成したページのデザインが崩れる原因
今紹介したようにエレメンターで作成したページは複数のスタイルシート（横幅や縦幅や位置を定めているファイル）が絡み合ったような状態で表示されます。まずこの絡み合った状態により横幅や画像の位置などのデザインが意図しないような状態になることがあります。
その他にエレメンターで作成したページのデザインが崩れる原因として多いのは、キャッシュ系のプラグインを入れていたり、スタイルシートを圧縮するプラグイン、レンタルサーバーの機能としてスタイルシートやJavaScriptを圧縮したりする機能を有効化しているなどがあります。
エレメンターを使用している場合ただでさえコードが複雑になっている状態なので、ページの表示速度を早くしようとファイルを圧縮したりキャッシュを作成したりするとデザインがバグってしまうことがあります。
エレメンターでヘッダーを作成する方法・使い方
エレメンターというのはあくまでもワードプレスのプラグインの一つなので、ヘッダーを作るために元々使っているテーマのヘッダーの部分を編集するか、もしくはエレメンターの姉妹プラグインである「Elementor Header & Footer Builder」プラグインを使うかになります。おそらくエレメンターでサイトを作っている人はテーマのスタイルシートやコードをいじったりすることをしたくないと思いますので今回はプラグインで行う方の使い方を簡単にお伝えします。
このプラグインを利用すると、Elementorを用いてウェブサイトのヘッダーとフッターを自由にカスタマイズできます。特に、個性的なデザインを求める方に最適です。
「Type of Template」
「Type of Template」では、使用するテンプレートの種類を選択します。例として、ヘッダー作成のために「Header」オプションを選びます。
「Display On」
「Display On」では、表示するページや投稿を選択する機能です。細かい設定も可能ですが、今回はすべてのページと投稿にヘッダーとフッターを表示する「Entire Website」を選択します。
「User Roles」
「User Roles」ではどのユーザーがヘッダーやフッターを見ることができるか、または非表示にするかを決める機能です。今回は「All」を選択し、全ユーザーに対して表示します。
「Enable Layout for Elementor Canvas Template？」
このオプションでは、Elementorのキャンバステンプレートで特定のレイアウトを有効にするかどうかを選べます。キャンバステンプレートはElementorの編集画面左下の歯車アイコンからアクセスできるページテンプレートです。
エレメンターでサイトを作る最大のデメリット
エレメンターでサイトを作った場合の最大のデメリットは、エレメンターで作ったサイトを元のワードプレスの標準エディターで作った状態に戻すことがかなり難しいということです。つまりエレメンターで作り出したら、ずっとエレメンターに頼りきらなくちゃいけないということになります。今でこそ無料で色々なことができていますが、今後どうなるかわかりませんし、すごく簡単にできるというイメージだけが先行して、ワードプレスを甘く見てエラーで画面真っ白、修正方法もバックアップ方法もわからないなどという事例もよくあります。
ワードプレスの更新ができない？エレメンターでよく起きるサーバーエラー（500サーバーエラーなど）
最近はエレメンターを使ってWebデザインを副業にしましょうなどという動きがとても活発なので多くの人がエレメンターを使うようになりました。エレメンターでサイトのデザインをするのはとても簡単にいろいろな表現ができるので使い勝手が良い部分はありますが、それゆえにレンタルサーバーのメモリーを使い過ぎてエラーが起きることがあります。
特にロリポップやさくらサーバーなどの格安プランのレンタルサーバーだと初期設定がスペック低めになっているのでエレメンターで少し重たい画像や動画などをつけたりしていくと500サーバーエラーで更新ができなくなったり、他のプラグインが動かなくなったりすることがあります。
.htaccessやmyphpでメモリを増やせば多くの場合は解決しますが、それぐらいでエラーが起きるサーバーの場合にはサーバーの乗り換えを検討した方が良いかと思います。
500サーバーエラーが起きるレンタルサーバーの場合はスペックの高いサーバーに変更しても良いかも
WordPressのサイトもWordpress簡単移行という機能が付いているので、他のレンタルサーバーからちょっと情報を入力するだけで乗り換えができます。
