「はてなグループ」について RSSフィード
 

2011年7月15日をもちまして、はてなサポート掲示板は新規投稿の受付を停止致しました。
今後は、人力検索はてなの「はてなの使い方」カテゴリーをご利用ください。
※ご要望や不具合のご報告ははてなアイデア、はてなからのご返信が必要な質問はお問い合わせページをご利用ください。

65YuichirouYuichirou   64  Re:日記のタイトルを画像に

まず、はてなダイアリー/グループのHTMLは一般的に次のような構造になっています。

<body>
  <table>(ヘッダバー)</table>
  <h1>(日記のタイトル)</h1>
  <div class="hatena-body">
<!-- ここから「ページのヘッダ」(よくある記述例) -->
    <div class="main">
<!-- ここまで「ページのヘッダ」 -->
      <div id="days">
      (日記本体部分)
      </div>
<!-- ここから「ページのフッタ」(よくある記述例) -->
    </div>
    <div class="sidebar">
    (略)
    </div>
<!-- ここまで「ページのフッタ」 -->
  </div>
</body>

ここで、「ページのヘッダ」「ページのフッタ」は、詳細設定で書き換えることができます。また、このHTMLの表示については、「スタイルシート」でデザインを変えることができます。

そこで、これを次のように修正します。

<body>
  <table>(ヘッダバー)</table>
  <h1>(日記のタイトル)</h1> ←これをスタイルシートで非表示にする
  <div class="hatena-body">
<!-- ここから「ページのヘッダ」 -->
    <h1><img src="(日記のタイトルとして表示したい画像のURL)"></h1>
    <div class="main">
<!-- ここまで「ページのヘッダ」 -->
      <div id="days">
      (日記本体部分)
      </div>
<!-- ここから「ページのフッタ」 -->
    </div>
    <div class="sidebar">
    (略)
    </div>
<!-- ここまで「ページのフッタ」 -->
  </div>
</body>

具体的には、設定の「ページのヘッダ」と「スタイルシート」にそれぞれ次のように記述してみてください。

ページのヘッダ

<h1><img src="(日記のタイトルとして表示したい画像のURL)" alt="(画像が表示されるまで仮に表示する文字列)"></h1>
<div class="main">

スタイルシート

すでにある記述の下に追加してください。

/* 通常の「日記のタイトル」を非表示 */
h1 {
  display: none;
}
/* 追加した日記のタイトル(もどき)は表示 */
div.hatena-body h1 {
  display: block;
}
返信2009/04/15 13:19:23
  • 65Re:日記のタイトルを画像に YuichirouYuichirou 2009/04/15 13:19:23
    まず、はてなダイアリー/グループのHTMLは一般的に次のような構造になっています。 ここで、「ページのヘッダ」「ページのフッタ」は、詳細設定で書き換えることができます。また、このHTMLの表示に ...