「毎回同じデザインのブロックを一から作るのが面倒…」 「クライアントごとに似たようなヘッダーやCTAを何度も組んでいて、正直時間がもったいない…」
WordPressテーマ「SWELL」を使っているWEBデザイナーやコーダーの方の中には、こんなお悩みを抱えている方も多いのではないでしょうか。
実はSWELLには「マイパターン」という、よく使うデザインをワンクリックで呼び出せる便利な機能があります。この機能を使いこなせば、制作のたびにゼロからブロックを組む手間がなくなり、作業スピードも大きくアップします。
この記事では、SWELLのマイパターンの基本的な使い方から登録方法、初心者が混乱する同期と非同期設定の違いについて、わかりやすく解説していきます。
SWELLの「マイパターン」とは?基本機能を解説
マイパターンでできること
マイパターンとは、自分がよく使うブロックのデザインを保存しておき、必要なときにいつでも呼び出せる機能です。
たとえば以下のようなパーツを保存しておくことができます。
- ⚫︎ お問い合わせボタン付きのCTAブロック
- ⚫︎ サービス紹介用のカードデザイン
- ⚫︎ よく使う見出しデザイン
- ⚫︎ 独自にカスタマイズしたヘッダーやフッターの一部
一度デザインを作ってしまえば、次回からはそのパターンを呼び出すだけで同じ見た目のブロックを再現できます。
マイパターンを使うメリット(作業効率化)
マイパターンを活用する一番のメリットは、なんといっても作業時間の短縮です。
- ⚫︎ ゼロからデザインを組む手間が省ける
- ⚫︎ 装飾やスタイル設定を毎回やり直さなくて済む
- ⚫︎ サイト全体でデザインの一貫性を保ちやすい
- ⚫︎ 制作フローがシンプルになり、ミスも減らせる
特に複数のサイトを制作するコーダーやデザイナーにとっては、案件をまたいで使い回せる点も大きな魅力です。
マイパターンの登録方法
1.投稿や固定ページの編集画面で、パターン登録したいブロックを選択する。
2.ブロックツールバーの「︙」アイコンをクリックする。
3.「パターンを作成」を選択する。
4.パターンの名前を入力し、同期(変更が全体に反映される)か非同期(個別に編集できる)かを選んで保存する。
このとき、あとで使い回しやすいように、色やフォントサイズなどの装飾も含めて仕上げておくのがポイントです。
名前をつける際は、後から見てもすぐに内容がわかるよう、「CTA_問い合わせ用」「ヘッダー_シンプル型」のように、用途がひと目でわかる名称にしておくのがおすすめです。
マイパターンの同期と非同期の違い
【同期パターン】
- 特徴:どこか1箇所を修正すると、そのパターンを使っているすべてのページに自動で変更が反映されます。
- イメージ:器も器の中身も全てのページで同じものを表示させる。内容を変えたら、過去の記事も含めてすべて自動で書き換わってほしいもの。
- 向いている用途:アフィリエイトなどの「おすすめ商品リンク(あとでリンクを一括変更したい)
【非同期パターン】
- 特徴:ページに配置した後は完全に独立します。登録内容を後から変えても、すでに配置したページには反映されません。
- イメージ:器は全てのページで同じものを使いたいけど、器の中身はページ毎に変えたい
- 向いている用途:記事の定型レイアウト(中身の文章だけを毎記事書き換えられる)
【同期パターンと非同期パターンの見分け方と特徴】
- 同期パターンは、編集画面で選択した際に紫色の枠で表示されます。
- 非同期パターンは、配置した後は通常のブロックと同じ扱いになり、個別に自由な編集ができます。
マイパターンの使い方
下記の手順で使用します。
- 1.記事編集画面の左上にある「+」ボタンをクリックする。
- 2.「パターン」タブを開き、カテゴリから「マイパターン」を選ぶ。
- 3.使いたいパターンをクリックすると、ページ内に挿入される。
クライアント案件でテンプレート化して時短
案件ごとに似たような構成のページを作る機会が多いコーダー・デザイナーの方は、ページ単位でのパターン化もおすすめです。
- ⚫︎会社概要ページのレイアウト
- ⚫︎サービス紹介ページの基本構成
- ⚫︎お問い合わせフォーム周りのデザイン
あらかじめ「型」を用意しておくことで、クライアントごとの個別対応に集中する時間を増やすことができます。
まとめ
SWELLのマイパターン機能を活用すれば、日々の制作作業を大きく効率化できます。
最初はひとつのパターンを登録するところから始めてみましょう。使い慣れてくるほど、制作スピードの違いを実感できるはずです。ぜひこの記事を参考に、マイパターンを活用した効率的なサイト制作を進めてみてください。
