Twenty Thirteenの検索結果表示をカスタマイズ

「Twenty Thirteen」の検索結果表示は、個人的にはタイトル表示が強調されすぎていると感じます。検索結果表示について、タイトル表示を調整します。記事の表示が全文ではなく抜粋であるのは、そのままにしておきます。

はじめに

「Twenty Thirteen」の検索結果表示をカスタマイズします。
・タイトル表示を調整

使用環境

WordPress :WordPress 4.2.3
テーマ  :Twenty Thirteen 1.5

タイトル表示を調整

タイトル表示は、スタイルシート「style.css」で変更します。以下、背景をなくして上下に境界線を追加し、文字サイズを調整した変更例です。

<変更前>

/**
 * 5.10 Search Results/No posts
 * ----------------------------------------------------------------------------
 */

.page-header {
	background-color: #e8e5ce;
}

.page-title {
	font: 300 italic 30px "Source Sans Pro", Helvetica, sans-serif;
	margin: 0 auto;
	max-width: 1040px;
	padding: 30px 0;
	width: 100%;
}

<変更後>

/**
 * 5.10 Search Results/No posts
 * ----------------------------------------------------------------------------
 */

.page-header {
	border-top   : 2px solid #a0a0a0;
	border-bottom: 2px solid #a0a0a0;
}

.page-title {
	font: 300 normal 24px  Osaka-mono, "MS Gothic", monospace;
	margin: 0 auto;
	max-width: 1040px;
	padding: 30px 0;
	width: 100%;
}

おわりに

「Twenty Thirteen」の検索結果表示をカスタマイズしました。

関連記事(Twenty Thirteenのページ固有の表示をカスタマイズ)

  1. Twenty Thirteenでトップページだけ表示を変更
  2. Twenty Thirteenの固定ページのコメント欄を削除
  3. Twenty Thirteenの前後の記事へのリンクをカスタマイズ
  4. Twenty Thirteenの投稿ページの日付表示等を移動
  5. Twenty Thirteenの投稿ページのコメント欄をカスタマイズ
  6. Twenty Thirteenのアーカイブ表示をカスタマイズ
  7. Twenty Thirteenの検索結果表示をカスタマイズ
  8. Twenty Thirteenのページナビゲーションをカスタマイズ

関連記事(目次)

  1. インターネットで情報発信!
ムームードメイン ロリポップ!レンタルサーバー

コメント記入欄

※メールアドレス(任意入力)は非公開です。コメントはお気軽にどうぞ!

内容を確認して、「コメント送信」ボタンを押してください。

post date*

※日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)