新着情報

2021/02/26
アフィリエイトトレジャーのHTMLタグを編集する手順
を更新しました

2021/02/26
カテゴリページ知ると便利な知識
スマホサイトで情報商材を紹介する必須条件とは?
アフィリエイトトレジャーで画像挿入する時の注意点
を公開しました

アフィリエイトトレジャーでスマホサイト作成TOP > 知ると便利な知識 > アフィリエイトトレジャーで画像表示させる時の注意点

アフィリエイトトレジャーで画像挿入する時の注意点

 

スマートフォン



画像を挿入する時の設定は?




スマホサイト作成


当サイトのコチラ↑のカテゴリの記事で紹介した、
カスタマイズ済のアフィリエイトトレジャー及びにパフェクトトレジャーを使って、
スマホサイトを作成する手順を公開しました。


当たり前ですが、スマホサイトとて、
記事中に画像やイラストを使った方が、
見栄えが良くなります。

特に画像表示に至っては、


アフィリエイトトレジャーの画像サイズの拡大縮小


コチラ↑の記事で紹介した方法なら、
いかなる大きさの画像データでも、
スマホから閲覧した時にはその端末の枠に
すっぽり収まるように見れるのです。


例えば横幅1280pxのサイズでも、
スマホからは300pxのサイズかと
思うくらい画像が自動縮小されるのです。

(300px未満ならそのまま表示されます)



ですが、トレジャーツールを使って
記事中に画像を表示させる時の
設定ってアナタはご存じですか?


「そのまま挿入できるのですよね?」


はい、確かにそのまま挿入できます。

ところが、設定を間違えると見栄えの悪い
記事になってしまうのです。



どういうことかと申しますと、
これから説明していきますね。




適当に画像を挿入してしまうと



画像挿入



まず、トレジャーツールを立ち上げて、
記事を作成していきますよね。

上記の画像をご覧ください。


テキスト(文章)の文字色や大きさを
変えたりするボタンが並んでます。

うち、下段の右から2番目が
画像を挿入するボタンです。


コレをクリックすると、
画像の挿入画面が出てきます。



画像挿入



この画面が出て来ましたら、
赤枠で囲った「選択」を押します。

すると、下記のように画像フォルダが開きます。



画像挿入



記事中に挿入させたい画像を選択して、
「開く」ボタンをクリックします。

すると、再び画像挿入の画面が開きます。




「左寄せ」を選んではいけないワケ



「サイズの指定」という項目は、
自動縮小されるようカスタマイズをしていれば

「そのままの大きさで」

にチェックを入れたままで大丈夫です。


問題なのはこの後です。

「画像位置」の項目がありますが、
最初から「左寄せ」が選択されてます。




画像挿入



コレを、「左寄せ」にチェックが
入ったままにしてOKボタンを押して、
記事データをサーバーに
アップロードしてしまうと・・・





「左寄せ」を選択したままにした結果がコレw



画像挿入



どうですか
表示が変な形になりました(笑)



いえ、ニュースサイトなんかでは
こうして画像の横にテキストが表示
されてるWEBサイトもありますよ。

そういう表示方法が好きな方は
そのままで良いんですよ。


しかし、テキストを全て画像の真下に
表示するよう挿入させたい場合は
コレは見苦しいです。

そう思いませんか?


このように、「左寄せ」にチェックが
入ったまま画像を挿入させると、
<br>(改行タグ)を沢山つけないと
真下に表示されない事態となってしまうのです。



いちいち改行タグを何個つけるかなんて
記事を作成している間に考えたくないですよね?

ただ、コレをスマートフォンから閲覧した時は、
テキストは普通に画像の真下に表示されてました。



さすがにスマホの画面サイズでは、
画像横に文章の表示のさせようがありませんからね。




文章が画像真下に表示される設定は?



アナタがスマホユーザーだけのために
サイトを作るのでしたらこの設定のままでも良いと思います。


ですが、PCから閲覧された場合でも
文章が画像真下に表示されるように
させたい時は設定を変えなくてはなりません。


その手順をこれから説明します。



画像挿入



まず、挿入し直したい画像を再度選択します。

選択後、画像挿入の画面になったら、
画像位置は「通常」にします。




画像挿入



この設定だけで、テキストが画像の真下に
表示されるようになるのです。

可能であれば「ALT文字指定」の所に
挿入する画像のタイトルを入れるようにしましょう。



このタイトルは何でも良いです。

「アフィリエイトトレジャー」でも良いし
「画像挿入」でも構いません。


この「ALT文字指定」を設定することで
ほんの少しですがSEO対策になります。

そして、正しく表示される画像が↓コチラ。



「通常」を選択することで思い通りの画像表示に



画像挿入



いかがでしょう。

画像位置は「通常」を選択したことで
見出しとテキストがきちんと
画像の真下に表示されました!


また、挿入した画像のHTMLですが、
「左寄せ」と「通常」とではタグが異なります。

下記の画像をご覧ください。




「左寄せ」に挿入した画像のHTMLタグ



画像挿入



「通常」に挿入した画像のHTMLタグ



画像挿入



実は、「左寄せ」を選択した場合、

class="fl_left

というHTMLタグが表示されるのです。



コレは、「左寄せで表示されますよ」
という設定のメモなのです。

「通常」を選択した場合、
ファイル名とALT(任意に記入した場合のみ)
以外のタグはつきません。


なので、画像挿入時に、
誤って「左寄せ」を選択してしまっても、
そのタグを消せば良いだけのことです。




以上、アフィリエイトトレジャーで
画像挿入する時の注意点についてまとめました。

最後までお読みくださり、
ありがとうございました。




 

知ると便利な知識|記事一覧

スマホサイトで情報商材を紹介する必須条件とは?

スマホサイトで紹介できる商品は今まで、アフィリエイトトレジャー及びにパーフェクトトレジャーでは作成ができなかったスマートフォンサイト。それがスマホサイト作成当サイトのコ...

アフィリエイトトレジャーで画像表示させる時の注意点

画像を挿入する時の設定は?スマホサイト作成当サイトのコチラ↑のカテゴリの記事で紹介した、カスタマイズ済のアフィリエイトトレジャー及びにパフェクトトレジャーを使って、スマホサ...