WordPressブロックエディターのレスポンシブ対応カラムデザインの使い方
CSSをカスタマイズしなくてもカラムデザインが簡単にできます。ページを 2 ~ 3列に分割して、それぞれに画像や文章でデザインしたいことがあります。tableを使ったデザインは比較的容易に作ることができますが、レスポンシブに対応させるには知識も要求されます。テーマによってはカラムデザインのCSSが用意されている場合がありますが、スタイルシートのカスタマイズが必要な場合もあります。 Gutenberg にはデフォルトでカラムデザインが装備されているのでこちらを利用すれば簡単に記事を書きあげることができます。
カラムを利用するには、ブロックの選択から、デザインカラムを選択します。
続いて分割する割合を指定します。指定できる割合は 50% :50% , 30%:70% ,70%:30% , 33%:33%:33% , 25%:50%:25% になっています。
各カラムには、画像や文章を埋め込んでいくことができます。注意点はショートコードなどで、横幅を指定しているものがあるとレイアウトが崩れることもあります。ブラウザの世幅を最小にして確認するかスマートフォン等で表示の確認はしておくべきです。
Gutenberg のメリットとデメリット
「Gutenberg」は従来の「Classic Editor」から切り替えられるとアナウンスされ、公式サイトでは以下のようにコメントされています。「Classic Editor は公式な WordPress プラグインであり、少なくとも2022年まで、または必要なくなるまでの間、完全にサポート・保守されます。」
サポート終了が近くなっていますが、「Gutenberg」への移行率が低くしばらくは「Classic Editor」も利用できそうです。
メリット | デメリット |
---|---|
ブロックの種類が多い、カラムを分割することができる、ギャラリーやボタン、ウイジェットなども挿入できる。高度なデザインのページ編集ができる | 高度なデザインの記事を作るには便利ですが、高機能なことで操作が難しく感じられる |
コンテンツの色やサイズを細かく設定できる | ブロックの生成作業が面倒、記事を書き進めるたびにブロックを選択して生成する手間が発生する |
ブロックごとに簡単にコピーしたり入れ替えたりできる | クラッシックブロックがビジュアルエディタにしか対応していない |
Gutenberg への移行
「Gutenberg」はいづれWordPressのデフォルトエディタになることは間違いないでしょう。当初の予定では2021年12月31日で「Classic Editor」のサポートを終了するはずでした。しかし、その後思ったほど「Gutenberg」の使用率が高くないため、2022年以降、必要ならばサポート保守される方針に変更されました。
WordPress導入時から「Gutenberg」を利用しているサイトは問題ありませんが、「Classic Editor」でサイトを構築している場合はそれなりに準備をされることが推奨されます。エディタを切り替えることで表示されない等はありませんが、編集に戸惑ってしまう、編集に関するプラグインが利用できないといったことは発生します。(「Add Quick Tag」は機能しなくなります。)この際徐々に変更されるのがお勧めかもしれません。
WordPressのブロックエディタ(Gutenberg)は直感的に編集できる優れたエディタですが、記事を装飾したり、レイアウトデザインをしたいときには少し戸惑うこともあるかもしれません。編集機能がサポートされているテーマを利用すと悩みを解決できるかも。凝ったデザインや複雑なレイアウトを提供してくれる業者やフリーターを探すサービスも利用価値があるのでは?
有料WordPressテーマは、カスタマイズの柔軟性も高く、プラグインを新たにインストールしなくても十分な機能が装備されているので、コンテンツ作りに集中することができます。
THE THOR
ザ・トールは、圧倒的に美しくおしゃれなテーマです。ランキングサイト・口コミサイトやおしゃれで美しいデザイナーズサイトが簡単に作れます。アクセスUP、収益UPを強力に後押しする「集客・収益化支援システム」が搭載されていて、コーポレートサイトやビジネス用メディアブログ、ブロガー・アフィリエイターなどの利用に適しています。
※ザ・トールは、デザイン経験のない初心者でも「美しく・バランスの取れたサイト」をクリック操作だけで作れるように設計されています。煩わしいCSSをいじる必要もありません。また、デザインの拡張性が極めて高いため、自分だけのオリジナルデザインのサイトが作れます。トールを使用している他のユーザーとデザインが被ってしまう心配もありません。
「デザイン着せ替え機能」を使えば、プロのデザイナーが制作したデモサイトと同じデザインのサイトがワンクリック・数秒で完成。デザイン設定の必要は一切なく、直ぐにサイトの運営をスタートできます。他のWordPressテーマのようにデザイン設定で悩む必要はもうありません。