2019年1月18日TwitterSharePocketHatenaLINEコピーするどうも。カエルブロガーのケロ蔵です。ブログを運営しているあなたは画像や広告を横並びにしたいと思ったことはありませんか?比較をするために画像を横並びにしたいと思っていても、どうやってやればいいの分からず最終的に縦にして並べ、妥協したことはあるのではないでしょうか。WINGでは画像を横並びにするためのショートコードが標準搭載されているので、使い方さえわかれば誰にでも画像や広告を横並びにすることが出来るようになります。そこで今回はレイアウトを変えるための方法について紹介していこうと思います。アイナ小さい画像を使うと横が寂しく感じるんですよね。記事を横並びにするのに便利なレイアウトのショートコード画像を横に並べて見たいと思ったことは誰しもあると思います。そんなのときにすごく使える便利なショートコードがこの『レイアウト』です。レイアウトはこのメインコンテンツの構成を分割して表示することが出来るようになり、画像を横に並べることだって出来るようになるんですよ。ちなみにスマホでは画面の大きさが小さいので縦に並んでいます。ケロ蔵アイナピョン太このように一列に画像を最大で3つ並べることが出来るので、比較画像を同時に表示させたいときに便利です。難しい知識は必要なく、あらかじめ用意されているものを選ぶだけで誰でも使うことが出来るようになっています。レイアウトの種類WINGで使えるレイアウトのショートコードは以下です。レイアウト一覧PCとTab3分割PCとTab左右40:60%PCとTab左右50%全サイズ左右30:70%全サイズ左右50%全サイズ左右free他にもありますが、メインで使うのはコレぐらいでしょう。このレイアウトを変更するためのショートコードを使って画像や広告を横並びにすることが出来るようになります。左右のバランスを自分で決めたい場合の対応あらかじめ用意されているレイアウトのサイズに該当しない場合は【全サイズ左右free】のショートコードを使えば、自分で左右のバランスを指定することができます。50%;">右側のコンテンツ%</div></div>このタグに2箇所ある『50%』という部分の数値を書き換えるだけで左右のバランスを変更することができます。最初の50%は左側、最後の50%は右側に対応しているので好きなようにいじってみましょう。ちなみに100%を超えて入力するとレイアウトが崩れてしまうので、100%以内になるように調整してください。アイナ100%未満にすると右側に余白ができますよ。スマホなどの小さい画面ではどのように表示される?PCやタブレットのような画面の大きいデバイスなら問題なく表示されるようになりますが、スマートフォンのような小さい画面だと正常に反映されないこともあります。全サイズの指定をしてあげれば、スマホでも横並びに表示することもできますが、画像は画面に合わせて縮小されて表示されるので、大きく見せたいときにはレイアウトの変更はしないほうがいいでしょう。全サイズ左右50%のショートコードを使った場合は上のような表示になります。スマホで画面を確認してみてください。レイアウトの分割を効果的に使うための応用技このレイアウトの分割は画像や広告を横並びにするだけではありません。他のショートコードと組み合わせることによって、さらに記事のデザインを良くすることが出来るようになるので、ぜひ使ってみてください。ボックスの横サイズを小さくするボックスを挿入すると横に広がってしまうので、テキストの量とのバランスが悪くなってしまいます。このレイアウトショートコードと組み合わせれば、ボックスの横幅を短くする事もできるようになりますよ。【レイアウト】を選択。【全サイズ左右free%】を選択。テキストエディタに切り替える。50%;">右側のコンテンツ%</div>の部分を削除。50%;">の50%の数値を書き換え以下のショードコードをコピーして使えばる。ビジュアルエディタに切り替える。『左側のコンテンツ%』にボックスタグを挿入する。『左側のコンテンツ%』を削除。左右を分割して左側の部分のサイズを自由に変更すればボックスの横サイズを自由に短くすることが出来るようになります。最後に『左側のコンテンツ%』は最後に消すようにしてください。最初に消してしまうと、タグも一緒に消えてしまいレイアウトが崩れてしまいます。しても先に消したいのでしたら、テキストエディタで消せばレイアウトが崩れずに問題なく使うことができますよ。難しいとは言わせない!?『WING(アフィンガー5)』でボックスタグを使いこなすどうも。カエルブロガーのケロ蔵です。文字を大きくしたり色を変えるといった方法があるとおもいます。...続きを見るアドセンス広告を横並びにするGoogleアドセンスでアドセンスコードを左右のレイアウトにそれぞれ貼り付ければ、広告を横並びにすることが出来るようになります。PCとTab左右50%もしくは全サイズ左右50%でレイアウトを分割。左右それぞれにアドセンスコードを貼り付ける。基本的な使い方はこれだけです。この方法を知っているだけでもアドセンスを横並びに表示させることができます。広告をたくさん並べて広告収入ガッポガポだぜ~!いや~それでうまくいくほど甘くないからね。ケロ蔵レイアウトを組み合わせれば可能性は無限大WINGでレイアウトを分割する方法について紹介しました。任意のレイアウトを選択サイズを変更したいときはテキストエディタに切り替えて、数値を書き換える。これだけ覚えておけば画像を横並びにすることが簡単に実行することができるようになります。あとはアイデア次第でいろんな使い方を探してみましょう。アイナレイアウトタグを上手に使ってブログを充実させましょう。(Wing)WING(アフィンガー5)でボックスの横幅を簡単に短くする方法どうも。カエルブロガーのケロ蔵です。ボックスを設置すれば注目してもらいたいポイントを目立たせることができるので、アフィリエイトをやるうえでは欠かせない機能ですね。(Wing)WPテーマWINGだとアイコンや画像のアニメーションも設定できるどうも。カエルブロガーのケロ蔵です。ブログの記事って静的な物が多く、動的な記事ってほとんど見かけません。(Wing)2018年11月の成果報告どうも。カエルブロガーのケロ蔵です。今までマトモな収益が発生してなかったこともあり収益公開は控えていたんですが、あるツイッターユーザーの話を聞いて僕もやってみようかなと始めることにしました。プラグイン【WING】データ収集に便利なアフィンガー最強プラグイン『タグ管理マネージャー3』を紹介どうも。カエルブロガーのケロ蔵です。アフィリエイトをやる上で必要なのはデータの収集です。ver20181115βのアップデートでアフィンガーの口コミ機能がパワーアップしたんだ。アイナ商品をブログで紹介する際によく使うから重宝するんですよね。休日は外に出かけず、1日中家にこもりっきりのインドア派。30代後半でブログで稼げるというのを知り、少しずつアクセスが増えはじめて本当に稼げるものだと実感している日々です。