Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

更新日:

「Shortcodes by Angie Makes」は記事のレイアウトや見た目をHTMLやCSSの知識がなくてもショートコードで充実させることができるプラグインです。インストールするとビジュアルモード画面にボタンが表示されます。ボタンをクリックするとColumns,Elements,Content,Posts,Actions,Wrappersから選択し記事を編集することができます。

【PR】

1031754_1920-150x150 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

WordPress(企業サイト)の問い合わせとアクセスを改善

会社でWordPressのホームページを制作・管理しようとするとプラグインの各種設定が必要になり戸惑うものです。また、運用を開始…

1433427_1920-1-150x150 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

製品やサービスページの問い合わせとアクセスを改善

製品やサービスの販売促進目的のページを検索エンジンの上位に表示させ、アクセスアップさせます。ページを検索エンジンの評価に合わせた…

WordPressプラグイン:Shortcodes by Angie Makes

  • プラグイン名称の名称は「Shortcodes by Angie Makes」
  • プラグインのURLはhttps://ja.wordpress.org/plugins/wc-shortcodes/
  • ライセンスは無償
  • 機能は記事のレイアウトや見た目をHTMLやCSSの知識がなくてもショートコードで充実させることができる。
  • インストールは、ダッシュボード → プラグイン → 新規追加 → 検索 → Shortcodes by Angie Makesで検索 → インストール
  • 必須WordPressバージョンは3.7
  • 検証済みバージョンは4.7.7
  • 言語は英語
  • アクティブインストールは40,000+

■ Shortcodes by Angie Makesに実装されているショートコード

  • Columns(カラム・列)
  • Elements(要素)
  • Content(コンテンツ)
  • Posts(投稿)Posts(投稿)
  • Actions(アクション)
  • Wrappers(ラッパー)

※「Shortcodes by Angie Makes」のショートコードのデモサイトです。

Shortcodes by Angie Makesの使い方

Shortcodes by Angie Makesのショートコードを利用するにはビジュアルモードでボタンをクリックし選択します。(ビジュアルモードでショートコードボタンが表示されます。テキストモードではボタンは表示されません。)

【 Colum 】
Shortcodes by Angie Makesの【 Colum 】はページを分割表示するレイアウトができる機能です。WordPressのレスポンシブ対応テーマを利用するとスタイルシートをカスタマイズするのに知識が必要です。文章だけで構成できる記事なら比較的簡単に作りことができますが、企業サイトのように製品やサービスをアピールするにはレイアウトを操作したくなります。ビジュアル編集画面で分割したいレイアウトを選択するだけでショートコードがページに埋め込まれます。分割できるサイズは下記のようになっています。

  • 1/2 + 1/2
  • 1/3 + 1/3 + 1/3
  • 1/3 + 2/3
  • 2/3 + 1/3
  • 1/4 + 1/4 + 1/4 +1/4
  • 1/4 + 1/2 + 1/4
  • 1/2 + 1/4 + 1/4
  • 1/4 + 1/4 + 1/2
  • 1/4 + 3/4
  • 3/4 + 1/4

■ Colum使用例

1/2分割でレイアウトすることができます。

1/2 +1/2
左・上
1/2 +1/2
右・下

モバイル端末では左側が上に、右側が下にレイアウトされます。

■ 1/3 + 1/3 + 1/3 「Columns」ショートコード

3分割レイアウトです。

1/3 + 1/3 + 1/3
1/3 + 1/3 + 1/3
1/3 + 1/3 + 1/3

■ 1/3 + 2/3 「Columns」ショートコード

1/3
2/3

【 Elements 】
Shortcodes by Angie Makesの「Elements」にはButton、Font Awesome Icon、Heading、Highlight、Spacing、Clear Floats、Inline Code、Dividerなどの文章を装飾する機能がショートコードで提供されています。HTMLやCSSスタイルシートを理解しなくても装飾をすることが可能になります。

  • Button - リンクボタンを設置できる
  • Font Awesome Icon - アイコンを設置できる
  • Heading - 見出しを設置できる
  • Highlight - ハイライトをつける
  • Spacing - スペースをとるスペース
  • Inline Code
  • Divider - デバイダー(分割線を設置)

「Elements」を編集するにはビジュアル編集モードから [▼] ボタンをクリックして、ドロップダウンメニューより装飾したいショートコードを選択します。

【 Button 】
「Button」はリンクボタンを設置することができます。「Button Type」ではリンクボタンの外観を設定します。

「Button」
  • Primary
  • Secondary
  • Inverse
  • Saccess
  • Warning
  • Danger
  • Info

その他に、リンク先のURL、アンカーテキスト、別窓で開く、nofflow、配置位置などボタンに関する設定ができます。

【 Font Awesome Icon 】
「Font Awesome Icon」は文字列にアイコンをつけることができます。Iconをクリックすると用意されているアイコンから選択できるようになっています。

表示例) アイコン

「Heading」


「Heading」は見出しを設置できます。通常見出しはテーマによってスタイルシートで装飾されていますが、手軽にアイコンをつけたりすることは難しくなっています。また、見出しの上下の余白、文字寄、文字の大きさ、文字色、アイコンを付けるなど指定ができるので表現力が増します。

【 Highlight 】
「Highlight」はショートコードで囲まれた文字をハイライトしてくれ注意を引き付けることができます。

【 Spacing 】


「Spacing」は余白をとることができます。見出しとこの文の間に40pxの余白を入れています。

【 Content 】
「Content」には価格表を設置、ソーシャルボタンを設置、シャエアボタン、吹き出しを埋め込んだりとコンテンツを装飾するためのショートコードが揃っています。

  • Pricing Table - 価格表を設置する
  • Social Icon - ソーシャルボタンを設置する
  • Share Buttons - シェア(共有ボタン)を設定する
  • Testimonial - 吹き出しを埋め込む
  • Countdown - カウントダウンを設置する
  • Skillbar - スキルバーを埋め込む
  • 画像 - 画像を埋め込む
  • Call to Action - 資料請求などの行動を促すコンテンツを追加する
  • Image links - 画像リンク(一度に複数)埋め込むことができる
  • Box - ブロックを線で囲むことができる
  • HTML - カスタムHTMLを埋め込める
  • Preformatted Text - 書式設定済みのテキストを配置

【 Pricing Table 】
「Pricing Table」は価格表を設置し、問い合わせ、申し込み、予約などのコンタクトフォームにユーザーを誘導することができます。

※Pricing Tableのサンプル

Basic
$19.99
per month
  • 30GB Storage
  • 512MB Ram
  • 10 databases
  • 1,000 Emails
  • 25GB Bandwidth

【 Social Icon 】
「Social Icon」はページにソーシャボタンを埋め込むことができます。ソーシャルボタンを埋め込むことができるプラグインもありますが、サイト全対に必要がない場合等、ページ単位で埋め込みが可能です。

※ソーシャルボタンのサンプル

➡ Share Buttons
「Share Buttons」シェア(共有ボタン)を埋め込みます。

※シェアボタンのサンプル

➡ Testimonial
「Testimonial」は吹き出しを埋め込むことができます。

※Testimonialのサンプル

Sample Content
Author

➡ Countdown
「Countdown」はカウントダウンをページに埋め込めます。

※カウントダウンのサンプル

【 Skillbar 】
「Skillbar」はページにスキルバーを埋め込むことができます。

※Skillbarのサンプル

Sample Content
100%

【 画像 】
画像はメディアの追加でも埋め込むことができるのですが、こちらは画像の上にラベルを表示させることができます。サンプルでは「For Sale」を表示しています。画像を編集したものではなく、文字を重ねてくれるのです。

※画像のサンプル

【 Posts 】
ショートコードを埋め込んだページにカテゴリーやタグ、個別指定(ID)で投稿を一覧表示してくれます。アイキャッチ画像やページタイトル、詳細文章を同時に表示できるのでナビゲーションページを効率良く作成することが可能になります。

  • Masonry-Box → タイル・フチあり
  • Masonry-Borderless → タイル・フチなし
  • Grid-Box → グリッド・フチあり
  • Grid-Borderless → グリッド・フチなし
  • Post Slider 1 → スライダー
  • Post Slider 2 → スライダー
  • Collage → コラージュ

【 Masonry-Box 】
Masonry-Boxは投稿ごとに枠線で囲って並べて表示できます。並べるBox数は指定でき、1ボックスだけ表示することもできたりします。以下のサンプルではアイキャッチ画像をサムネイル表示、ページタイトルを見出しタグを使って抜粋を表示しています。モバイル端末などの表示領域が狭い場合は左から順番に下へと表示されるようになっています。

■ Masonry-Box-サンプル

PAK145152451_TP_V-1024x682 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

Theme Check:テーマをチェックするWordPressプラグイン

Theme CheckはテーマをチェックしてくれるWordPressプラグインです。Theme CheckはWordPress.org(テーマディレクトリ)に登…

wordpress-923188_1920-1024x683 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

WP Multibyte Patch:マルチバイト文字修正パッチ・WordPressプラグイン

WP Multibyte PatchはWordPressのマルチバイト文字の不具合の修正を行うプラグインです。WordPressを日本語環境で正しく動作させるた…

woman-731894_1920-1024x678 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

One-Click Child Theme:子テーマを作成するWordPressプラグイン

「One-Click Child Theme」は、子テーマを作成してくれるプラグインです。更新は3年ほどされていません。参考までのご紹介になります。ご利用時は下…

laptop-2838921_1920-1024x609 Shortcodes by Angie Makes:記事を装飾できるWordPressプラグイン

Table of Contents Plus:目次を作成してくれるWordPressプラグイン

Table of Contents Plusは投稿や固定ページに「見出しタグ h1 ~ h6」を元に自動で「目次」を作成して表示してくれるWordPressプラ…

■ Masonry-Borderless

Masonry-Borderlessは枠線を表示しないもので、他はMasonry-Boxと同様の機能を持っています。

Theme Check:テーマをチェックするWordPressプラグイン

Theme CheckはテーマをチェックしてくれるWordP…

WP Multibyte Patch:マルチバイト文字修正パッチ・WordPressプラグイン

WP Multibyte PatchはWordPressのマ…

One-Click Child Theme:子テーマを作成するWordPressプラグイン

「One-Click Child Theme」は、子テーマを…

Table of Contents Plus:目次を作成してくれるWordPressプラグイン

Table of Contents Plusは投稿や固定ペー…

■ Grid-Box

■ Grid-Borderless

■ Post-slider1

XML Sitemap & Google News feeds:XMLサイトマップを送信するWordPressプラグイン

XML Sitemap & Google News …

WordPress Popular Posts:人気の記事を表示するWordPressプラグイン

WordPress Popular Postsは人気の記事を…

Simple Post Notes:ダッシュボードにノート機能を追加するWordPressプラグイン

Simple Post Notesはダッシュボードにのノート…

Scroll Back To Top Button:スクロールボタンを表示するWordPressプラグイン

Scroll Back To Top Buttonはページト…

■ Post-slider2

Theme Check:テーマをチェックするWordPressプラグイン

Theme CheckはテーマをチェックしてくれるWordP…

WP Multibyte Patch:マルチバイト文字修正パッチ・WordPressプラグイン

WP Multibyte PatchはWordPressのマ…

One-Click Child Theme:子テーマを作成するWordPressプラグイン

「One-Click Child Theme」は、子テーマを…

Table of Contents Plus:目次を作成してくれるWordPressプラグイン

Table of Contents Plusは投稿や固定ペー…

【 Action 】

  • Accordion
  • Accordion Section
  • Tabs
  • Tabs Section
  • Toggle
  • Google Map
  • RSVP

「Actions」を使って表示させることができるのは、「Accordion」、「Tabs」、「Toggle」、「GoogleMap」、「RSVP」となっています。(以下の表示サンプルを参照してください)

Sample Content 1
Sample Content 2
Sample Content
Sample Content 1
Sample Content 2
Sample Content
Sample Content

Google requires an API key to embed Google Maps. Enter your key in your Shortcodes option page under the "Maps" tab.

Your Name

Number of Guests

You Will Attend...

Hello

  • Center Content
  • Full Width

関連の記事

-プラグイン

Copyright© WordPressプラグイン , 2019 All Rights Reserved Powered by STINGER.