MysticDiary

mysticな風景

Posted by baorin   0   0

このブログをはじめたときは、なんかMystic(神秘的)なものについて
書こうとはじめたんだけど、いつのまにか、テンプレート作成のブログに
変容してしまった。
今回はごくごくシンプルにタイトル周りだけちょっと工夫して、
スライダーをつけてお好きな画像で飾れるようにしてみました。

カスタマイズ方法については追記で書きますね。

misty_20180928134522e09.jpg

mistylook.jpg

1.上部ナビゲーションの編集
<nav id="menu">
<a href="<%url>archives.html" onfocus="this.blur();" class="nonborder border" title="記事リスト">Articles List</a>
<a href="#" onfocus="this.blur();" class="nonborder" title="LoremIpsum">Lorem Ipsum</a>
</nav>
<nav id="menu2">
<a href="#" onfocus="this.blur();" class="nonborder border" title="AobutMe">About me</a>
<a href="<%server_url>control.php" onfocus="this.blur();" class="nonborder" title="管理画面">Log in</a>
</nav>

これはいつもとおんなじ。#のところにリンクをいれて、好きなタイトルに変更するだけです。

2.スライダーの編集
<ul class="rslides">
<li><img src="https://blog-imgs-122.fc2.com/m/y/s/mysticdiary/misty1_201809051544374db.jpg" alt=""></li>
<li><img src="https://blog-imgs-122.fc2.com/m/y/s/mysticdiary/misty2_201809051544383a6.jpg" alt=""></li>
<li><img src="https://blog-imgs-122.fc2.com/m/y/s/mysticdiary/misty3_201809051544401c2.jpg" alt=""></li>
</ul>

今回はレスポンシブスライドというプラグインを使ってます。
画像のアドレスをお好きな画像に変更してください。写真の大きさは揃えた方がうまくいきます。
head内にプラグインの設定が書いてあります。細かく設定されたい方は
ここで変更してください。

3.記事下の著作者の紹介文
<span class="authorname"><span class="name"><%author_name></span><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation. </p>

これはお好きな文章を入れてください。

今日付けで共有申請したので、またダウンロードできるようになるのに何週間かかかると思います。
よろしくお願いします。

関連記事
baorin

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.

Leave a reply






管理者にだけ表示を許可する

Trackbacks

trackbackURL:https://mysticdiary.blog.fc2.com/tb.php/602-a314afe1