codaWordPressのプラグイン初級者~中級者向け【有用】デザインパーツをショートコードで簡単に導入できるプラグイン文中の説明画像をクリックすると拡大します。TweetPocketこの記事は約5分で読めます。まとめWordPressの記事にいろいろなデザインを取り入れたいWordPressで記事を書く時、ハイパーリンクや画像、リストなど、いろいろなコンテンツを追加することができます。Ultimate」を使ってみてはいかがでしょうか。Ultimate」は、ショートコード形式で簡単に使えるだけでなく、WordPress5.0で導入されたGutenbergエディタにも対応しているプラグインなので、安心して使えます。ショートコードとは、様々な動作を短いコードで表現することができる機能です。Ultimate」の使い方を紹介します。ショートコードについて、詳しくはこちらをご覧ください。Ultimate」は、WordPressの公式プラグインです。WordPressの管理画面からインストールできるので、さっそく使ってみましょう。プラグインの公式サイトは以下です。こちらからダウンロードしてインストールすることもできます。Ultimateプラグインを有効化したら、管理画面の左サイドメニューに「ショートコード」という項目が追加されます。shortcodes」のページを見てみましょう。プラグインの導入で追加される、51種類のショートコードの一覧が表示されます。それぞれのショートコードは、「コンテンツ」「ボックス」「メディア」「ギャラリー」「データ」「その他」と6つのカテゴリーに分類されています。試しに、一番上の行の左から2番目の「タブ」というショートコードのアイコンをクリックしましょう。「タブ」のソートコードのプレビューや実際のコードが、確認できます。このように、アイコンをクリックして詳細ページを開くことで、各ショートコードのプレビューが表示されます。下の方にスクロールすると、ショートコードのオプションの詳細なマニュアルが記載されていますが、このページ自体が、プラグインの使い方解説ページのようになっています。Ultimate」プラグインを使ってみましょう。ここでは、WordPress5.0で追加されたGutenbergエディタでの使い方を紹介します。WordPressの投稿画面を開き「段落」ブロックを追加します。ショートコードは、「段落」ブロックの中に追加する形で使用します。「段落」ブロックのメニューに、「ショートコードを挿入」と説明書きのついたアイコンが追加されます。ここをクリックして、ショートコードを選択します。この中から、使用したいショートコードを選択します。非常にたくさんあるので悩みますが、とりあえず、このプラグインの大まかな使い方を知るために、オーソドックスな「ボタン」から使ってみましょう。この表の、一番左の列の上から4つ目です。アイコンをクリックすると、「ボタン」の設定画面が表示されます。「ボタン」は、クリックするためのショートコードで、設定でリンク先のURLなどが設定できます。(上の画像では「http://localhost/wptest001/cgi-bin/wp」となっています)設定画面を下にスクロールして、他の項目も見てみましょう。ボタンの背景色やテキストの色、サイズなどが調整できます。下までスクロールしましょう。「ショートコードを挿入」「ライブプレビュー」「プリセット」の3つのボタンがあります。「ライブプレビュー」をクリックすると、上で設定した内容が反映されたボタンのプレビューが確認できます。ライブプレビューを表示させると、非表示にはできません。ライブプレビューを表示させた状態で、ボタンの設定を変更すると、ライブプレビューもリアルタイムで変更されます。このように、このプラグインでは追加したショートコードを選択して設定し、ライブプレビューで確認して、最後に「ショートコードを挿入」ボタンをクリックすると、設定が完了です。これで、「ボタン」ショートコードの追加は完了です。注意点としては、一度ショートコードとして書き出されてしまったコードは、さきほどのプラグインの管理画面上で再編集はできません。書き出されてしまったショートコードを修正するためには、「段落」ブロックに追加されたコードを直接編集しなくてはなりません。同じようなショートコードを何度も使いたい場合は、「プリセット」機能を使って設定を記憶させておくと良いでしょう。「現在の設定をプリセットとして保存」のボタンをクリックします。新しいプリセット名を入力するダイアログボックスが、表示されます。ここでは「オリジナルボタンその1」と入力してみます。入力ができたら「OK」ボタンをクリックしましょう。プリセットのメニューに「オリジナルボタンその1」が追加されます。次回からは、このプリセットボタンをクリックするだけで、保存してあった設定がすべて反映されたボタンを作ることができます。Ultimate」ンを使うと、記事におしゃれなデザインパーツを追加できる。設定画面でデザインを直感的に編集でき、ショートコード形式で書き出される。プリセット機能を使うことで、よく使うデザインパーツの設定を記憶できる。(29)【初級者向け】WordPressやサイト作りの質問・お悩み送っちゃおう!初級者の方、WordPressやサイト作りについて質問、お悩み、知りたいことを送信ください。お気軽に登録ください!パートナー・ライターさん募集!「わかるWeb」LINE公式アカウント「わかるWeb」のLINE公式アカウントです。