Milky Diary

テーマ「Milky Diary」のデモサイトです♪

【必須設定】カード型デザインを使う

カード型デザインを使うために、必ず以下を設定してください。 トップページの表示形式を一覧形式にする アイキャッチ画像を設定する ①について トップページの表示形式を必ず変更して下さい。 無料ユーザーの方は、以下の記事の通りに設定すればカード型デ…

【必須設定】無料ユーザーの方がカード型レイアウトを使用するための初期設定

カード型レイアウトを使うためには、トップページの表示形式を「一覧形式」にする必要があります。 しかし、これは有料プラン(はてなPro)専用の機能です。 そこで、無理やり一覧形式❝風❞にしてカード型レイアウトにできるようにします。 以下のコードをhea…

【必須設定】スマホデザインを適用するためのコード追加(レスポンシブ対応)

デザイン→スマートフォン→詳細設定→レスポンシブデザインにチェックを入れる 設定→詳細設定→head要素に以下のコードを追加 <meta name="viewport" content="width=device-width"> これを追加しないと、スマホやタブレットでサイトに訪問しても、パソコン閲覧時のデザインが表示される可能性があります。</meta>

簡単カスタマイズ設定③(上に戻るボタン ※スマホ対応)

ブログテーマに含まれている上に戻るボタンを紹介します♪ スマホにも対応しています! 初心者さんもコードの貼り付けだけで立派なメニューをすぐに実装できるようにしてありますෆ(◕ㅂ◕)ෆ 実装後のイメージ 上に戻るボタン実装用コード 色の変更 実装後のイメ…

簡単カスタマイズ設定②(ヘッダーメニュー ※スマホ対応)

ブログテーマに含まれているヘッダーメニューを紹介します♪ スマホにも対応しています! 初心者さんもコードの貼り付けだけで立派なメニューをすぐに実装できるようにしてありますෆ(◕ㅂ◕)ෆ 実装後のイメージ メニュー実装用コード(HTML) カスタマイズ用コ…

簡単カスタマイズ設定① (囲み枠/ボックスデザイン)

ブログテーマに含まれている囲み枠を紹介します♪ HTMLを定型文に保存してすぐに取り出せるようにしておけば、簡単に囲み枠を使うことができますෆ(◕ㅂ◕)ෆ 色を変更する場合のみ、デザインCSSにコードを追加して下さい。 シンプルな囲み枠 背景色付き囲み枠 背…

サンプルエントリーその2 (記事タイトルが長い場合)記事タイトルが長くなりすぎないように注意!長すぎるとサムネイルに全部表示されない。

この記事は、記事ページのデザインを確認するためのサンプルエントリーです。 段落 画像(はてなフォトライフ) 画像(キャプション付き) 脚注 罫線 見出し h2見出し h3見出し h4見出し h5見出し h6見出し テキスト装飾タグ asin 引用 リスト(ul,ol,dl) …