デザインテーマ『gothic tune』のカスタマイズ

デザインテーマ『gothic tune』

デザインテーマ『gothic tune』のサムネイル

PC版でのカスタマイズの例

ナビメニューの記述例

• [管理画面]-[デザイン]からヘッダーなどの箇所に、以下のように記述すると横並びのリスト表示ができます。URLの箇所を書き替えるとリンクとして機能します。ナビゲーションメニューなどにお使いいただけます。

<div class="g-nav">
    <ul>
        <li><a href="URL">トップページ</a></li>
        <li><a href="URL">アーカイブ</a></li>
        <li><a href="URL">サイトマップ</a></li>
        <li><a href="URL">このブログについて</a></li>
    </ul>
</div>

つくりかた

　まず、以下手順1のように入れ物を作ります。

• 手順1

<div>
</div>

• 手順2

　divタグにクラス名を書いてあげます。

<div class="g-nav">
</div>

• 手順3

divタグの入れ物の中に新しく ul タグの入れ物を作ります。ulタグは箇条書きリストのタグです。

<div class="g-nav">
    <ul>
    </ul>
</div>

• 手順4

ulタグの中身に箇条書きリストの liタグを必要な数だけ用意します。（この例では4つの場合です。）

<div class="g-nav">
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>

　ここまでできたら、一度、表示させたい場所にコピペしてみてください。

　できましたか？
　うまく表示されていれば、上出来です。

• 手順5

　ここから先はご自分でできられると思います。

• ナビメニューの記述例（再掲）

<div class="g-nav">
    <ul>
        <li><a href="URL">トップページ</a></li>
        <li><a href="URL">アーカイブ</a></li>
        <li><a href="URL">サイトマップ</a></li>
        <li><a href="URL">このブログについて</a></li>
    </ul>
</div>

お知らせ欄の記述例

• [管理画面]-[デザイン]からヘッダーなどの箇所に、以下のように記述するとお知らせ欄を設置できます。

<div id="header-oshirase">
    <p>任意の文字列</p>
</div>

応用編

<div id="header-oshirase">
    <ul>2025/03/22
        <li>お知らせはありません</li>
    </ul>
</div>