【厳選】STORK（ストーク）でアフィリエイターやブロガーが使うべきショートコードまとめ

ストークのショートコードを厳選

SHARE

オシャレで使いやすいとブロガーやアフィリエイターから人気のWordPressテーマSTORK（ストーク）には便利なショートコードがたくさん実装されています。

その中でも普段使うであろうショートコードを厳選しました。

内部リンク用関連記事

このショートコードは内部リンクをショートコードで設置できます。

タイトルや日付を自動で取得してくれるので記事タイトルを変更した際も自動で内部リンクのタイトルが変更されます。

これは内部SEOを重視している人にとってはとても嬉しい機能です。

関連記事のサンプル画像

[kanren postid="ここに記事ID"]

カラム分け

カラム分けをすることで、よりリッチな表現をする事ができます。

本来カラム分けをするならCSSを書いて、htmlも複雑になりますが、このコード一発でカラム分けできるのは重宝します。

工夫次第で様々な表現ができるので色々と考えてみましょう。

2カラム

2カラムのサンプル画像

[[colwrap]
 [col2]この部分はPCだと左側に表示されて、スマホだと縦に並び上にきます。[/col2]
 [col2]この部分はPCだと右側に表示されて、スマホだと下にきます。[/col2]
[/colwrap]]

3カラム

3カラムのサンプル画像

[[colwrap]
 [col3]この部分はPCだと３分割の一番左側にきて、スマホだと縦に並び最上部にきます。[/col3]
 [col3]この部分はPCだと3分割の真ん中にきて、スマホだと縦に並び真ん中にきます。[/col3]
 [col3]この部分はPCだと3分割の一番右側にきて、スマホだと縦に並び最下部にきます。[/col3]
[/colwrap]]

囲い枠（ボックスデザイン）

文章の中で特に強調した表現をしたい場合や、補足で説明を加えたい時に囲い枠で表現することでユーザーは読みやすくなります。

流し読みする事が多いウェブの世界では、色を使って読ませたい部分を強調する事はとても重要です。

黄色背景のボックス

黄色背景ボックスのサンプル画像

[[aside type="normal"]黄色い背景で注釈を入力することができます。]

赤色背景のボックス

赤色背景ボックスのサンプル画像

[[aside type="warning"]赤い背景で黄色い注釈よりも目立った注釈を入力することができます。]

黒い枠のボックス

黒い枠のボックスのサンプル画像

[[aside type="boader"]薄い黒の枠線で囲い、区切りを作る事ができます。]

ボタン

ボタンは2色を使い分ける事で効果的にリンクを踏ませる事ができます。

先ほどのカラムを応用して２カラムに分け、２色のボタンを並べる事でデザイン的にも優れた表現をする事が可能です。

例えば、片方には口コミのページへのボタン、もう片方には公式ページへのボタン。などのように使い分ける事が効果的です。
ボタン応用のサンプル

シンプルなボタン（塗りつぶし）

シンプルなボタンのサンプル

[<a href="リンク先URL">ボタンテキスト</a>]

目立つボタン（塗りつぶし）

目立つボタンのサンプル

[<a href="リンク先URL">ボタンテキスト</a>]

立体的なボタン（黄色）

立体的な黄色ボタンのサンプル

[<a href="リンク先URL">ボタンテキスト</a>]

立体的なボタン（ピンク）

立体的なピンクボタンのサンプル

[<a href="リンク先URL">ボタンテキスト</a>]

会話風吹き出し

会話風吹き出しは最近のWordPressテーマだと大抵は実装されていますね。

吹き出しをうまく使う事で読んでいるユーザーが記事に対して親近感を持ったり引き込まれたりします。

また、難しい内容の説明をする時は会話調で噛み砕いて表現することもおすすめです。

左側アイコンの吹き出し

左側吹き出しアイコンのサンプル

[[voice icon="画像URL" name="名前" type="l"]ここに会話の内容を入力します。

オススメの長さは２行程度です。[/voice]]

右側アイコンの吹き出し

右側吹き出しアイコンのサンプル

[[voice icon="画像URL" name="名前" type="r"]会話にすると親近感が湧くし、難しい内容でも簡単に感じます。[/voice]]

まとめ

STORK（ストーク）はアフィリエイターやブロガーにとって十分な機能を備えてテーマです。

ショートコードを使う事で簡単にリッチな表現をする事ができますので、CSSやhtmlの知識がない場合でも安心して使用する事ができます。

この記事では、STORK（ストーク）でよく使うショートコードを厳選して紹介致しましたが、他にもショートコードを見たい場合は公式サイトのショートコードの使い方をご覧ください。

ストークの評判を12人に聞いてみた【知らなきゃ損】WordPressテーマSTORK（ストーク）の評判や使い心地はどうなの？

STORK（ストーク）が気になる人に知っておいて欲しいWordPressテーマ

STORK（ストーク）は矢野ヨシキさんとブログマーケッターjunichiさんが共同で開発したWordPressテーマですが、ブログマーケッターjunichiさんが単独で開発したELEPHANT（エレファント）というWordPressテーマが話題になっています。

ELEPHANT（エレファント）は一度購入すると複数サイトに使い回す事が可能です。

さらに、購入するとjunichiさんが運営するブログマーケティングスクールに6ヶ月間無料で在籍する事ができます。

ELEPHANT（エレファント）は今日からボレは！！が使用しているWordPressテーマです。

気になる方は是非ELEPHANT（エレファント）に関する記事もご覧ください。

ワードプレステーマelephantの使い心地や感想は？【購入前必読レビュー】WordPressテーマELEPHANT3（エレファント3）の評価や使い心地、感想は？？ 【厳選】ELEPHANT（エレファント）を使うなら最低限知っておきたいショートコード一覧 elephant2のメニュー設定方法ELEPHANTのPC用ヘッダーメニューの設定方法 ELEPHANT2カスタマイズ全網羅【徹底解説】ELEPHANTカスタマイズ全網羅 elephantの見出しデザイン変更方法wordpressテーマELEPHANT（エレファント）の見出しデザインを変更する方法

コメントを残す

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

前の記事

テーマ特化型サイトカテゴリー設計
関連キーワードから考えるテーマ特化型サイトのカテゴリー設計のや…

次の記事

ELEPHANT（エレファント）全28ヶ所のサイトカラー設定…
全28ヶ所ELEPHANT（エレファント）のカラー設定