WordPress ショートコード – 使用すべき理由

公開: 2021-10-08

WordPress の投稿、ページ、サイドバーに動的コンテンツを簡単に追加したいですか? ショートコードを追加することは、それを行うための最も簡単で最適な方法であり、WordPress サイトのどこにでも配置できるという追加の利点があります.

さまざまな場所で同じショートコードを使用してもまったく同じ結果が得られるため、WordPress Web サイトに再利用可能な機能を追加するには、ショートコードほど優れた方法はありません。選択できるデフォルトのショートコードにはさまざまなものがありますが、WordPress プラグインの中には、追加機能として新しいショートコードを追加できるものもあります。

このブログでは、WordPress ショートコードについて、どのように、どのように機能し、どのように使用するかについて知っておく必要があるすべてを説明し、このガイドから知っておく必要があるすべてを学んでいただければ幸いです. 始めましょう！

ショートコードとは？

ショートコードは、「ショートカットとコード」という言葉のかばん語です。

これは通常、角括弧 [ ] で識別して示すことができる小さなコードであり、任意のページまたは投稿に挿入すると、事前定義された特定の機能を生成するコードです。

たとえば、ギャラリーを追加する場合、WordPress サイト内の任意のページまたは投稿に次のコードを追加できます。

これにより、コード内で参照されているサイトの画像 ID を含むギャラリーが出力されます。コードによると、ギャラリーには 4 つの列があり、それらの最大サイズは「中」になります (WordPress で定義)。さまざまな機能を出力するために、WordPress で利用できるこのような小さなショートコードが他にもたくさんあります。以下では、WordPress サイトで使用できるさまざまな種類の WordPress ショートコードについて説明します。

ショートコードの種類

WordPress は 2 種類のショートコードを提供します –

自己終了ショートコード: これらは終了タグを必要としません。 たとえば、ギャラリーのショートコード –

– 終了タグは必要ありません。

ショートコードを囲む: これらのタイプのショートコードには終了タグが必要です。 たとえば、キャプションのショートコード –

– コンテンツのキャプションをラップするために使用されます。

デフォルトの WordPress ショートコード

以下は、WordPress が提供する 6 つのデフォルトのショートコードです。

オーディオ: オーディオファイルを埋め込み、Web サイトで再生できるようにします。
キャプション: キャプションをコンテンツに巻き付けるのに役立ちます。
埋め込み: 埋め込みアイテムの最大レベルを設定したり、埋め込みにさまざまな属性を設定したりできます。
ギャラリー: カスタマイズ可能な画像ギャラリーをサイトに追加します。これらの機能を使用して、ギャラリーの外観をカスタマイズしたり、使用する画像を決定したりできます。
プレイリスト: これらの自己完結型ショートコードを使用して、オーディオまたはビデオのプレイリストを作成できます。
ビデオ: ビデオファイルを埋め込んで再生できます。このショートコードを使用すると、MP4、WebM、M4V、OGV、WMV、Flv などの形式の動画を埋め込むことができます。

これらのデフォルトのショートコードに加えて、多くのWordPress プラグインは、同じように使用できるカスタムショートコードを提供します。

WordPressでショートコードを使用する方法

WordPress でショートコードを使用するプロセスはシンプルで簡単ですが、サイトのどこにショートコードを追加するかによって異なります。

ページと投稿で WordPress ショートコードを使用する

まず、ショートコードを追加するそれぞれのページ/投稿に移動し、エディターにアクセスします。次に、ブロックの追加ボタンをクリックして、ショートコードブロックを追加する必要があります。

Gutenberg エディターを使用している場合は、ショートコードブロックにショートコードタグを簡単に追加できます。ショートコードブロックを追加したら、ショートコードをテキストボックスに貼り付けるだけで完了です。ショートコードの機能が公開されたページに表示されるようになりました。

WordPress ウィジェットにショートコードを挿入する

ショートコードを WordPress ウィジェットに挿入することも、かなり簡単で簡単です。 WordPress 5.8 の最新リリースには、Gutenberg Block ベースのウィジェットエリアが組み込まれているため、ウィジェットに Gutenberg ブロックを追加してカスタマイズできるようになりました。

まず、WordPress ダッシュボードの [外観] > [ウィジェット] に移動します。ここには、テーマに基づいて事前に作成されたすべてのウィジェットがあります。ショートコードを追加するウィジェットを選択し、Gutenberg ショートコードブロックを見つけます。ショートコードをブロックに挿入し、完了したら [保存] ボタンをクリックします。

これでタスクは完了です。それぞれのページにアクセスして、ショートコードの動作を確認できます。

WordPress テーマファイルにショートコードを追加する

WordPress の投稿/ページおよびウィジェット内でショートコードを使用する方法については既に説明しました。 WordPress では、テーマファイル内にショートコードを追加することも簡単になりました。以下の形式に従って、任意の WordPress テーマテンプレートにショートコードを追加できます。

WordPress でカスタムショートコードを作成する方法your_shortcode を選択したショートカットに置き換えるだけで、意図したとおりに機能することがわかるはずです。

カスタムショートコードを作成するには、技術とコーディングの知識がすべてです。また、カスタムショートコードを作成する必要がある理由と、それを使用する場所についてもしっかりと理解している必要がある場合にも役立ちます。

カスタムショートコードを作成するには、まず Web サイトのバックエンドファイルディレクトリを開きます。次に、wp-content > themes > youractivetheme > function.php ファイルに移動します。ショートコードに必要な機能を入力し、後で使用するために保存できます。

以下は、WordPress Web サイトに Twitter アカウントを表示するためにカスタムショートコードを作成した例です。

次に、Gutenberg ショートコードブロックを使用して、ショートコードを Web サイトの連絡先ページに追加します。

このショートコードがフロントエンドでどのように機能するか見てみましょう。

カスタムショートコードスクリプトを追加する場所

カスタムショートコードをテーマファイルに追加する場合は、テーマのfunctions.phpファイルに追加するか、プラグインに含めることができます。それらをテーマファイルに追加する場合は、子テーマを作成し、元のテーマを元に戻す必要がある場合に備えて、コードを安全に変更できます。

WordPress サイトのプラグインに新しいショートコードを追加する場合は、WordPress の読み込みが完全に完了してから初期化することをお勧めします。これを行うには、「ラッパー関数」と呼ばれるメソッドを使用して add_shortcode() 関数を別の関数内にラップします。

add-action()関数フックを使用することで、「shortcodes_init」ショートコードは、init フックを使用して WordPress サイトの読み込みが完全に終了した後にのみ初期化するように指示されています。

ショートコード vs グーテンベルクブロック

ショートコードの操作は実際にはグーテンベルクブロックと非常に似ており、後者はさまざまなカスタマイズオプションを提供します。 Gutenberg の登場以来、ショートコードの使用と人気はわずかに減少しており、多くの人気のある WordPress プラグインがショートコードの代わりに専用の Gutenberg ブロックを使用するようになりました.

専用の Gutenberg ブロック内にショートコードを追加することはできますが、ブロックだけでもショートコードの目的を達成でき、より最適化された方法で行うことができます。

ショートコードが便利な場合は、ブロックを使用すると同じことをよりユーザーフレンドリーな方法で実行できるため、WordPress ブロックを好むかもしれません。また、ユーザーは、ショートコードでは不可能な、より直感的なユーザーインターフェイスを使用して投稿/ページに動的コンテンツを追加することもできます。

ただし、まだブロックに置き換えられていない用途がまだいくつかあるため、これは従来のショートコードの完全な終焉を意味します。そのため、近い将来、ショートコードの使用が続く可能性があります。

ショートコードを使うメリットとデメリット

利点

ショートコードを使用すると、1 行のコードで WordPress サイトに複雑な機能を簡単に追加できます。
通常、ショートコードは、従来の HTML コードや PHP スクリプトよりも簡単に作成および設定できます。
特定の機能を挿入するたびに開発ワークフローを自動化することで、複雑なスクリプトを記述する必要がなくなります。
ショートコードは簡単にカスタマイズできるため、ユーザーは属性オプションを変更することで同じショートコードがどのように機能するかを変更できます。
プラグイン内に挿入できるので、WordPress を更新したり、テーマを変更したりしても、ショートコードは失われず、以前と同じように機能し続けます。

短所

直感的ではない: 1 つのページで複数のショートコードを使用し、それらをカスタマイズするのは困難な場合があります。
テーマ依存: テーマを変更するとすぐに、ショートコードが新しいテーマで動作しなくなることがあります。
HTML が壊れる可能性があります: 相互運用性の問題や競合するタグが原因で、問題が発生することがあります。そのため、サイトでそれらを使用する場合は、バックアッププラグインを配置する必要があります。
追加のサーバー負荷: ショートコードを追加すると、サーバーに負荷がかかる場合があります。ページ/投稿のショートコードの数が増えると、当然のことながら負荷も増加し、Web サイトの速度が低下する可能性があります。

WordPress ショートコードに関するよくある質問

WordPress ショートコードについて、よく聞かれる質問がいくつかあります。以下は、これまで説明してこなかった一般的な質問とその回答の概要です。

ショートコードは WordPress を遅くしますか?

サイトの速度は WordPress の大きな問題であり、1 つのページまたはサイトで多数のショートコードを使用すると、Web サイトの速度が低下する可能性があります。そのため、特に Gutenberg ブロックを使用できるようになった今では、必要な場合にのみショートコードを使用することをお勧めします。

WordPress ショートコードはどこに保存されますか?

WordPress ショートコードは通常、投稿またはページに配置されます。しかし、WordPress のウィジェットセクションでも Gutenberg ブロック編集がサポートされるようになったので、Web サイトのほぼどこでもショートコードを使用できるようになりました。

ショートコードはHTMLですか？

はい、ショートコードは、WordPress Web サイトに統合できる HTML ベースのコードです。

ショートコードを使用する際に「悪い」側面はありますか?

上記で説明したように、テーマでショートコードを使用していて、テーマを変更することにした場合、その特定のショートコードは機能しなくなります。それ以外の場合、ショートコードは普遍的であり、他の要因に依存しません.

WordPress にはショートコードが組み込まれていますか?

はい、WordPress はデフォルトでいくつかのショートコードを提供しています。たとえば、ショートコード API を介して追加できるギャラリーです。

WordPress にショートコード画像を追加するにはどうすればよいですか?

まず、作業したいページまたは投稿に移動します。次に、ショートコードを追加するページまたはブログ投稿を選択します。次の画面で「ショートコードを追加」ボタンをクリックします。「ショートコードを挿入ポップアップ」ボックスで、お好みのショートコードを選択します。「テキストと画像のショートコード」をクリックして、ショートコード画像を作成できるようになりました。

ショートコードで作業する前に、WordPress サイトをバックアップすることを忘れないでください

バックアップは、WordPress サイトのセキュリティの第一レベルです。サイトにあるすべてのコンテンツ、投稿、コメント、および貴重なデータは、1 秒で失われる可能性があります。

過去に WordPress サイトで作業したことがある場合は、すべてのデータを失い、さまざまな理由で作業する可能性があることをご存知でしょう。たとえば、互換性のないソフトウェアが原因で Web サイトがクラッシュすることがあります。または、サイトがマルウェアやサイバーハッキング、トラフィックの過負荷、またはハードウェア障害による攻撃を受けている可能性があります。データを失う可能性があるもう 1 つの理由は、コンテンツまたはカスタマイズが WordPress コアファイルと競合し、サイトがダウンする場合です。ショートコードがコードを操作すると、サイトが停止する可能性のある予期しない事態が発生する可能性が常にあります (コードと WordPress コアファイルとの競合など)。

このような不幸な出来事を常に防ぐことはできません。ただし、何かひどいことが起こった場合でも、サイトを元に戻し、再び機能させる方法について準備することができます. 私たちの提案？最高の WordPress バックアッププラグインである UpdraftPlusを使用して、常に存在するこの脅威からサイトを保護してください。

UpdraftPlus は、 WordPress サイトのバックアップを非常に簡単にする使いやすいインターフェースを提供します。バックアップは、Dropbox や Google ドライブなどのオンラインストレージの場所に直接保存できます。 UpdraftPlus を使用すると、自動バックアップスケジュールを設定できるため、バックアップを覚えておく必要さえありません。インストールしてセットアップするだけで、準備完了です。

結論

WordPress のショートコードは、WordPress 2.5 に初めて導入されました。テーマとプラグインに加えて、ショートコードを使用すると、WordPress サイトを簡単にカスタマイズできます. ショートコードを使用すると、コーディングを必要とせずに、特定の機能を簡単に実装して何度でも再利用できます。デフォルトのWordPressショートコードとは別に、サードパーティのプラグインにもショートコードが付属しており、WordPressの旅をより簡単にすることができます.

このガイドが、WordPress ショートコードの学習と発見、サイトへのショートコードの追加に役立つことを願っています。

この記事について質問がある場合は、下のコメントセクションでお知らせください。

投稿 WordPress ショートコード – 使用すべき理由は、UpdraftPlus で最初に登場しました。 UpdraftPlus – WordPress のバックアップ、復元、移行プラグイン。