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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT1Er4ehdB4uc9VVHDk7AwCyuTmYI1dCFxaiePeyf4_jro772N16jmALBFXG2iJxoUEYCQADeOlyf27g8ttYqsZJ1YxYLTWjcCUZzVQtcuvPyslFWmQKhOzqFGclm0I7pUJtETr-dX268/)}
#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ẻ
0 nhận xét to "Tạo nút button menu bên phải blogspot"