理事長の英語のお勉強

音楽家として、また法人としての国際コミュニケーションのために

工事中です。テーマ「CONTENTS」の概要

備忘録

グローバルメニューなどはこちら

www.dreamark.tokyo

 

 

テーマ「CONTENTS」の概要

２カラムでレスポンシブデザインに対応しているテーマです。
インストールするだけでスタイリッシュで読みやすいブログが完成。その理由とは。

「主役はコンテンツ」
テーマのコンセプトはコンテンツです。
記事タイトルや各種見出しを含むトータルなデザインされている。

さらに、コンテンツを作る時に使いたい機能のCSSデザインをデフォルトで適用済み。
作り手はコンテンツ制作に集中出来ます。

全体的にシンプルなデザインにし、コンテンツをメインに考えています。整えられた余白はブログを美しく見せてくれます。そして、ゆとりのある文字間隔は文章を読みやすくしてくれます。
作り手だけではなく、見てくれるユーザーにもコンテンツに集中していただきたいという想いです。
CONTENTSは、あなたのコンテンツをサポートします。

ベースカラーはコンテンツを際立たせるホワイト。メインカラーはここ数年男女に人気な少し彩度を抑えたネイビーを使用。アクセントカラーにはビビッドなピンクで目立つように配色されています。

NEWS

  • 2017年1月04日

おかげさまで2000インストール突破しました。みなさまありがとうございます。

  • 2016年7月22日

レスポンシブデザインのブレークポイントを増やしました。より幅広いレスポンシブに対応。ヨメレバリンクに図書館を追加しました。

  • 2016年7月12日

コピペ一発で簡単にCONTENTSのカラー変更できるコードを公開中。今回はCONTENTS×日本の夏ということで、夏にまつわる四色を用意しました。
http://www.dreamark.tokyo/entry/summer

主な適用済CSSデザイン

  • グローバルメニュー
  • フッター
  • リコメンド枠
  • 対話形式
  • コラム欄（三種類）
  • カエレバデザイン済
  • ヨメレバデザイン済
  • 目次
  • ページャー
  • 続きを読む

他にもカスタム部分を増やしていく予定です。

レスポンシブデザイン

CONTENTSはレスポンシブデザインに対応しています。
PC、ラップトップ、タブレット（縦、横）スマートフォン（縦、横）

レスポンシブデザインを適用するには

ダッシュボード→デザイン→スマートフォンタブ→詳細設定→レスポンシブデザインにチェックを入れて下さい。

CONTENTSのカスタマイズ記事

SNSフォローボタンをフラットにカスタマイズする方法を初心者にもわ分かりやすく解説します。
http://www.dreamark.tokyo/entry/followbutton
コピペ一発で簡単にCONTENTSの色を変更出来るコードを公開中
CONTENTS×日本の伝統色
http://www.dreamark.tokyo/entry/color
CONTENTS×日本の夏
http://www.dreamark.tokyo/entry/summer

スマホ観覧時に開閉式トグルメニューを表示する
http://www.dreamark.tokyo/entry/responsive

はてなブログ独自のスマホデザインでも表示するためのCSSパーツ集
http://www.dreamark.tokyo/entry/hatenasp

レクタングル広告のみを表示させ横並びにする方法とスマホで縦並びになる時の解消法
http://www.dreamark.tokyo/entry/rectangle

蛍光マーカーや画像のボーダーを消したい時など、細々したカスタマイズをQ&Aで紹介中
http://www.dreamark.tokyo/entry/qa

関連ページ

解説ページ。ご要望、ご意見、質問等はこちのコメント欄などへどうぞ。
http://www.dreamark.tokyo/entry/contents

Q&Aページ。困ったときや分からない時などにお役立て下さい。
http://www.dreamark.tokyo/entry/qa

レスポンスデザインの解説ページです。トグルメニューにする方法も紹介してます。
http://www.dreamark.tokyo/entry/responsive

デモページはこちらです。
http://contents.hatenablog.com/

 
 
 
 
 
 
 
 
 
 
 

contentsのデモページ

contents カスタマイズ

段落

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

フォトライフの写真設定をするとこのような表示になります。

左

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。


右

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。


ブロック

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

大きい画像

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

罫線

 

 

 

h1見出し

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

 

 

h2見出し

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

 

h3見出し（*）

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

h4見出し（**）

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

h5見出し（***）

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

 

h6見出し

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。
ABCDEFGHIJKLMabcdefghijklm1234567890

 

asin

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

「へんな会社」のつくり方 (NT2X)

「へんな会社」のつくり方 (NT2X)

 
あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

 

引用

本日（11月12日）から11月27日まで、はてなダイアリーの公開デザインコンテスト「公開デザイン祭2007秋」を開催します。

「公開デザイン祭2007秋」を開始しました - はてなダイアリー日記

リスト（ul,ol,dl）

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

  1. 大賞1名：Amazonギフト券5万円分
  2. 入選9名：Amazonギフト券1万円分
    1. 大賞1名：Amazonギフト券5万円分
    2. 入選9名：Amazonギフト券1万円分

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

大賞1名
Amazonギフト券5万円分
入選9名
Amazonギフト券1万円分

テーブル

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。

名前 色 個数
りんご 赤 1
みかん だいだい 2

あのイーハトヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモーリオ市、郊外のぎらぎら光る草の波。