ワードプレス

画像を横に並べるブラグイン「Shortcodes by Angie Makes」

ワードプレスでページを作成するときに、画像を横に並べる方法が分からないことがありませんか。

専門的なHTMLやCSSの知識があれば、画像を横に並べることは簡単でしょう。

しかし、副業初心者にとっては、これが、難しいんです。

分からないなりに、調べながら作業をしていっても画像が表示されない問題や、表示されても画像がずれてしまうことはよくあります。

そこで、そのトラブルを解決してくれるプラグインがあるのでご紹介します。

スポンサードリンク



Shortcodes by Angie Makes

画像を横に並べることができるプラグインは、「Shortcodes by Angie Makes」です。

これは本当に簡単に画像を横に並べることができます。

使い方

まず、プラグインをインストールします。

インストールが終了したら、新規の投稿ページを開きます。

開いたら下の赤丸のように[]のメニューがあるので、クリックします。

Columnsにカーソルを合わせると新たにリストが表示されます。

並べたい枚数によって何枚並べるかを選択します。

横に2枚並べたい場合は、1/2+1/2を選びます。

3枚の場合は、1/3+1/3+1/3を選ぶようにします。

WP Canvas

使用例

実際に画像を横に並べてみます。

今回は2枚の画像を横に並べる作業をします。

1/2+1/2をクリック

すると下の画像の文字列が表示されます。

2枚作業

画像選択

上の画像のように「SampleContent」をドラックして色を反転させます。

反転させた状態で左上の「メディアを追加」ボタンをクリックして並べたい画像を選びます。

同じように、2行下の「SampleContent」の画像を選ぶ作業をします。

並べる例1

こんな風に画像が表示されます。

表示の確認

変更をプレビューでちゃんと画像が横にならんでいるかをチェックしてみましょう。

 

ホームページイメージ2

並んで表示されていれば、終了です。

便利な機能

「Shortcodes by Angie Makes」は、本当によくできたプラグインです。

画像を並べるだけではなくて、文章を入れることもできます。

画像を並べると、その下に文章を入れたくなりますよね。

プラグインがなれば、文章を画像の下にいれるだけでも苦労します。

しかし、「Shortcodes by Angie Makes」を使えば本当に簡単です。

「SampleContent」で追加した画像と、[wp-column][wc・・・]の間に1行挿入します。

そこに入れたい文章をそのまま入力すれば、プレビューしたときに反映されます。

まとめ

「」は、本当に便利なプラグインです。

このプラグインを使うと初心者でも画像を簡単に並べることができるようになります。

  • このエントリーをはてなブックマークに追加

ピックアップ記事

  1. 最初にレンタルサーバーを借りるならロリポップ

関連記事

  1. ワードプレス

    オールドドメインでサイト作成実況中継

    新たにサイトを作ることになったので、一連の流れをまとめていきます。…

  2. ワードプレス

    「初心者でもできる」ワードプレスのカスタマイズ設定<第8章>

    ワードプレス(Wordpress)のカスタマイズは、ワードプレスをでホ…

  3. ワードプレス

    「初心者でもできる」ワードプレスのテーマ設定<第6章>

    ワードプレス(Wordpress)のテーマ設定を初心者でもできるように…

  4. ワードプレス

    「初心者でもできる」ワードプレス投稿の使い方<第11章>

    ワードプレス(Wordpress)の設定が終わったら、ようやくコンテン…

  5. ワードプレス

    「初心者でもできる」ワードプレスでホームページ作成(レンタルサーバー編)<第2章>

    ワードプレス(Wordpress)でホームページを作るときにどのように…

  6. ワードプレス

    「初心者でもできる」ワードプレスの設定<第9章>

    今回は、ワードプレス(Wordpress)の設定についてです。ワー…

最近の記事

  1. 子テーマ
  2. ワードプレステーマmag
  3. ワードプレスエラー
  4. ワードプレスのインストール
  5. ワードプレスのドメイン

おすすめ記事

  1. 「初心者でもできる」ワードプレスでホームページを作る方法<第…

サラリーマン必見のニュース

サラリーマンが知っておきたいNEWS

  1. ワードプレス

    「初心者でもできる」ワードプレス投稿の使い方<第11章>
  2. トラブル

    リダイレクトでサイトを簡単に引っ越しする方法
  3. 知識

    被リンクのSEO効果を検証
  4. 知識

    ホームページアドレス(wwwあり・なし)の失敗を防ぐ方法
  5. ワードプレステーマmag

    ワードプレス

    ワードプレステーマ『MAG』のタイトルを「h1」に変更する方法
PAGE TOP