menu
閉じる
閉じる
閉じる
  1. 2017年4月から手取額が同額の場合も定期同額給与扱いに-平成29年度…
  2. 配当金は持参債務-株主が海外に居住している場合はどうする?
  3. 2016年3月期東芝の監査報酬は53億円-FACTA2017年4月号
  4. 仮想通貨(ビットコイン等)が消費税の非課税対象に
  5. 「法人税。住民税及び事業税等に関する会計基準」が公表されました。
  6. 株主総会で従業員株主が複数質問するも総会決議に著しい不公正がないと判断…
  7. セルフメディケーションの添付書類の見直し
  8. 不正アクセスでクレジットカード番号等の情報が流出した可能性を開示-GM…
  9. 取締役会の専決事項とされる「多額の借財」の「多額」はどのレベル?
  10. エフオーアイの粉飾決算で主幹事証券に賠償責任が認められた判決ー東京地裁…
閉じる

出る杭はもっと出ろ!

WordPress Twentytenでサイドバーの幅を変更するには?

サイドバーに広告を表示していますが、表示したい広告の幅が234pxで、twentytenのデフォルトのサイドバーの幅だと途中で切れてしまうことがわかりました。

そこまでしなくてもと思う反面、「社会人&学生のための大学・大学院net」はなかなか面白いので是非バナーを張り付けたいという希望もあって調べてみました。

まず、表示形式はstyle.cssというファイルで定められており、サイドバーの幅もこのファイルで定められているということがわかりました。
次に、styele.cssを直接直してもいいのですが、子テーマを作るという方法を採用すると、オリジナルのstyle.cssをそのままにしたうえで、変更したい部分のみを優先的に適用するということが可能ということもわかりました。

まず、私にはイメージしにくかった子テーマですが、やることを先に簡単にまとめると以下のようになります。
①wp-contentフォルダのthemes?ファルダの中に適当な名称のフォルダを一つ作成する。
②そのフォルダ(私の場合は”sub 2010″というファルダ)にtwentytenのstyel.cssをコピーする。
③ オリジナルのstyel.cssを変更したい部分だけ変更していらない部分は削除する。

原理的には、子テーマのstyel.cssで設定されていない部分はtwentytenのオリジナルのstyel.cssを基本的に読み込むというようにするということのようです。

まず、子テーマで設定していない部分はtwentytenのstyel.cssを使用するようにするため、”@import url(“../twentyten/style.css”);?”を加えます。
私の場合は、オリジナルのファイルの冒頭を以下のように変更しました。

次に、オリジナルのファイルで62行目くらいにあるLAYOUT Two columsという部分で記事とサイドバーの配置を定めていることがわかったので、20pxずつ拡大するようにしました。
具体的には以下のようになっています。

オリジナルのファイルでは、-260pxが-240px、300pxが280px、240pxが220pxになっています。

最後にオリジナルのファイルで154行目くらいにある Structure以下が全体の幅等を定めている部分なので、この幅を20px拡大します。
具体的には#wrapperのwidthを940pxから960pxに20px拡大しました。
正直関係はよくわかりませんが、上記とここで調整する数値を同じだけ調整するという方針で変更しました。
コードは以下のようになっています。

以上で終了です。上記のとおり、その他のいらない部分はすべて削除していますが、上記以外の部分についてはオリジナルのファイルを読み込んでいるためちきんと動作するようです。

日々成長

関連記事

  1. 人気のある記事を表示するプラグイン-「WP-PostViews」…

  2. Akismetを1週間使ってみた感想

  3. アーカイブ画面の修正

  4. WordPress3.3.1へのバージョンアップ準備(その2)

  5. 急にスパムのコメントが増えた!-Akismetはどうすれば。。。…

  6. カレンダーと月別アーカイブからの表示のカスタマイズ

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

カテゴリー

ページ上部へ戻る