ブログ

WordPressで複数の画像を横並びにしたいならWPCanvasプラグインが便利すぎた!

WordPressでブログ記事を書いていると、複数の画像を横並びにして表示させたいケースがあります。当ブログでは今までCSSで調整したり、テーブルを組んでからラインを消したり、相当の労力をかけて表示を試みていました。(これが本当面倒くさい・・)

しかし、WP Canvas – Shortcodes プラグインを使うようになってからは、記事内に任意のカラムを簡単に指定することができます。

このような ⇒ 理論派 vs 感情派 の8つのブログ運用談義コンテンツも短時間で作れるようになりました。

ここでは、1分程度で2枚の画像を横並びにする工程を解説します。私のようにCSSやhtmlが苦手だったり、まったく分からない方にはとても便利ですね。

WP Canvasの設定方法

① カラムを選択する(ここでは2枚の画像を並べるので1/2+1/2)

wp-canvas1

② Sample Content部分をドラッグしてメディアを追加する

wp-canvas2

③ 画像ファイルをアップロードして投稿に挿入

wp-canvas3

④ 挿入された画像を確認したら同様にメディアを追加

wp-canvas4

⑤ もう1枚の画像も投稿に挿入する

wp-canvas5

⑥ 画像を確認したら更新してプレビューする。

wp-canvas06

CSSをいじることなく2枚の画像を横並びにできました。

wp-canvas001

wp-canvas004

WP Canvas – Shortcodesはカラムの設定だけではなく、価格表やソーシャルアイコンも設置できたり、その他さまざまなショートコードが使用できるWordPressユーザーならぜひ導入したい便利なプラグインです。

スリームデザインの無料メールマガジン

ピックアップ記事

  1. 見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…
  2. photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  3. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  4. 柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  5. 必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…

関連記事

  1. webデザイン

    123RFの格安素材を活用して素人っぽいWEBサイトから卒業しよう!

    ここでは123RFの格安素材を活用して素人っぽいWEBサイトから卒業す…

  2. webデザイン

    fotoliaの有料素材を活用して個性的なWEBサイトに生まれ変わらせよう!

    ここではfotoliaの有料素材を活用して素人っぽいサイトから脱却して…

  3. 【PR】

    求人採用に特化したWordPressテーマ《AGENT》を活用した社員募集ページの作り方【動画解説】…

    企業が成長するために、絶対に欠かすことができないのが人材だと言われてい…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  2. Photoshop CCのメニュー文字やツールバーが異常に小…
  3. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単な…

思考系のおもろい記事

ブログラ
  1. キュレーション

    WordPress日本語有料テーマの決定版っ!TCDシリーズのまとめ
  2. SNS

    思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  3. 3分の話

    フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…
  4. キュレーション

    必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  5. コピーライティング

    「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
PAGE TOP