QuangVietMkt - Blog Chia sẻ thủ thuật Online

Tạo nút button menu bên phải blogspot



Hôm nay mình giới thiệu các bạn một tiên ích khá đẹp mắt cho Blogspot! Tiện ích giúp người đọc dễ dàng di chuyển đến các mục mà không cần phải sử dụng quá nhiều thao tác

Chọn Mở Rộng Tiệng ích trong Blogspot
Tìm :  ]]></b:skin>
Thêm Bên Trên nó đoạn code css sau:

#float-menu{position:fixed;bottom:20%;right:0;border-top:1px solid #CCC;border-left:1px solid #CCC;border-bottom:1px solid #CCC;background:#EEE}
#float-menu ul{padding:0}
#float-menu li{margin:5px;list-style-type:none}
#float-menu li,#float-menu li a{width:24px;height:24px}
#float-menu li a{float:left}
#float-menu #menu-right,#float-menu #menu-left,#float-menu li a{background:url(http://lh4.ggpht.com/-QJvRLdTVhKQ/TsEH7FVGtLI/AAAAAAAAAjI/fEDVTJ2FXEo/float-menu.png)}
#float-menu #menu-right a{background-position:0 -120px}
#float-menu #menu-right a:hover,#float-menu #menu-right{background-position:-24px -120px}
#float-menu #menu-left a{background-position:0 -24px}
#float-menu #menu-left a:hover,#float-menu #menu-left{background-position:-24px -24px}
#float-menu #menu-random a{background-position:0 -48px}
#float-menu #menu-random a:hover{background-position:-24px -48px}
#float-menu #menu-home a{background-position:0 -72px}
#float-menu #menu-home a:hover{background-position:-24px -72px}
#float-menu #menu-top a{background-position:0 -96px}
#float-menu #menu-top a:hover{background-position:-24px -96px}

Tìm <b:includable id='main' var='top'>

Thêm Vào Bên Dưới Đoạn Code sau đây



<div id='float-menu'>
 <ul>
  <li id='menu-right'>
   <b:if cond='data:olderPageUrl'>
    <b:if cond='data:olderPageUrl != data:blog.url'>
     <a expr:href='data:olderPageUrl' expr:title='data:olderPageTitle' rel='prev'/>
    </b:if>
   </b:if>
  </li>
  <li id='menu-left'>
   <b:if cond='data:newerPageUrl'>
    <b:if cond='data:newerPageUrl != data:blog.url'>
     <a expr:href='data:newerPageUrl' expr:title='data:newerPageTitle' rel='next'/>
    </b:if>
   </b:if>
  </li>
  <li id='menu-random'>
   <script type='text/javaScript'>//<![CDATA[
   var rdp_current=0;total_posts=0;function totalposts(json){total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){rdp_current=1+Math.round(Math.random()*(total_posts-1))};
   //]]></script>
   <script type='text/javaScript'>//<![CDATA[
   function rdp(json){var dw='';entry=json.feed.entry[0];for(var i=0;i<entry.link.length;i++){if(entry.link[i].rel=='alternate'){rdp_posturl=entry.link[i].href}};dw+='<a href="'+rdp_posturl+'"  title="Bài đăng Ngẫu nhiên" rel="nofollow"></a>';document.getElementById('menu-random').innerHTML=dw;};getvalue();document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current+'&max-results=1&callback=rdp\"><\/script>');
   //]]></script>
  </li>
  <li id='menu-home'>
   <a expr:href='data:blog.homepageUrl' title='Trang chủ'/>
  </li>
  <li id='menu-top'>
   <a href='#' rel='nofollow' title='Lên trên'/>
  </li>
 </ul>
</div>

Lưu lại và xem kết quả

Chúc các bạn vui vẻ

Bài viết liên quan

0 nhận xét | Viết lời bình

Back To Top