はてなブログ デザインテーマ 全体的なレイアウト

ページの種類に関わらず共通で使用される。

<div id="globalheader-container">
  <!-- 有料プランの場合、div#globalheader-containerを非表示にできる。 -->
</div>
<div id="container">
  <div id="container-inner">
    <header id="blog-title">
      <div id="blog-title-inner">
        <div id="blog-title-content">
          <h1 id="title">
            <a href="https://sato-art.hatenablog.com/">サトウのメモ</a>
          </h1>
          <h2 id="blog-description">
            <!-- h2#blog-descriptionは「設定→基本設定→ブログ全体の設定→ブログのひとこと説明」が空欄ではない場合に表示される。 -->
          </h2>
        </div>
      </div>
    </header>
    <div id="top-editarea">
      <!-- div#top-editareaは「デザイン→カスタマイズ→全般→ヘッダ→ブログタイトル下」が空欄ではない場合に表示される。 -->
    </div>
    <div id="content">
      <div id="content-inner">
        <div id="wrapper">
          <div id="main">
            <div id="main-inner">
              <!-- ここに記事やアーカイブ、ページャが表示される。 -->
            </div>
          </div>
          <aside id="box1">
            <div id="box1-inner"></div>
          </aside>
        </div>
        <aside id="box2">
          <div id="box2-inner">
            <!-- ここにモジュールが表示される。 -->
          </div>
        </aside>
      </div>
    </div>
    <div id="bottom-editarea">
      <!-- div#bottom-editareaは「デザイン→カスタマイズ→全般→フッタ」が空欄ではない場合に表示される。 -->
    </div>
  </div>
</div>
<footer id="footer">
  <!-- 有料プランの場合、footer#footerを非表示にできる。 -->
</footer>

参考