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

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 !

Bài viết liên quan

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

Bạn ơi mình hỏi chút! Mình cài rồi nhưng làm sao để hiển thị lên slideshow và các label?

Back To Top