SWELLの始め方ガイド|これからSWELLを使い始める方はこちら→SWELLの始め方ガイド→クリックタップ

SWELLブログパーツの使い方!記事内でもウィジェットでも大活躍の便利機能!

SWELLブログパーツの使い方!記事内でもウィジェットでも大活躍の便利機能!
  • URLをコピーしました!

WordPressテーマSWELLには「ブログパーツ」という便利な機能があります。

頻繁に使うブロックを登録しておくと、他の記事内でも簡単に使いまわすことができます。

いろんな用途で活躍する機能です…!
この記事の内容まとめ
  • ブログパーツの登録方法
  • ブログパーツの便利な機能や使い方

ブログパーツは、ウィジェットなどにもショートコードで呼び出すことができます。

また、カテゴリーやタグページ、著者アーカイブページのカスタマイズにもブログパーツを活用できます。

さとしん

僕の周りのSWELL仲間から聞いたSWELLの評判や口コミでもブログパーツの便利さは好評でした…!

目次

SWELLのブログパーツ機能とは?

ブログパーツ機能は、登録しておいたブロックの組み合わせや文章を他の場所でも簡単に呼び出せるようになる機能です。

公式サイトの以下ページ内で詳しく解説されています。

>>

複数の記事で使い回したい文章やコンテンツがある場合には、ブログパーツ機能を活用するとかなりの効率化になります。

さとしん

ぜひ覚えておきましょう…!

また、WordPressのブロックエディターでは、ブログパーツに似た「再利用ブロック」という機能があります。

ブログパーツ機能と再利用ブロックの違いやブログパーツの便利な点を紹介します。

再利用ブロックとの違い

再利用ブロックも、複数の記事で使いたい文章やブロックを登録しておくことで、簡単に使い回すことのできる機能です。

再利用ブロックは、WordPress側で用意している機能です。

一方で、ブログパーツはSWELL専用の機能です。

ブログパーツは、登録したパーツをショートコード化して、記事以外のいろいろな場所でも使えます。

再利用ブロックはデフォルトの状態ではショートコード化することができないため、記事内での使用が主となります。

再利用ブロックも、プラグインを使うことでショートコード化することもできます。

再利用ブロックについてはこちらの記事で詳しく解説しています。

>>再利用ブロックの使い方!ブロックエディターで定型文を使い回す方法!

さとしん

ブログパーツは用途が多彩でとっても便利です…!

ショートコードで様々な場所に呼び出せる

上述のとおり、SWELLのブログパーツはショートコードで様々な場所に設置できます。

例えば以下の場所に設置できます。

  • 記事内
  • ウィジェット
  • メインビジュアル
  • カテゴリー、タグページ
  • 著者アーカイブページ

また、この他にブロックパターンとしてブログパーツを使うこともできます。

>>ブロックパターンの使い方!ブロックエディターで組んだレイアウトを使い回そう!

それぞれの詳しい使い方は後述します。

ブログパーツの登録方法

コンテンツをブログパーツに登録する方法を解説していきます。

さとしん

とっても簡単です…!

STEP
管理画面→「ブログパーツ」→「新規追加」をクリック
ブログパーツの使い方-1
STEP
自由にブロックを組み合わせたり文章を入力する
ブログパーツの使い方-2
STEP
用途を選択

使用したい場所に合わせて用途を設定します。未設定でもOKです。

ブログパーツの使い方-3
STEP
公開ボタンをクリック
ブログパーツの使い方-4

これで好きなコンテンツをブログパーツとして登録、保存しておくことができます。

ブログパーツの用途は以下の4種類から選択できます。

  1. カテゴリー
  2. タグ
  3. CTA
  4. ブロックパターン

ここから、用途別の設定方法と、登録したブログパーツを実際にサイト上に呼び出す方法を紹介していきます。

ブログパーツの使い方

登録したブログパーツの基本的な使い方、設定方法を以下の用途別に紹介していきます。

  1. 記事内で使う場合
  2. ウィジェットで使う場合
  3. メインビジュアルで使う場合
  4. カテゴリー、タグページで使う場合
  5. ブロックパターンとして使う場合
  6. 著者アーカイブページで使う場合

ブログパーツを登録するときの用途によって使える場所が変わるので、参考にしてください。

記事内で使う方法

記事内でブログパーツを呼び出すときは、用途は未設定もしくはブロックパターンにしておきましょう。

以下の手順で記事内にブログパーツを呼び出すことができます。

STEP
空白の段落ブロックで「+」ボタンをクリック
ブログパーツを記事内で使う方法-1
STEP
ブログパーツをクリック
ブログパーツを記事内で使う方法-2
STEP
使いたいブログパーツを選択
ブログパーツを記事内で使う方法-3

これでブログパーツを記事内に設置することができました。

ブログパーツブロックを呼び出すときは、他のブロックと同様に「/」を使う方法でもOKです。

以下のように入力すると簡単にブログパーツブロックを呼び出すことができます。

  • /blogparts
  • /ブログパーツ
ブログパーツを記事内で使う方法-4

参考まで、「/」を使う方法などブロックエディターで使えるショートカットキーを以下の記事でまとめています。

>>ブロックエディターの記事執筆を快適にするショートカットまとめ!

ウィジェットで使う方法

ウィジェットにブログパーツを設置することもできます。

ウィジェットに配置する場合は、用途はどの設定でも大丈夫です。

以下の手順でウィジェットにブログパーツを呼び出すことができます。

STEP
管理画面→「ブログパーツ」から呼び出しコードをコピー

使いたいブログパーツのショートコードをCtrl(command)+CでOK。

ブログパーツをウィジェットで使う方法-1
STEP
管理画面→「外観」→「ウィジェット」をクリック
ブログパーツをウィジェットで使う方法-2
STEP
カスタムHTMLをお好きなウィジェットエリアに配置

テキストウィジェットでもOKです。

ブログパーツをウィジェットで使う方法-3
STEP
「内容」欄にショートコードを貼り付け

Ctrl(command)+VでOK。

ブログパーツをウィジェットで使う方法-4

ウィジェットタイトルもお好みで入力してください。

例えば、投稿リストブロックのリスト型で記事を表示させたブロックをブログパーツに登録して、サイドバーウィジェットに設置するということもできます。

さとしん

工夫次第でウィジェットにいろいろなコンテンツを配置できますね…!

メインビジュアルで使う方法

メインビジュアルにブログパーツを呼び出すこともできます。

メインビジュアルにブログパーツを呼び出す場合も、用途はどの設定でも大丈夫です。

以下の手順でメインビジュアルにブログパーツを呼び出すことができます。

STEP
管理画面→「ブログパーツ」から呼び出しコードをコピー

数字の部分だけでOKです。

ブログパーツをメインビジュアルで使う方法-1
STEP
管理画面→「外観」→「カスタマイズ」をクリック
ブログパーツをメインビジュアルで使う方法-2
STEP
「トップページ」→「メインビジュアル」をクリック
ブログパーツをメインビジュアルで使う方法-3
STEP
「ブログパーツID」欄にIDを貼り付け

数字だけ入力すればOKです。

ブログパーツをメインビジュアルで使う方法-4

メインビジュアルは通常、テキストとボタンしか配置できない仕様です。

ここにブログパーツを設置することで、かなり自由度の高いメインビジュアルにすることが可能です。

ボタンを複数設置したり、リストや画像も自由に配置することができます。

さとしん

ぜひ、いろいろ試してみてください…!

カテゴリー、タグページで使う方法

カテゴリー、タグなどのアーカイブページでは、以下2種類の使い方ができます。

  1. CTA
  2. ページ上部に設置

カテゴリーページ、タグページのカスタマイズについては以下の記事で詳しく紹介しています。

この記事でも簡単にそれぞれ紹介します。

カテゴリーCTA

CTAウィジェットエリアに表示される内容をカテゴリーごとに出し分けることができます。

CTA:Call To Actionの略で、読者の行動を促すためのもの

CTAウィジェットは、各記事の下部「この記事を書いた人」の上のあたりに表示されます。

SWELLのCTAウィジェット

上記エリアに表示される内容をブログパーツで個別に設定することができます。

CTAで使う場合、ブログパーツの用途は「CTA」に設定しておきましょう。

カテゴリーごとにCTAを設定する方法は以下のとおりです。

STEP
管理画面→「投稿」→「カテゴリー」→編集したいカテゴリーを選択
ブログパーツをCTAに使う方法-1
STEP
「このカテゴリーのCTA」で使いたいブログパーツを選択

IDを入力でもOKですが、「ブログパーツを選択する」からプルダウンで選択できます。

ブログパーツをCTAに使う方法-2

これだけの手順でカテゴリー毎にCTAを個別に設定することができます。

ページ上部に表示

カテゴリーとタグページの上部にブログパーツを挿入することもできます。

公式サイトの以下ページでも解説されています。

>>

デフォルトの状態では記事の一覧が並ぶだけですが、以下のイメージで記事一覧の上にブログパーツを設置できます。

アーカイブページでブログパーツを使う方法-2

この場合、ブログパーツの用途は「カテゴリー用」、「タグ用」に設定しておきましょう。

記事一覧の上にブログパーツを設定する方法は以下のとおりです。

STEP
管理画面→「投稿」→「カテゴリー or タグ」→編集したい項目を選択
ブログパーツをCTAに使う方法-1
STEP
「ページで呼び出すブログパーツ」で使いたいブログパーツを選択

IDを入力でもOKですが、「ブログパーツを選択する」からプルダウンで選択できます。

アーカイブページでブログパーツを使う方法-1

これで、各アーカイブページの記事一覧の上にブログパーツが呼び出されました。

この機能を使うと、アーカイブページをカスタマイズすることができます。

さとしん

カテゴリーページをまとめ記事のように記事化することもできますよ…!

カテゴリーページのカスタマイズについては以下の記事に詳しくまとめました。

ブロックパターンとして使う方法

SWELLでは、ブログパーツ機能からブロックパターンを登録することができます。

テーマによってはブロックパターンの登録ができないこともあり、その場合はプラグインが必要になります。

ブロックパターンは以下の記事で詳しく紹介しています。

>>ブロックパターンの使い方!ブロックエディターで組んだレイアウトを使い回そう!

ブロックパターンを使う方法は以下のとおりです。

STEP
投稿画面の左上にある「+」ボタンをクリック
ブログパーツを記事内で使う方法-1
STEP
パターンをクリックし、カテゴリーを選択
SWELLのブロックパターン-1
STEP
お好みのブロックパターンをクリック
SWELLのブロックパターン-2

良く使うブロックの組み合わせはブロックパターンに登録しておくと作業時間の短縮になります。

さとしん

便利な機能なのでぜひ使ってみてください…!

著者アーカイブページで使う方法

著者アーカイブページにもブログパーツを挿入することができます。

著者アーカイブページでSWELLのブログパーツを使う方法-1

この機能は、ver. 2.5.9アップデートで追加されました。アップデート詳細は以下リンク先でご確認ください。

>>

以下の手順で著者アーカイブページにブログパーツを呼び出すことができます。

STEP
管理画面→「ユーザー」→「プロフィール」をクリック
著者アーカイブページでSWELLのブログパーツを使う方法-2
STEP
プロフィール内の「ブログパーツのID」欄に使いたいブログパーツのIDを入力して保存

ブログパーツの呼び出しコード『blog_parts id=”xx“』の赤文字部の数字を入力してください。

著者アーカイブページでSWELLのブログパーツを使う方法-3

著者アーカイブページに少し詳しいプロフィールを挿入するなど、工夫次第で柔軟にカスタマイズできます。

ブログパーツを活用してコンテンツ制作の効率化を!

SWELLのブログパーツ機能について紹介しました。

良く使うコンテンツを使いまわせるだけでなく、ショートコード化して様々な場所に設置することができます。

ブログパーツを活用することで、カテゴリーやタグページをカスタマイズすることもできます。

ぜひ、ブログパーツを活用して、効率よく、素敵なサイトを運営してきましょう。

最後まで読んでいただきありがとうございました。


はこちらからどうぞ…!

SWELLブロックエディターの関連記事

SWELL全般の関連記事

SWELLブログパーツの使い方!記事内でもウィジェットでも大活躍の便利機能!

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次