注目タグ

FAQ・よくある質問

トピック詳細

突然記事・サイドバーが下に落ちてしまいました

旧フォーラムの記事です http://blog.fc2.com/forum/viewtopic.php?f=6& t=2869
望海 2005-08-07 13:49:05
件名 :突然記事・サイドバーが下に落ちてしまいました

一番多いケースは画像の横幅が、記事の横幅に対して大きすぎるというパターンです。
自分でアップした画像のほかにアフィリエイトのバナーに、大きすぎるサイズのものを使っているケースもあるようです。
解決策として。


・画像を縮小してアップロードする(推奨)
画像をアップロードする前に、自分で画像編集用ソフトを利用して加工して小さくする方法と、アップロードの際にサムネイルを 作成する方法があります。
画像編集用ソフトを使って加工した方が手間はかかりますが比較的綺麗に画像を小さく出来ると思います。
なお、サムネイルの大きさは

環境設定の変更→ブログの設定

で変更できます。
作成されるサムネイルの大きさを見ながら、適宜調整してください。


・タグで画像の大きさを縮小する(非推奨)
見た目は小さくなりますが、ファイルサイズが小さくなったわけではないということで、私はあまりお勧めできません。
方法としては、自動挿入される画像タグに赤字部分を加えます。

<a href="画像URL" target="_blank"> <img src="画像URL" alt="画像の説明" border=& quot;0" height="画像の高さ" width=" 画像の幅"></a>

画像の幅と高さは計算した上で数字を入れてもいいのですが、「70%」など、パーセント指定するのが簡単でお勧めです。


・画像ではなく文字リンクを使う(アフィリエイトバナーの場合)
アフィリエイトバナーの場合、加工を禁止されているケースが多いです。
可能なら、小さいサイズの画像を使うといいと思いますが、それが用意されていない場合、文字によるリンクに変えてしまうとい うのも手だと思います。


また、画像以外の半角英数字の文字列(例えばURL)が長すぎ、記事が落ちることもあります。
その場合は、文字列を短くするか、途中に改行を入れてみましょう。

2005年08月07日 13:49  by FC2スタッフ

コメント一覧 3件中、1~3件表示

  • 旧フォーラムの記事です
    麻生(AdanKadan) 2006-12-04 12:06:49
    件名 :どこが原因かをつきとめるには

    テンプレートのカスタマイズを行なっていないのに、レイアウトが崩れる場合、原因は記事かプラグインです。
    いくつも変更を行なってからブログを見たら崩れていた、など、意外に原因がつきとめにくい時があります。


    ■どこが原因かをつきとめるには
    いくつか「記事ページ(固定URL)」を見ます。
    (固定URL=ブラウザ(IEなど)アドレス欄が以下のようになっています。)
    (http://xxxxxx.blogXX.fc2.com/blog-entry-XX. html)


    ◆プラグインが原因の場合
    トップページでも、どの固定URLでも、レイアウトが崩れているようであれば、プラグインなどメニュー類を疑います。
    例:画像が大きい(カウンターの文字を含む)、プラグインカスタマイズでHTMLタグミス。

    どのプラグインか不明の場合には、プラグインを一つずつ非表示にしていき、レイアウト崩れの有無をチェックし、原因となるプ ラグインを特定します。


    ◆記事が原因の場合
    一定の固定URLのみでレイアウトが崩れるのであれば、その記事が原因です。

    よくあるのが「画像が大きい」場合。この画像が大きいかな?と思ったら、その画像を(一時的にでも)削除してみます。

    画像のほかに記事内のHTMLタグが正しく閉じられていない場合もあります。
    (「<div>…</div>」、「<table>…</table>」 など、組にして使用しなければならないHTMLタグが、片方しか入っていない、「<」「>」「/」といった半角でい れるべき記号が全角、等)
    コピー&ペーストで貼り付けたHTMLタグも(コピペミスがありうるので)しっかりチェックします。


    ◆ツール
    Another HTML-lint gateway
    <a class="postlink" href="http://openlab .ring.gr.jp/k16/htmllint/htmllint.html">http://openl ab.ring.gr.jp/k16/htmllint/htmllint.html</a>
    でチェックすると、といった、タグミスを見つけることができることもあります。
    ただし、チェック結果を読み解くには、ある程度の知識が必要です。例えば、記事のなかに</div>を入れてし まった場合に、自動プログラムは記事中の</div>で<div>が閉じたと判断するので、そのページ の一番最後の</div>(テンプレートのもの)がミスとして指摘されたり……、といったズレが出ることがあります 。


    ※2007.1.24追記
    CSSレイアウトが崩れている時に試す10の処方箋::::::STOPN' LISTEN::::::to t he silence::::::
    <a class="postlink" href="http://stopnli sten.no.land.to/2007/01/css10.html">http://stopnlist en.no.land.to/2007/01/css10.html</a>

    2006年12月04日 12:06 by FC2スタッフ

  • 旧フォーラムの記事です
    pino 2005-12-14 15:49:51
    件名 :

    また、画像以外の半角英数字の文字列(例えばURL)が長すぎ、記事が落ちることもあります。
    参考として 記事を自薦しておきますw

    htt p://pinotan.blog15.fc2.com/blog-entry-106.html

    2005年12月14日 15:49 by FC2スタッフ

  • 旧フォーラムの記事です
    洵 2005-08-16 23:48:30
    件名 :G-Toolsをサイドバーに使う場合

    Amazonの広告生成システム、G-Toolsで崩れたという質問をいただいたので追記しておきます。

    G-Toolsで生成される基本のレイアウト(左に商品写真、右に説明文)は、
    「テーブル」を使って記事を左右に分けています。
    このテーブルの幅はけっこう広いので、これをプロフィールの説明文や
    サイドバーのフリーエリアに突っ込むと崩れてしまいます。

    レイアウトの種類の中に、「テーブルなし」というものがあります。
    これだと上に写真、下に説明文というレイアウトになり、あまり幅を取りません。
    こちらの「画像小」を選択して差し替えてみてください。
    かなりサイドバーが狭いものでなければ、崩れず収まると思います。

    なお、Amazonのライブバナーや検索バナーは、幅が決まっています。
    これをお使いのときは、サイドバーの幅が190ピクセル以上は必要になります。
    ゆとりのあるデザインのテンプレートを事前に選択してください。

    2005年08月16日 23:48 by FC2スタッフ