へなちょこIT社員阿部の日記

へなちょこIT社員阿部の日記

30歳目前、未経験でWEB制作会社にプログラマーとして転職した阿部のブログです。

Amebaでブログを始めよう!
会社の仕事とは関係ないのですが、3年ほど前に個人的にMTで作ったオンライン英会話に
関するサイトを久しぶりに見てみたらサイドバーの表示がひどいことになっているなと思った
のでなおしてみることにしました。

変更前は↓のような感じでした。枠から文字がはみ出しているばかりか、文字が重なって
しまっているところまであって痛々しい表示になってしまっていました。

サイド変更前

サイドバーの表示がこのようになってしまっていた原因は、MTはデフォルトの状態だと
各ページのタイトルがそのままサイドバーに表示されてしまうということにありました。 

ページタイトルを変更しないでサイドバーの表示だけを変更するためには、まずは、
/update/menu.tpl を編集します。


変更前↓
--------------------------
echo <<<EOM
$free_menu
<ul class="category01">
<li class="headline01"></li>
$entry_menu
</ul>
-------------------------- 

変更後↓
-------------------------------------------------------------  
$entry_menu= str_replace("の無料体験レッスン", "", $entry_menu);
$entry_menu= str_replace("の無料体験", "", $entry_menu_short);
$entry_menu= str_replace("の体験レッスン", "", $entry_menu_short);
$entry_menu= str_replace("の8日間お試し", "", $entry_menu_short);
echo <<<EOM
$free_menu
<ul class="category01">
<li class="headline01"></li>
$entry_menu
</ul>
------------------------------------------------------------- 

上記の変更の他にスタイルシートで該当部分のフォントサイズや余白を修正することで
ずいぶんとすっきりさせることができました。



やったことは、文字列関数の str_replace を使って、ページタイトル中の文字列の
サイドバーには表示させなくて良い部分を空白に置き換えたということだけです。 

ページタイトルのパターンがある程度決まっているものばかりという場合には、
手っ取り早い変更方法だと思います。

修正を行ったのは、下記のサイトです。
http://cable-televikko.com/