LittleDream

vintage and romantic images

HOME / mysticな風景

mysticな風景

FC2テンプレート
このブログをはじめたときは、なんかＭｙｓｔｉｃ（神秘的）なものについて 書こうとはじめたんだけど、いつのまにか、テンプレート作成のブログに 変容してしまった。 今回はごくごくシンプルにタイトル周りだけちょっと工夫して、 スライダーをつけてお好きな画像で飾れるようにしてみました。 カスタマイズ方法については追記で書きますね。 １．上部ナビゲーションの編集 
<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>
これはいつもとおんなじ。＃のところにリンクをいれて、好きなタイトルに変更するだけです。 ２．スライダーの編集 
<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>
今回はレスポンシブスライドというプラグインを使ってます。 画像のアドレスをお好きな画像に変更してください。写真の大きさは揃えた方がうまくいきます。 ｈｅａｄ内にプラグインの設定が書いてあります。細かく設定されたい方は ここで変更してください。 ３．記事下の著作者の紹介文 
<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>
これはお好きな文章を入れてください。 今日付けで共有申請したので、またダウンロードできるようになるのに何週間かかかると思います。 よろしくお願いします。
Total
0
Shares
Share 0
Tweet 0
Pin it 0
Share 0
Share 0

mysticな風景

You may also like

AD

Reader Interactions

コメント

  1. Janedoe1471 says

    SECRET: 0
    PASS: 74be16979710d4c4e7c6647856088456
    どうもはじめまして。
    素敵なテンプレートを製作されていて、いつもうっとりしています。
    余計なことですが、ちょっと気がついたことがありまして、ご報告まで。
    私は、Yahoo移行者さんの動向を追いかけておりまして、その関係で、たまたま見かけたのですが、mystylookだったと思いますが、とあるYahoo移行者さんが利用されているのですが、youtube動画のiframeが、記事幅からはみ出してしまっていました。
    私自身は、まだまだ駆け出しで、もちろん素人でして、いろいろと勉強中です。
    それでは、特にそれだけですので、ちょっとお耳に入れようと思った次第です。

  2. 管理人 says

    SECRET: 0
    PASS: 0e39c6a10a7f47650b31c72bc7b5c020
    こんにちは。はじめまして。ブログをご覧いただきありがとうございます。
    ところで、ご指摘のiframeが記事幅からはみ出す件ですが、
    管理人のテンプレートはあまりユーザーさんには親切な作りになっていない
    のもありまして、一応スマホで見る際には、幅が１００％になるようには
    最低限のＣＳＳで設定しているんですけど、パソコンで見るときの場合は
    設定していないです。
    その辺はユーザーさんが自由にカスタマイズしてくださいとのスタンスで
    やってるんですけど、yahooブログから移行した場合にはみ出るのか
    どうかはよくわからないです。
    今後、ユーザーさんから設定の方法を聞かれたりした場合は
    回答しようかなと思ってます。
    取り急ぎいまの段階ではこんな対応です。
    これからもよろしくお願いします。

  3. mooo says

    こんにちは、初めまして。
    どのテンプレートも本当に素敵ですね☆
    現在、mystylookを使わせて頂いているのですが、
    タブレットやスマートフォンで表示した場合、2カラムではなく1カラムでの表示になってしまうようです
    もしなにか対策がありましたら、お教え頂ければ幸いです。お手すきの際で結構です！

    • ばおりん says

      moooさんこんにちは。

      テンプレート使っていただきありがとうございます。

      mystylookですが、スマートフォンやタブレットで見るときは、
      １カラムになるように設定してあります。
      レスポンシブデザインというやつです。

      もしPC表示のままで閲覧したければ、CSSの編集画面で
      レスポンシブの設定を消去するか、コメントアウトしてください。

      /************************************************************************************
      smaller than 980
      *************************************************************************************/
      @media screen and (max-width:980px) {～
      以下CSS設定

      以上の表記から下を消去するか、
      /* 内容　 */　　
      コメントアウトの表記を使ってデザインに影響しないようにします。

      よろしくお願いいたします。

Leave a Reply

Total
0
Share
0
0
0
0
0