WordPressのショートコードとは?

記事
IT・テクノロジー
初めまして!時短ツールズです!

私は、Wordpressでの記事作成にて簡単なショートコードを記入するだけで画像ようなカウントダウン等の動的な表示を可能にする事ができるものを作成し販売しております。

先ず前提としてショートコードとは?をご説明します。

ブログや記事を投稿する際の編集ページのブロックに「ちょっとした命令」を加えることができる仕組みです。

[countdown]や[contact-form-7]のようなコードです。
見たことはあると思います。

これを書くことによって裏側でPHP(プログラム)が動作して表示が変わります。
裏側例:
<?php

add_shortcode('countdown' , function($atts){
    $atts = shortcode_atts([
        'text' => 'click',
    ], $atts);
.....
こういったコードが書かれて動いています。

メリットとデメリット
使う上でのメリットとデメリットもお伝えしておきます。

メリット:
・ノーコード化:高度なプログラミング技術が必要なくUIを作れる。
・再利用性:同じ機能を100箇所で使うこともできる。
・表示の統一が楽:「全てのCTAを同じ見た目に」ができる。
・コードを何回も書く必要がない。

デメリット:
・ブラックボックス化:非エンジニアでは中身が把握できない。
・複雑化しやすい:機能を盛り込むことでオプションが増えすぎてしまう事がある。
・後方互換と破壊のリスク:ショートコードの廃止や仕様の変更で今まで挿入してきたショートコードのレイアウトが崩れてしまう。→数年後のリニューアルで注意が必要。

どんな時に使うべき?

向いてるシーンとしては:

◎ 見た目は固定、パラメータだけ変わる部品
例:ボタン、カード、料金表、地図、ギャラリー

◎ Gutenberg(ブロックエディタ)移行が重いプロジェクト
◎ 非デザイナーが更新するサイト
◎ カスタムブロック作るほどじゃない小規模機能

まとめ

ショートコードは、WordPressにて簡単なショートコードを記入するだけでカウントダウン等の動的な表示を可能にする事ができる。

・メリット:簡単、再利用可能、統一が楽、柔軟性があるなど
・デメリット:ブラックボックス、複雑になりやすい、後方互換や破壊のリスクがあるなど

興味があれば以下にリンクを貼っているのでぜひご検討してみてください。

サービス数40万件のスキルマーケット、あなたにぴったりのサービスを探す ココナラコンテンツマーケット ノウハウ記事・テンプレート・デザイン素材はこちら