Base01

Outline
フォントと余白を整えただけの、非常にシンプルなテンプレート。
作品をメインに見せるために、このまま使うのも良し、お好みでカスタマイズするベースとするも良し。
トップページとサンプルページのみですが、「コンテンツの編集用コード」を挿入できますので、サイトのコンテンツに合わせて必要なコードを張り付けてお使いください。
ギャラリーページ、小説連載用ページなどのコンテンツを追加しました。
デザインについて
| 作品タイプ | なし |
| テイスト | シンプル |
| フォント | EB Garamond、Noto Serif JP |
| カラー | 白、黒、赤 |
コンテンツの特徴
小説
- 2種類の小説一覧ページ
ー表紙やタイトルなどをカード型にならべるタイプ
ーカテゴリーごとにタイトルやあらすじを一覧表示するタイプ - 表紙画像を大きくトップに表示できる長編小説用目次ページ
- 小説本文ページは、文を読みやすく余白を調節
- 小説本文のみ、改行タグをつかわなくても、<p>~</p>の中に本文をいれることで空白や改行をそのまま表示可能(each.cssにて変更可能)
ギャラリー
- 大きめサムネイル
- サムネイルクリック→全画面表示→全画面のどこかをクリック→一覧へ戻る
- ライブラリ不使用
- each.cssで簡単に編集可能
カスタマイズについて
フォント、カラー
- root.cssで一括管理のため、root.cssの修正のみで可能
SNSアイコン
- Simple Icons を使用
- SVGをコピペで差し替え可
Thanks
| フォント | Google Font |
| アイコン | Simple Icons Tabler Icons |
| お題 | ノーチラス |
※敬称略
license
Update
| 2026.08.03 | Galleryの画像ポップアップ時の文字表示を修正 |
| 2026.06.22 | コンテンツを追加、カラーを修正 |
| 2026.03.11 | 公開・配布 |
File
| css reset.css common.css each.css root.css | reset.cssは編集不要。 common.css:サイト全体共通のデザイン each.css:各コンテンツのデザイン root.css:フォント、カラーの設定 デザインを編集したい場合は各ファイルを編集してください。 |
| js common.js | サイト内で使用しているJavaScriptを記載しています。JavaScriptを追記する場合はこちらに追記可能です。 |
| index.html | トップページ |
| works.html | 表紙付き小説のタイトル一覧用ページ |
| gallery.html | ギャラリー用のページ |
| novel.html | 小説のタイトル一覧用ページ |
| series.html | 長編小説の目次ページ |
| novelpage.html | 小説の本文用ページ |
| blog.html | ブログ、日記、メモなど用のページ |
| sample.html | 見出しなどのサンプルページ |
| base.html | コンテンツの記載のないベースページ |


※コメントは最大500文字、5回まで送信できます