Thứ Sáu, 24 tháng 5, 2013

Giao diện đẹp thích hợp làm trang tin tức

Giao diện này rất nổi bật và nhiều tiện ích hay! Main body được xen lẫn hàng ngang và cột nên rất tiện lợi cho các bạn bày trí đẹp mắt






Hình ảnh bố cục giao diện





Hướng dẫn cài đặt

1. Sider: Các bạn tìm đến code
<div id='featuredContent'> <div id='slideshow'> <div id='slideshowThumbs'> <ul><script> document.write(" <script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>"); </script> </ul> </div> <div class='post' id='slideshowContent'> <script> document.write(" <script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>"); </script></div> </div> <script type='text/javascript'> $(function() { $("#slideshowThumbs ul").tabs("#slideshowContent > div", { effect: 'fade', fadeOutSpeed: 1000, rotate: true }).slideshow({ clickable: true, autoplay: true, interval: 3000 }); }); </script> <div class='clear'> </div> </div>

2. Tiện ích bài viết theo nhãn





3.Tìm đến code
Title1="DIARY";Title2="JAZZ";Title3="HEALTH";Title4="SPORT";Title5="COMEDY"

Chỉnh sửa lại tên cho phù hợp với Blog của bạn


4.Tiếp đến các bạn tìm code: 
<div class='tabber' id='tab1'> <script> document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/sport?max-results=&quot;+numposts9+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts9\&quot;&gt;&lt;\/script&gt;&quot;); </script></div> <div class='tabber' id='tab2'> <script> document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/lifestyle?max-results=&quot;+numposts9+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts9\&quot;&gt;&lt;\/script&gt;&quot;); </script></div> <div class='tabber' id='tab3'> <script> document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/economics?max-results=&quot;+numposts9+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts9\&quot;&gt;&lt;\/script&gt;&quot;); </script></div> <div class='tabber' id='tab4'> <script> document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/diary?max-results=&quot;+numposts9+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts9\&quot;&gt;&lt;\/script&gt;&quot;); </script></div> <div class='tabber' id='tab5'> <script> document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/health?max-results=&quot;+numposts9+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts9\&quot;&gt;&lt;\/script&gt;&quot;); </script></div> <div class='clear'> </div>

Chỉnh các label màu đỏ phù hợp

Có gì thắc mắc để lại comment ở dưới nhé!


Chúc các bạn thành công !

Không có nhận xét nào:

Đăng nhận xét