個別記事にサイドバーを表示-WordPress Twenty Elevenカスタマイズ

更新


twentyelevenは、レスポンシブでとても使いやすいテーマなのですが、そのままでは個別記事ページにサイドバーが表示されません。

少々苦労してサイドバーを表示させてみましたが、終わってみればとても簡単に出来ることがわかりました。

style.css

まずstyle.cssをちょっと書き換えます。

エディタの検索機能を使って、以下のような部分を探します。デフォルトのまま何もいじってなければ100行目前後のところにあります。

/* Singular */
.singular #primary {
margin: 0;
}
.singular #content,
.left-sidebar.singular #content {
margin: 0 7.6%;
position: relative;
width: auto;
}
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
margin: 0 auto;
width: 68.9%;
}
/* Attachments */

そして、/* Singular /と/ Attachments */の間を以下のように書き換えます。

/* Singular */
.singular #primary {
float: left;
margin: 0 -26.4% 0 0;
width: 100%;
}
.singular #content,
.left-sidebar.singular #content {
margin: 0 34% 0 2%;
width: 64%;
}
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
margin: 0 auto;
width: 100%;
}
/* Attachments */

single.php

次に、single.phpをいじります。デフォルトのままいじってなければ、末尾は次のようになっています。

<?php get_footer(); ?>

ここに、少し書き足します。

<?php get_sidebar(); ?>
<?php get_footer(); ?>

style.cssとsingle.phpをFTPソフトでアップロードすれば、サイドバーが出現するはずです。こんな感じになります。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です