ネットワーク構築 パソコン設定 サーバ構築 無線LAN構築 名古屋市 豊田市

ホリテック ブログ 最新投稿

レスポンシブ対応のナビメニューを導入!!・・・・・しているところ・・

う~~ん、ナビメニューが今いちまだうまくできない・・・・・・

 

Animenuってやつで、ドロップダウンに対応した、ナビメニューを新しいデザインに導入しようとしているのですが、まだ、うまく行かない・・・・・

 

一個一個問題を解決しては、また立ち止まる・・・・ま~スキルの問題なので、そんなにすぐにできるわけではないかもしれないけど、まだまだ知らないことがたくさんあって、いろいろ「へ~~~」って思って感心するところもあって、結構楽しんでいるところもあります。

 

ただ、自分で、MTのウェブページの更新情報を表示するを一から作ろうって思ったのが、ちっともうまくいかず、だんだん嫌になってきていたのですが、昨日やっと・・・・(これがやっとってことで自分のスキルが、まだまだまったくダメなのを再確認もしましたが・・・・)

 

MTの場合、

<MTPages lastn="5″ sort_by="modified_on">

これで、MTのウェブページの更新情報を表示してくれます。これを、スクロールバーを付けたBOX表示するっていうのを自分で作ってみよっておもったののが以外を時間がかかりました。

 

結論からいうと、dlでやって、overflow:autoをうまく使えばできるっていうことでした。なんか素人くさい言い方ですが、なんかそうっか~って思うのですが、考えた人すごいな~と妙に感心しました。このことに気が付いたというか、もろにやり方が書いてあったのが、ここ

http://rensabanet.com/blog/hp/12113/

記事を書いてくださったかたありがとうございました<(_ _)>

 

それで、できあがったものがこれ!

<MTPages lastn="5″ sort_by="modified_on">
 <mt:EntriesHeader>
  <section id="update">
    <h3>更新情報</h3>
      <dl>
        </mt:EntriesHeader>
          <dt><time datetime="<$mt:EntryDate format_name="iso8601″$>"><$mt:EntryDate format="%x"$ language="ja"></time></dt>
          <dd><a href="<$MTPagePermalink$>" title="<$MTEntryTitle$>"><$MTPageTitle$></a>を更新しました</dd>
         <mt:EntriesFooter>
      </dl>
        <nav>
          <a href="<mt:BlogRelativeURL>sitemap.html">Webページ一覧へ</a>
        </nav>
   </section>
 </mt:EntriesFooter>
</MTPages>

これを、テンプレートモジュールに、「ウェブページ更新」って名前で登録して、メインページに、<$mt:Include module="ウェブページ更新"$>を入れてやれば、更新情報が、表示されました。

 

CSSは、上記のサイトを基にして、自分のCSSに合わせて作りました。

こんな感じです。

#update {
 margin:0;
  padding:0;
  border:4px groove #fff;
}

#update h3{
 margin: 0;
}
#update dl.box{
  margin:0 10px 10px 10px;
  padding:5px 10px 2px 5px;
  height: 120px;
  font-size:90%;
  overflow: auto;
  border-top:1px groove #fff;
  border-bottom:1px groove #fff;
}

#update dl.box dt{
  float:left;
  width:120px;
  padding-left:5px;
  }
#update dl.box dd{
  margin:0 0 10px 0;
  padding: 0 0 10px 20px;
  border-bottom:1px dotted #aaa;
}

 

MTOS,ホームページ