Ocean - テーマ ストア (original) (raw)

フェミニンでシンプルがテーマのシンプルなデザイン構成です。どんな大きさの画面でも見やすく、レスポンシブデザインに対応しています。iPhone iPadの縦向きは1カラム、PC iPadの横向きは2カラムレイアウトになります。

テーマOceanの日付の背景色を変更したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペして#9ffの部分を好きな色に変更してください。

/* 日付の背景色を変更する */

.date a { background-color: #9ff }

.date-last-updated { background-color: #9ff }

テーマOceanのサイドバーのアイコンの色を変更したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペして#f99の部分を好きな色に変更してください。

/* サイドバーのアイコンの色を変更する */

.hatena-module-title::before { background-color: #f99 }

テーマOceanのサイドバーのタイトル下の下線の色を変更したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペして#f99の部分を好きな色に変更してください。

/* サイドバーのタイトル下の下線の色を変更する */

.hatena-module-title::after { background: linear-gradient(to right,#f99,transparent) }

テーマOceanのアーカイブページ(記事一覧ページ)のアイキャッチ画像を3:2に変更したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペしてください。デフォルト設定は16:9です。

/* アーカイブページ(記事一覧ページ)のアイキャッチ画像を3:2にする */

.page-archive .archive-entry .entry-thumb { aspect-ratio: 3 / 2 }

テーマOceanのアーカイブページ(記事一覧ページ)のアイキャッチ画像を4:3に変更したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペしてください。デフォルト設定は16:9です。

/* アーカイブページ(記事一覧ページ)のアイキャッチ画像を4:3にする */

.page-archive .archive-entry .entry-thumb { aspect-ratio: 4 / 3 }

テーマOceanのアーカイブページ(記事一覧ページ)のカード型デザインの枠線を消したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペしてください。

/* 追加 枠線を消す */

.page-archive .archive-entry { border: none }

テーマOceanの見出しデザインをリセットしたい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペしてください。

/* 見出しデザインをリセットする */

.entry-content h1::before, .entry-content h1::after, .entry-content h2::before, .entry-content h2::after, .entry-content h3::before, .entry-content h3::after { content: none } .entry-content h4, .entry-content h5, .entry-content h6 { border-bottom: none }

テーマOceanのサイドバーの注目記事のランキングカウンターを消したい場合は、デザイン→カスタマイズ→デザインCSSに以下のコードをコピペしてください。

/* ランキングカウンターを消す */

#box2 .hatena-module-entries-access-ranking .hatena-urllist li::before, #box2 .hatena-module-entries-access-ranking .hatena-urllist li:nth-of-type(1)::before, #box2 .hatena-module-entries-access-ranking .hatena-urllist li:nth-of-type(2)::before, #box2 .hatena-module-entries-access-ranking .hatena-urllist li:nth-of-type(3)::before, #box2 .hatena-module-entries-access-ranking .hatena-urllist li:nth-of-type(n+9)::before { background-color: transparent; content: none } #box2 .hatena-module-entries-access-ranking .urllist-date-link, #box2 .hatena-module-entries-access-ranking .urllist-title-link { margin-left: 0 }