ウィジェット「人気の投稿とページ」をタイル状に表示する

dsfgsfgfsd

ウィジェット「人気の投稿とページ」とは、こういうものです。

dfgsdgfsdfg

ちなみに装飾の方は、以下の CSS で行なっています。

/* 人気の投稿とページに枠をつける */
aside[id*=top-posts] h3.widget-title {
	background-color: #CCC;
	text-align: center;
	font-size: 14px;
	color: #555;
	border: none;
	padding: 10px 0;
}

#secondary aside[id*=top-posts] {
	padding: 0;
}

aside[id*=top-posts] {
	border: 5px solid #CCC;
	border-radius: 5px;
	padding: 0;
}

aside[id*=top-posts] ul li {
	list-style: none;
}

aside[id*=top-posts] ul {
	padding: 15px 12px 0;
}

aside[id*=top-posts] > p {
	padding: 10px;
	margin-bottom: 0;
}

aside[id*=top-posts] ul > li {
	border-bottom: 1px dotted gray;
	line-height: 1.5;
}

aside[id*=top-posts] ul > li:last-child {
	border: none;
	margin-bottom: 0;
}

aside[id*="top-posts"].widget ul li {
	padding-bottom: 8px;
}

このウィジェットには、上のような表示以外にも、「画像グリッド」を選択することで、

dfgafga

記事のアイキャッチ画像をタイル状に表示したり、

dsfgsfgfsd

「テキストリスト」を選択することで、リスト表示することができるようになっています。

gafdgsfg

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。