サイドバーが切れたらここで修正

最短ホームページテンプレートの使い方 サイドバーが切れたらここで修正

今回はサイドバーが切れてしまった時の対処法をお伝えします。

最短ホームページテンプレートの動画にはありませんが、
これも多くの方が疑問になると思いますので、編集方法を覚えましょう。

サイドバーが切れるってどんな状態なのか?

最短ホームページテンプレートを使っていると、
ページを増やしたり、情報を追加していくことになるので
サイドバーに掲載したいことも増えていきます。

サイドバーの編集方法はこちらを参照

すると、サイドバーの長さが足りず
途中で切れてしまう現象が出てきてしまいます。
サイドバーの長さが足りず 途中で切れてしまう

このように、途中でサイドバーが切れてしまうのは
初期状態ではサイドバーの長さを決めてあるから。

焦ることはありません。

ただ、サイドバーの長さを指定してあげれば解決します。

サイドバーを長くするには、ここを編集する

最短ホームページテンプレートの場合、
サイドバーの長さを指定できるようになっています。

従って、サイドバーの長さを指定している数字を変更します。
※今回はindex.htmlのソースで説明します

まず<!–ここがサイドバーです–>を探し、
<iframe height=”600″ Width=……… の部分を見つけます。
<iframe height="600" Width=……… の部分を見つけます。見つけたら<iframe height=”600″ Width=… の
height=”600″の数字(600)を変更します。

この数字を大きくすれば長くなります。
この数字を小さくすれば短くなります。

ですので、今回は倍の1200に変更して保存しました。
ですので、今回は倍の1200に変更して保存しました。
すると切れていたサイドバーが伸びるので
しっかりと表示されているか確認すれば完成です。
しっかりと表示されているか確認すれば完成です。

【ワンポイント】
サイドバーが途中で切れてしまったら
長さを指定している部分の数字を変更するだけ!

注意するのは伸ばしすぎと、他ページも変更すること

今回は分かり易くするため、例としてindex.htmlを編集し
高さをheight=”1200″と2倍の長さにしました。

サイドバーが表示される部分を長くした場合、
ページ全体が伸びますので、メインコンテンツが少ないと
フッターとの間に大きな空白が出てしまいます。

従いまして、しっかりとメインコンテンツを入れて
フッターとの間に大きな空白ができないようにするか、
サイドバーを伸ばしすぎないように注意して下さい。

何もない空間が広いと、素人っぽくてダサイです。
何もない空間が広いと、素人っぽくてダサイです。

また、index.htmlを変更しましたので、
変更がされているのは、index.htmlのページだけです。

従って、他ページ(side.htmlは除く)の変更を
同じようにする作業を忘れずにおこなって下さいね。
同じようにすることを忘れずにやって下さいね。

最短ホームページテンプレート
サイドバーが全てのページ表示されますので、目立つ部分です。

この特性を有効に利用して良いホームページを目指しましょう。

【ワンポイント】
全てのページで、サイドバーの長さを変更して下さい。
サイドバーの伸ばしすぎに注意です。

 


関連記事


初心者さんおすすめ! 徹底比較 簡単ホームページ作成ソフトランキング


おすすめ記事


ボタンマルシェ - ButtonMarche

人気の記事

  1. ホームページを作れるメリット
    ホームページが作れるというスキルの素晴らしさとメリット
  2. わからないことを解決する検索力を鍛えよう
    わからないことを解決する検索力を鍛えよう
  3. 視線を意識しよう!
    ホームページのデザインは見る人の視線を意識しよう!
  4. 知らないって怖い!ホームページ制作やSEO対策業者の甘い罠
    知らないって怖い!ホームページ制作やSEO対策業者の甘い罠
  5. ホームページとブログの違いは何?

ピックアップ記事

  1. 個人事業主さんが商用でホームページを作るなら心得ておきたいこと!

    個人事業主さんが商用でホームページを作るなら心得ておきたいこと!

    当サイトへのアクセスを見ていると 自営業や個人事業主さんからのアクセスも多いです。会社組織ではなく本…
  2. htmlがわからなくてもホームページは作れるのか?

    htmlがわからなくてもホームページは作れるのか?

    ホームページ作成を検討している方の中には HTMLがよくわからない方がいると思います。そんな方が疑問…
  3. おしゃれなホームページを作るのに向いてるソフトは?

    おしゃれなホームページを作るのに向いてるソフトは?

    今回はデザインを重視する方に向けて「おしゃれ」なホームページを作るのに向いている作成ソフトをランキン…
  4. YahooやGoogleでの検索順位をチェックできる優良ツール

    YahooやGoogleでの検索順位をチェックできる優良ツール

    ホームページを運営する人にとっては、 YahooやGoogleでの検索順位はとても気になります。そこ…
  5. 初心者さんが失敗

    初心者さんがソフト選びに失敗する最大の原因

    ホームページ作成ソフトを購入したのは良いけど、 結局、ホームページを完成することが出来ずソフトはお蔵…