vanillaice (Akira)

vanillaice (Akira)

sample
カテゴリなんかが増えていくと サイドバーの縦幅が必然的に長くなって不格好になります
短文記事の横に縦に長~~~いサイドバーというのは鬱陶しいものでございます (´・ω・`)
サイドバー… プラグイン表示されている方がほとんどだと思いますが
各項目の縦幅を予め決めてしまい 溢れた分はスクロール表示にする方法ですね
これが一番手っ取り早いかと思います


テンプレートのソースではなくてですね
プラグインの設定からやりますので

設定 > プラグインの設定 >

こちらから該当プラグインの 詳細 > プラグイン改造 > HTMLの編集

ここまでたどり着きましたら
まず最初に


<div>


というタグを探します
大抵の場合 一番最初にくっついてると思います
あるいは


<div id="●●" class="▲▲">


こんなふうに id だとか class だとかついてる場合もあります
え そんなタグ無い?
絶対ある 探すんだ 頑張れ ^。・x・)b
まぁ、なかったら追加してください。
その際は元あるコードの頭に
<div>
、お尻に
</div>
でコード全体を挟みます。
そしてさらに以下の手順でスクロールボックス構成内容を追加します
ここでは例として 私はカテゴリ表示をツリー化するプラグインを入れておりますので
そちらを使用しますね
元のソースがこちらです ↓


<div>
<!--category-->
<div &align>
<!--category_sub_hasnext-->┣<!--/category_sub_hasnext-->
<!--category_sub_end-->┗<!--/category_sub_end-->
<a href="<%category_link>" title="<%category_name>"><%category_name> (<%category_count>)</a>
</div>
<!--/category-->
</div>


最初にありますよね
ここに追加するのが

style="height: 高さpx; overflow-x: hidden; overflow-y: auto;"

・高さ というのが予め設定したい縦幅のことです
・style="内容" というのが最初から入っている場合は 最初に入っているものを消してしまわないよう注意して
; (セミコロン) の後ろに height: 高さpx; over..略... を続けます

修正したものがこちら (縦 200px 設定) ↓


<div style="height: 200px; overflow-x: hidden; overflow-y: auto;">
<!--category-->
<div &align>
<!--category_sub_hasnext-->┣<!--/category_sub_hasnext-->
<!--category_sub_end-->┗<!--/category_sub_end-->
<a href="<%category_link>" title="<%category_name>"><%category_name> (<%category_count>)</a>
</div>
<!--/category-->
</div>


スクショ ↓



縦幅が 200px を超えたら自動でスクロールバーが出るような指定です
overflow-x: hidden; というのは
横のスクロールバーを「出さない」という指示です
横のスクロールバーが出るとこれまた疎ましいので 表示させない方が良いと思います
出したいんだよ ●`з´●
という方は

overflow-x: hidden; overflow-y: auto;

の部分を

overflow: auto;

と書きなおしてください

縦幅が小さすぎると スクロールしづれぇ
な事態に陥りますので 150px ぐらいはあった方が良いかな~ たぶん (´・ω・`)

記述の際には
コロン ( : ) と セミコロン ( ; ) が間違っていないか
" と " の間に指定内容が収まっているか 等
気をつけながらやってみてくださいませ
関連記事
Posted by

Comments 0

There are no comments yet.

Leave a reply

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です
ご質問の前に必ずお読みください ↓
FC2テンプレート ご利用時のお願い
該当テンプレートの専用記事にお願いします。無関係な記事でのコメントはお控えください。
テンプレートカテゴリ