contactshop

GWも終わりですねえ

あ~、楽しかったGWも本日で終了とのことで、テンション下がりまくりの管理人です。 これから仕事も忙しくなるしなあ・・・とのことで、ここらで作っておいたテンプレートを 共有申請してみました。 気に入った方はご自由にお使いください。 tomas.jpg 追記に使用方法について書きます。
tiltmemory.jpg<a class="pin" data-pin-do="buttonPin" data-pin-custom="true" data-pin-lang="ja" href="//www.pinterest.com/pin/create/button/?url=&media=&description=" title="Pin it on Pinterest" target="_blank">pin it
1.上部ナビゲーションの編集
<nav id="menu">
<ul>
<li><a href="<%url>archives.html" onfocus="this.blur();" class="nonborder" title="記事リスト">Articles List</a></li>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="LoremIpsum">Lorem Ipsum</a></li>
<li><form action="./" method="get"><input class="input" type="text" name="q" value="" placeholder="SEARCH" autocomplete="off" /></form></li>
<li><a href="<%server_url>control.php" onfocus="this.blur();" class="nonborder" title="管理画面">Log in</a></li>
</ul>
</nav>
これはいつもとおんなじ。 #のところにリンクをいれて、好きなタイトルに変更するだけです。 いつもと違うのは3つ目のリンクは検索フォームにしたことかなあ。 2.記事に画像がない場合の設定
<!--body_img_none-->
<ul class="grid grid--xray">
<li class="grid__item">
<div class="grid__img">
<a href="<%topentry_link>" onfocus="this.blur();" class="nonborder"><img src="https://file.blog.fc2.com/mysticdiary/tiltphoto/woman.jpg" class="tilt-effect" alt="grid01" /><figcaption class="noimage2">NO IMAGE</figcaption></a>
</div>
<figcaption>Take A Peek</figcaption>
</li>
</ul>
<div class="time">
<time datetime="<%topentry_year>-<%topentry_month>-<%topentry_day>" pubdate>
<span class="month<%topentry_month>"></span><br><%topentry_day></time>
</div>
<!--/body_img_none-->
画像のアドレスをお好きな画像に変更してください。 htmlの下の方にsearchareaもありますので、その画像のアドレスも同じく変更してください。 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>
記事の下の紹介文は、お好きな文章を入れてください。
<nav class="bottomnav">
<ul>
<li class="instagram"><a href="https://www.instagram.com/#/?hl=ja?ref=badge" title="instagramでシェア" target="_blank"><i class="fa fa-instagram" aria-hidden="true"></i> <span>share</span></a></li><!--
--><li class="twitter"><a href="http://twitter.com/share?url=<%topentry_link>&text=<%topentry_title>" title="twitterでつぶやく" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i> <span>tweet</span></a></li><!--
--><li class="facebook"><a href="http://www.facebook.com/sharer.php?u=<%topentry_link>&t=<%topentry_title>" title="facebookでシェア" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i> <span>share</span></a></li><!--
--><li class="pinterest"><a href="//www.pinterest.com/pin/create/button/?url=<%topentry_link>&amp;media=<%topentry_image_url>&amp;description=<%topentry_enc_title>" title="Pin it on Pinterest" target="_blank"><i class="fa fa-pinterest-p" aria-hidden="true"></i> <span>pin it</span></a></li>
</ul>
</nav>
その下のソーシャルサイトへのナビはインスタグラムだけ、#の部分にご自分のIDを入れてください。

Comments

トップへ戻る