ワードプレスのテーマ「ストーク」で使えるショートコードの使い方一覧

ストークのイメージ

当サイト(イノバース)が採用している「ストーク」には、「ショートコード」と呼ばれるものが用意されています。ショートコードとは、本来複雑なプログラム言語を使用しなければブログのデザインをいじれないところを、素人でも簡単に見栄え良くブログを装飾できるコードのことです。

たとえば以下のように、画像付きの関連記事(内部リンク)の表示が簡単にできるようになります。

一般人がブログで広告収入を得る方法がわかる稼ぐ3つの仕組みとは

2016.11.10

たったこれだけでも、見やすくていいですよね。

ストークには、他にも様々な装飾が用意されていますので、このページで全て細かく解説させていただきます。参考にしていただき、より見栄えのある記事作成にお役立ていただければ幸いです。

注意

ここで紹介するボタンショートコードは、WordPressテーマ「ストーク」のものになります。他のテンプレートでは使用できないため、ご注意ください。

ストークの詳細については、以下の記事をご覧いただけますと幸いです。

ブログ初心者必見!wordpressのおすすめテーマはストークで決まり

2017.05.23

AddQuicktagによく使うショートコードやタグを登録して作業効率アップ

「AddQuicktag」と呼ばれるプラグインを活用すれば、ここで紹介するショートコードはもちろん、ありとあらゆるタグを登録しておけます。一度登録しておけば、ワンクリックで呼び起こせるので作業効率が向上します。

たとえば以下のように、任意のショートコードを記事投稿ページから呼び出せるのです。

AddQuicktagを使用して画像付き内部リンクのショートコードを呼び出したときのイメージ
けんいち君
これは便利ですね!

毎回コピペするのは大変ですし、間違えたら面倒だから助かります!

よごさわ
「AddQuicktag」に登録しておけば、効率よく記事作成ができるようになるので、インストールしておきましょう。

詳しくは、以下を参照してください。

AddQuicktagの使い方:ストークのショートコードを登録する方法

2017.12.14

記事中に画像付きの関連記事の内部リンクを埋め込むショートコード

冒頭でも紹介した通り、通常のテキストリンクの他に、ショートコードを使えば画像付きの内部リンクを作成できます。以下のような画像付き内部リンクです。

一般人がブログで広告収入を得る方法がわかる稼ぐ3つの仕組みとは

2016.11.10

注意
ただし、ブログ内のコンテンツだけであり、個別ページやカテゴリー、LP(ランディングページ)には使用できないのでご注意ください。
けんいち君
目立つ内部リンクが作成できるのはいいですね!
よごさわ
テキストリンクと使い分けて、ユーザーが他のページは回遊しやすい構造にしましょう。

詳細や設定方法に関しては、以下のコンテンツを参考にしてください。

WordPressテーマ・ストークの画像付きの内部リンクショートコード

2017.12.14

記事内を2・3カラム(二・三分割)表示にするショートコード

ショートコードを活用すれば、コンテンツ内部を2分割、さらには3分割までにすることが可能です。これを、「2カラム」や「3カラム」と呼び、メニューやカテゴリー画面を作成する際にオススメです。

たとえば、2カラムの場合、以下のようになります。

コンテンツSEOのイメージ

補足
スマホやタブレットで見た場合、横並びではなく、縦並び表示になります。小さな画面で横に二分割なってしまうと、逆に見づらくなるからです。

2・3カラム表示は、パソコンで見られたときだけであると覚えておきましょう。

けんいち君
スマホとパソコンで表示を切り替えられるのもポイントですね!
よごさわ
2・3カラム表示を駆使すれば、パソコン、スマートフォンのどちらで見ても使い勝手が向上します。

詳しくは、以下のコンテンツを参考にしてください。

ストークの記事内を2・3カラム(分割)にするショートコード

2017.12.14

補足や注意書きなどのテキストを枠で囲むショートコード一覧

記事内の説明で補足や注意書きを入れたいとき、「※」や()では見落とされたり、見栄えが悪かったりします。

そこで、ストークに用意された「色付き外枠」のショートコードを使えば、ハイクオリティな装飾が可能になります。たとえば、以下のようなイメージです。

補足のイメージ
小さなフォントで、少し目立つような補足説明を追加できます。
けんいち君
さりげなく強調できるからいいですね!
よごさわ
入れすぎはダメですが、ここぞというときに使用すれば、スマートな記事作成ができますね。

使い方に関しては、以下のコンテンツを参考にしてください。

WordPressテーマ・ストークで色枠を生成するショートコード一覧

2017.12.14

会話調の吹き出しを簡単に見栄え良く生成するショートコード

ライバルサイトの記事のクオリティが上がっている中で、差別化をするのは難しいです。文字や画像だけでは、インパクトやオリジナリティにかけてしまいます。

そこで、ストークに標準装備されている会話調の吹き出しショートコードの活用をオススメします。キャラクターや本人の写真で吹き出しを入れるだけで、見栄えが良くオリジナリティがでるだけでなく、わかりやすい文章が作成しやすくなるのでオススメです。

ワンポイントアドバイスや補足を入れていくことで、活字だけよりも読み進めやすく、理解しやすくなるからです。たとえば、以下のようなイメージです。

よごさわ
吹き出しを活用すれば、初心者でもハイクオリティな記事をかけますよ。

詳しくは、以下のコンテンツにて、詳細を確認してください。

ストークのテーマにある会話風吹き出しショートコードの使い方

2017.12.14

アフィリエイトリンクやお問い合わせに使えるボタンを作成するショートコード一覧

アフィリエイトを成約させたり、お問い合わせを受けるためには、ユーザーを申し込みページへ連れていく必要があります。

つまり、リンクを張り、ユーザーを任意のページへ誘導しなければいけません。

このとき、リンクには「テキストリンク」と呼ばれるものがあります。テキストリンクとは、文字通り、テキスト自体がリンクになっている、以下のようなイメージです。

テキストリンクのイメージ:ストークの公式サイトはこちら

文章の中であれば、テキストリンクは有効です。

しかし、流し読みをする人や、今すぐにお問い合わせをしたい人には見つけづらいです。小さくてアピールが少ないからです。

そこで、ストークに用意されたボタンショートコードを使えば、以下のような見栄えの良いボタンを初心者でも簡単に実装できます。

けんいち君
ボタンになっていれば目立つから、思わずクリックしてしまいそうです!
よごさわ
アフィリエイトやお問い合わせを獲得したい際に使用すれば、絶大な効果を発揮します。

詳しい設定方法は、以下のコンテンツを参考にしてください。

WordPressテーマ・ストークでボタンを作成するショートコード一覧

2017.12.14

まとめ

ブログで成功するためには、良質な記事、つまりコンテンツの内容が命です。極端な話、見栄えは関係ありません。

しかし、ブログの記事は、基本的に文章で構成されているため、ライバルも同じようなコンテンツを作成します。そのため、文章だけでは差別化が難しいです。

そこで、ストークに用意されたショートコードによる装飾を活用することで、オリジナリティ溢れる記事になります。同じ文章であれば、ユーザーにとって飽きのこない、わかりやすいコンテンツが勝つことは明らかです。

ただし、あくまでも「有益な情報をまとめた記事」を書くことが本質です。ここを間違えないように注意しながら、見応えのあるオンリーワンのブログを作成していきましょう。

CAT