[wp] wordpressを使う際に必ず追記するCSSのクラス設定

既存テンプレートを使わずにゼロからテンプレートを構築した場合はデフォルトでも必要なクラス設定を入れましょう。

主に必要になるのは、アップした画像の回り込みやセンター寄せ等のスタイルと、プラグイン「wp-pagenavi」用のスタイルです。

アップした画像の回り込みやセンター寄せ等のスタイル

(※marginの値は適所変更してください)

/* ================================================= */
/* wordpress UPLOAD IMG */
/* ================================================= */

img.centered {
	display: block;
	clear: both;
	margin: 0.25em auto 1.5em;
	/*margin: 10px auto;*/
	}

img.aligncenter {
	display: block;
	clear: both;
	margin: 0.25em auto 1.5em;
	/*margin: 10px auto;*/
	}
img.alignleft {
	float: left;
	clear: both;
	margin: 0.25em 1.5em 1.5em 0;
	/*margin: 0 10px 5px 0;*/
	}
img.alignright {
	float: right;
	clear: both;
	margin: 0.25em 0 1.5em 1.5em;
	/*margin: 0 0 5px 10px;*/
	}

プラグイン「wp-pagenavi」用のスタイル

(※colorやmargin/paddingの値は適所変更してください)

/* ================================================= */
/* wordpress Plugin [wp-pagenavi] */
/* ================================================= */

/*#post p{padding-bottom:20px;}*/

.navigation {
	display: block;
	text-align: center;
	margin-bottom: 30px;
	font-size:12px;
	}

.wp-pagenavi {
	clear: both;
	}

.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	border:0px solid #FFFFFF;
	padding: 3px 5px;
	margin: 2px;
	}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
	color:#fff
	font-weight:bold;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	}

.wp-pagenavi span.current {
	border:1px solid #4A872A;
	background:#4A872A;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	color:#fff;
	}

.wp-pagenavi .pages {
	display: none;
	}
]

Similar posts