「wordpress」カテゴリーアーカイブ

WordPress Twenty Fourteenのメイン,サイドバーの幅変更について


WordPressの話題です.

Twenty Fourteen テーマがものすごくカッコ良かったのですがデフォルトのsite-content幅が474pxしかありませんでした.

しょうが無いのでmax-widthの要素を700pxに変更しました.全部で6箇所.

.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
    margin: 0 auto;
    max-width: 700px;
}
.post-navigation,
.image-navigation {
    margin: 24px auto 48px;
    max-width: 700px;
    padding: 0 10px;
}
.archive-header,
.page-header {
    margin: 24px auto;
    max-width: 700px;
}
.contributor-info {
    margin: 0 auto;
    max-width: 700px;
}
.comments-area {
    margin: 48px auto;
    max-width: 700px;
    padding: 0 10px;
}
.site-main .mu_register,
.widecolumn > h2,
.widecolumn > form {
    margin: 0 auto 48px;
    max-width: 700px;
    padding: 0 30px;
}

 

しかしその後,コンテンツサイドバーの幅も気になってしまってそれも変更することに.

そちらの設定は以下のところです。

.content-sidebar {
        margin-left: -29.04761904%;
        width: 29.04761904%;
}

こちらの値を増減させればレスポンシブで幅を調整できます。

 

また,デフォルトでTwenty Fourteenはアイキャッチと左のサイドメニューが接触しているデザインですが以下の部分を変更するとMarginが取れます。

.site-content {
        margin-right: 29.04761904%;
        margin-left: 182px;
}

 

だいぶコレで自分好みになりました.

しばらくはまだいじってみようと思います!