*

Shortcodes Ultimateで簡単記事装飾 |基本の使い方!

公開日: : 最終更新日:2018/04/04 WordPress ,

WordPressの投稿機能(ビジュアルエディタ)は、デフォルトの状態で簡単に記事の装飾ができるボタンが用意されているけど、かなり少ないです。

プラグインでこのボタンを増やすこともできますが、今回はショートコードを使って簡単に装飾などができるプラグインについてメモってみました。

スポンサーリンク


ところでショートコードってなに?


以前記事に吹き出しをいれる方法を書いたときには、なんとなくあいまいに理解して使い方(操作)がわかればいいか、と使っていたけど、ここはちゃんとおさえるべきかな、ということで・・・

ショートコードとは、WordPress固有のコードで、phpやソースコードを書き込まなくても、特定の文字を書くだけという便利な機能です。

事前にphpという場所にプログラムコードを記述しておくと、記事投稿の際に短いコードを記述するだけで、その動作を呼び出すことができるというもの。

その呼び出すためのコードがショートコードというわけです。

ショートコードは一般的に[〇〇〇〇〇]というように括弧で囲まれた記述の仕方をします。

例として、Speech Bubbleでは

[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="A さん"] こんにちわ [/speech_bubble]

A さん
こんにちわ

こんな具合の記述で楽に吹き出しをいれることができました。

ソースコードやphpを直接書き込まなくても、ショートコードを書けば、

ソースコードやphpを書き込んだのと同じことになるんですね。

ショートコードは通常の投稿ページにも固定ページにも記述できるし、

ビジュアルエディタでもテキストエディタでも記述できます。

私のようなプログラムとかよくわからない、phpも極力いじりたくない、という人には向いていますね(^^)

で、プラグインを使うことで、phpにプログラムコードを記述しておくという手間も省けてしまうようです。

 

Shortcodes Ultimateの使い方


インストール方法は一覧ページの作り方で書いていますのでそちらを参照してください。

なにができるのか?


Shortcodes Ultimateインストールすると

記事投稿画面の上部に「ショートコードを挿入」というボタンが表示されます。

クリックで、できることの一覧が表示されます。

ショートコード一覧
 

一覧の上にタイプ別フィルタという項目があります。

タイプ別
「すべて」が全部表示された状態ですが「コンテンツ」などの項目名をクリックすると、その項目にあったものだけが表示になり、クリックできます。
 

コンテンツ項目
 

主なものを使って設定をみてみます。

例1:「コンテンツ」の「見出し」 

これは見出しを装飾できるショートコードです。

「見出し」をクリックします

 

見出し
 

すると、設定画面に変わります。

見出しの設定
 

デフォルト これはデフォルトしか選択できません。他のスタイルは有料になります。

サイズ スライダーを動かして指定します。

整列 見出しの位置。右・左・中央から選べます。

マージン 余白の設定です。これもスライダーをドラッグして指定します。

クラス CSSで装飾したい人が書きこみます。

コンテンツ 見出しの文章

 

設定が終わったら下までスクロールすると「ショートコードを挿入」と「プレビュー」ボタンがあります。

挿入とプレビューボタン
 

プレビュー」をクリックするとプレビューが表示されるので確認します。

プレビュー
 

プリセットというのは、この設定を保存していつでも利用できるようにする設定のことです。

プリセット」をポイントすると図のように表示されます

プリセットボタン
 

「現在の設定をプリセットとして保存」というボタンを押して名前を入力して保存します。

プリセット
 

すべての設定が完了したら、「ショートコードを挿入」をクリックします。

図ように、投稿記事内にショートコードが挿入されます。

ショートコードが挿入される
サイトをプレビューすると、先ほどのプレビューで確認したのと同じように表示されているのが確認できます。
 
スポンサーリンク

 

例2:「コンテンツ」の「ボタン」 

リンクボタンを作れます。

 

使用例→ をクリックすると例が表示されます。

ボタン使用例
リンク リンク先のURLを入力

ターゲット リンク先を同じタブか新しいタブか選びます

スタイル  ボタンのスタイルを選びます

スタイル選択
yajirusi
スタイル見本
 

背景 ボタンの背景の色を指定できます

色を決める
図のような表示になるのでドラッグで色を決めます

テキストの色 ボタンのテキストの色も背景色のようにドラッグで色を決めます。

サイズ ボタンのサイズをスライダーで指定         などなど

設定は見出しの時と同じでスクロールしていって、ひとつずつ決めていきます。

全部やっていると時間がかかるので以下割愛。

できあがったのがこちら。

挿入したショートコード

投稿画面に挿入されたショートコード


 

ボタンのプレビュー
プレビューがこちら。

スタイル・背景色・文字色・サイズの他にアイコンも入れられるので適当にいれてみました。

 

アイコンは「メディアマネージャー」と「アイコンビッカー」から選ぶことができます。

アイコン
 

保存してあるメディアライブラリーから写真をアイコンとしていれるとこんな感じになりました。

メディアからいれたアイコン
アイコンビッカーにはいろんなアイコンがあります。リンクボタンに合ったアイコンをいれることができますね。

アイコンビッカー
 

いろいろ試してみると楽しくブログ作りができそうです。

ワクワク♪o(^o^o)(o^o^)oワクワク♪

使い方は簡単に感覚でできるので、まずは使ってみる!のがいいと思います。

 

次はいろいろ試してこれは便利!よく使うかも、

というものをメモってみます。

 

前の記事
画像キャプチャと編集ができるフリーソフトMonosnapの使い方 へ

次の記事
こんなことがしたい!Shortcodes Ultimateで簡単記事装飾 へ

WordPress一覧へ


 

にほんブログ村


日々の出来事 ブログランキングへ 

スポンサーリンク




スポンサーリンク




Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


七夕にぬりえで遊ぼう!無料ダウンロードサイト紹介 折り紙もあるよ^^

七夕の日あなたは何をしてすごしますか?^^ 笹竹に七夕のお飾りや短冊

笹に七夕飾りをするわけは?七夕飾りの意味と短冊の色や飾る期間は?

いろんな行事でそれぞれになにかを飾ったり、供えたりしますよね。 雛祭

七夕とは?たなばたと読むのはなぜ?由来は乞巧奠と棚機つ女信仰から

子供の頃から7月7日になると空を見上げては織姫と彦星の話を思いだし、雨

お中元を贈った場合やいらない場合の困ったときの対処は?やめたい時は

日本では季節ごとに行事が目白押しですが、夏前になるとお中元の時期。

多摩地区の公園 花見の後の小金井公園散策 新緑豊かな公園をぶらり散歩

多摩地区の公園をぶらり散策してきました。 ここ小金井公園は4月の初め

→もっと見る

  • こんにちは。波空です

    好きなことを自由にやりたくてアフィリエイトにチャレンジ中

    好きなものは
    アニメ・漫画・ゲーム・お絵描き・映画を観ること・パソコンで遊ぶこと・チョコレート・中島みゆきさんの歌・・

    やりたいことは・・
    空を飛びたい・馬に乗って自由に走り回りたい・猫を飼いたい・・

    いろいろあるけど、まずは資金と自由な時間を確保しないと進まない。
    日々どうしたらできるか考えながらリアル仕事に追われています。

PAGE TOP ↑