ショートコードでブログを気楽に作る(一人暮らし快適計画)

        ショートコードでブログを気楽に作る(一人暮らし快適計画)
 ショートコードとはfunctions.phpに書いて置いたプログラムを呼び出すコードの事で、自分で作成する事が出来るそうだ。

 しかし、自分にはそんな小難しい事は無理なので、既製品のプラグインを利用してその恩恵を頂いている。

 主に使っているのはcolumns(カラム)というショートコードで、ブログ記事スペースの幅を2~3列に分ける事である。
 以前イメージ(写真等)の文字の配置にHTMLを利用していたが、これが現在は使ってはいけませんよとグーグル様からご指摘を受けたからだ。

 画像の右側に文字を5mm位、離して表示したいとかいうやつである。

 そんな時にこのcolumnsコードを使うと左側の1/4に画像を入れて、右側3/4に文章を入れると、その比率で処理してくれるのである。 お約束は1/4+3/4=1のようにトータルで1になるようにするだけです

「Shortcodes Ultimate」というプラグインをインストールし有効化するとショートコードを挿入するというのがテキスト画面に現れます。

 これをクリックするとショートコード一覧が出てきますのでcolumnsを選択します。

 するとショートコードcolumnsの設定画面が出て来て、サンプルコードが記述されています。

 これを記事画面幅を1として左と右の割合を分数で分割できるので好みの割合に書き換えます。

 今回の場合は横幅を3分割にしたいので、サンプルの一行をコピーして下段に貼り付け増加しました。

 自分はどれくらい迄出来るんだ? と思い5分割まで試しましたが正常に機能しました。 が、普通はそんなに分けないと思いますぜw

 緑の〇で囲んだ部分を1/3に書き換えます。 3つなので合計1になります。(/ω\)

 黒●の所は、画像でも文字でもOKですが今回は黒丸●を3つ入れました。 1/3を書き換えた[  ]の後が挿入スペースですので確認してください。

 これをプレビューすると、ほら~●が3個等分された箇所へ表示されました。

 このページのこの部分は左側が1/3で画像、右が記事で2/3のスペースで配置されていますが、下の方の広告部分は3分割してそれぞれの商品コードを張り付けています。

 また、画像部分を小さくして、文字部分を増やすには1/4と3/4に書き換えるとOKです。

 この他にも使えそうなコードがあるのですが、自分のブログではまだ使用していません?

 あっ、リストとアニメーションと先頭文字が大きくなるDropcapは使いました (-。-)y-゜゜゜

 とりあえず、ショートコードそれぞれにサンプルが記述されていますので、海外産ですが感覚で使用できる印象でした。

 まあ、俺みたいなおやじでも使えるんだから大丈夫だろ?

 なお、左の画像は右クリで、画像開くで大きくなります。