Menu ngang co kèm hình ảnh bên cạnh rất đẹp

Chào các bạn !
Bài viết hôm nay xin giới thiệu cùng các bạn cách tạo menu ngang có kèm theo hình ảnh rất đẹp với hiệu tạo bóng khi click chuột vào. Hiệu ứng này thích ứng với tất cả cá trình duyệt internet hiện nay. Tiện ích sử dụng CSS và HTML rất dễ dàng thêm vào blog của bạn.

Đọc thêm »

Ẩn tiện ích tại trang chủ hoặc trang riêng biệt

Muốn ẩn một tiện ích hoặc một thành phần nào đó thì ta phải xác định được id hoặc class của nó. Các id thông thường trong blogspot như là: HTML1, HTML2, HTML3, …, Label1, Label2, Label3, …, BlogList1, Followers1, Blog1, BlogArchive1, Profile1, header-wrapper, sidebar, main-wrapper, footer-wrapper, comments, comments-block, … Các id khi đưa vào CSS có dấu # ở phía trước, ví dụ: #HTML1.

• Nếu muốn ẩn tiện ích có id là HTML1 ở trang chủ thì đặt đoạn code sau vào sau dòng ]]></b:skin> trong Template. 

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn nhiều tiện ích ở trang chủ, ví dụ các tiện ích có id lần lượt là HTML1, Label1, Followers1 thì sử dụng đoạn code sau. 

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<style type='text/css'>

#HTML1, #Label1, #Followers1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn tiện ích có id là HTML1 ở các trang bài viết thì sử dụng đoạn code sau. 

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn tiện ích có id là HTML1 ở các trang chính gồm trang chủ, trang nhãn, trang lưu trữ thì sử dụng đoạn code sau. 

<b:if cond='data:blog.pageType == &quot;index&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn tiện ích có id là HTML1 ở các trang lưu trữ thì sử dụng đoạn code sau. 

<b:if cond='data:blog.pageType == &quot;archive&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn tiện ích có id là HTML1 ở các trang tĩnh thì sử dụng đoạn code sau. 

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Nếu muốn ẩn tiện ích có id là HTML1 ở một trang riêng biệt nào đó thì sử dụng đoạn code sau. 

<b:if cond='data:blog.url == &quot;URL của trang riêng biệt&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Trong trường hợp muốn ẩn tiện ích có id là HTML1 ở trang chủ, các trang nhãn, các trang lưu trữ mà không ẩn ở các trang bài viết thì sử dụng đoạn code sau. 

<b:if cond='data:blog.pageType != &quot;item&quot;'>

<style type='text/css'>

#HTML1 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Như vậy: Nếu muốn ẩn được 3 Widget ở các trang bài viết mà không còn xuất hiện các dòng ngăn cách giữa các Widget nữa ta chèn đoạn code sau dòng ]]></b:skin> trong Template: 

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style type='text/css'>

#HTML1, #HTML6, #HTML8 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Các bạn muốn chỉ xuất hiện các Widget có id là HTML1, HTML6, HTML8... ở trang chủ thì sử dụng đoạn code sau: 

<b:if cond='data:blog.url != data:blog.homepageUrl'>

<style type='text/css'>

#HTML1, #HTML6, #HTML8 {display:none !important;visibility:hidden !important}

</style>

</b:if>

• Ta thấy chỉ cần thay dấu ( == ) thành ( != ) thì tác dụng sẽ ngược lại.

VD:Muốn ẩn tiện ích có id là HTML1 ở trang chủ thì đặt đoạn code sau đây vào sau dòng ]]></b:skin> trong Template.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
#HTML1 {display:none !important;visibility:hidden !important}
</style>

</b:if>


Nếu thay ( == ) thành ( != ) thì kết quả sẽ là chỉ Hiện các tiện ích có Id là HTML1,....ở trang chủ.

Tiện ích “Bài viết liên quan” cho Blogger

Một phương pháp tương đối dễ dàng để tăng số lượng Page Views trên blog của bạn là thêm một danh sách các bài liên quan bên dưới mỗi bài viết. Điều này cung cấp cho độc giả nhiều thông tin liên quan hơn đến chủ đề mà họ đang theo dõi.

Đây là một tiện ích được sử dụng rất phổ biến, và nó cũng có rất nhiều “biến thể”. Hôm nay iTechPlus sẽ giới thiệu đến các bạn một số style được sử dụng phổ biến nhất trên các trang Web/Blog trong cũng như ngoài nước, nhằm cung cấp cho các bạn có nhiều lựa chọn hơn trong việc áp dụng vào Blog của mình.


A. Style 1 : Related Posts Widget for Blogger v1 ( BloggerPlugins )

1. Vào Thiết kế > Chỉnh sửa HTML > Tick chọn Mở rộng mẫu tiện ích

2. Chèn đoạn code bên dưới vào phía trên thẻ đóng </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <style type="text/css"> #related-posts { float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px; } #related-posts .widget{ padding-left:6px; margin-bottom:10px; } #related-posts .widget h2, #related-posts h2{ font-size: 1.6em; font-weight: bold; color: black; font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ color:blue; } #related-posts a:hover{ color:blue;  } #related-posts ul{ list-style-type:none; margin:0 0 0px 0; padding:0px; text-decoration:bold; font-size:15px; text-color:#000000 } #related-posts ul li{ background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigxpuE-q7HDGtTFDr_R0FCLYZVbVBtYaTzyaPRZFtnb1Xv3k5-Lfy7l_CotOt6YzRF5Oqnm9fkX26xgC_fxO9scYfLU7tuxdce-QjbqhkKz3Spkt2HjqYtptBBEKvdLkt5r97lEaQYscE/s200/greentickbullet.png) no-repeat ; display:block; list-style-type:none; margin-bottom: 13px; padding-left: 30px; padding-top:0px;} </style> <script type='text/javascript'> var relatedpoststitle="Related Posts"; </script> <script src='hhttps://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje8LBD9Zg6X2DuCa2YqrT_lSZgaqqsi-cS66E6l9I3QUGeiLpRXgGSkwJV0mCiXRh2UETRNuehc6GQDEqCj7J5CA5rGgfmpA_e8VqypFya3kxcJeC5tpBd2DNqrr4kyRS0cNR6GhTOyYj9/s500/cooltext987481804.png' type='text/javascript'/> </b:if>

Lưu ý: bạn nên download File Js về TẠI ĐÂY và upload lên host riêng

3. Tìm trong Template của bạn đoạn code tương tự như bên dưới :

<div class='post-footer-line post-footer-line-1'>

hoặc<p class='post-footer-line post-footer-line-1'>

và ngay lập tức bên dưới nó chèn đoạn code sau :

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/></b:if></b:loop><a href='http://namkna.blogspot.com/2011/07/tien-ich-bai-viet-lien-quan-cho-blogger.html'><img style="border: 0" alt="Related Posts Widget for Blogger" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a> <script type='text/javascript'>  var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script> </div> </b:if>

với var maxresults=5; là số bài viết sẽ hiển thị trong widget ( mặc định là 5 )


B. Style 2 : Related Posts Widget for Blogger with Thumbnails ( BloggerPlugins )

Nhìn vào đây nhiều bạn bảo mình đã giới thiệu rồi, nhưng nếu các bạn để ý kỹ bài mình giới thiệu lần trước Code khác với lần này.

1. Vào Thiết kế > Chỉnh sửa HTML > Tick chọn Mở rộng mẫu tiện ích


2. Chèn đoạn code bên dưới vào phía trên thẻ đóng </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <style type="text/css"> #related-posts { float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px; } #related-posts h2{ font-size: 1.6em; font-weight: bold; color: black; font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ color:black; } #related-posts a:hover{ color:black; } #related-posts a:hover { background-color:#d4eaf2; } </style> <script type='text/javascript'> var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjtrFXXFezAJ9LT3enEv7AVIU9ONvtmJlbDqVZYBcKmE8TDYssKwicU6UfQnT565-i0cpssBrN6MqAJd4YjZ0_rZouiUr_vUIyXfd7YOB-zxgddwOaLb09TxS4vbN9Fkl1krUejaklVTY/s400/noimage.png"; var maxresults=5; var splittercolor="#d4eaf2"; var relatedpoststitle="Related Posts"; </script> <script src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEje8LBD9Zg6X2DuCa2YqrT_lSZgaqqsi-cS66E6l9I3QUGeiLpRXgGSkwJV0mCiXRh2UETRNuehc6GQDEqCj7J5CA5rGgfmpA_e8VqypFya3kxcJeC5tpBd2DNqrr4kyRS0cNR6GhTOyYj9/s500/cooltext987481804.png' type='text/javascript'/> </b:if>

3. Tìm trong Template của bạn đoạn code tương tự như bên dưới :

<div class='post-footer-line post-footer-line-1'>

hoặc<p class='post-footer-line post-footer-line-1'>

và ngay lập tức bên dưới nó chèn đoạn code sau :

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop> <script type='text/javascript'> removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;); </script> </div><div style='clear:both'/> </b:if> <b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'> <a href='http://namkna.blogspot.com/2011/07/tien-ich-bai-viet-lien-quan-cho-blogger.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://namkna.blogspot.com/' ><img style="border: 0" alt="Kiến thức – Thủ thuật – Giải pháp công nghệ" src="http://image.bloggerplugins.org/blogger-templates.png" /></a> </b:if></b:if>

lưu ý: Các bạn nên Download file JS về máy TẠI ĐÂY sau đó UPload lên Host riêng

4. Thay thế code màu đỏ theo ý bạn

5. Save Template.

C. Style 3 : Related Posts by Categories ( Jackbook )

1. Vào Thiết kế > Chỉnh sửa HTML > Tick chọn Mở rộng mẫu tiện ích

2. Tìm trong Template của bạn đoạn code sau :

<data:post.body/>

hoặc<p><data:post.body/></p>

và ngay sau nó chèn đoạn code bên dưới :

<b:if cond='data:blog.pageType == "item"'> <div class='similiar'> <div class='widget-content'> <h3>Related Posts by Categories</h3> <div id='data2007'/><br/><br/> <script type='text/javascript'> var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;; var maxNumberOfPostsPerLabel = 4; var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 10; maxNumberOfLabels = 3; function listEntries10(json) { var ul = document.createElement(&#39;ul&#39;); var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i &lt; maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k &lt; entry.link.length; k++) { if (entry.link[k].rel == &#39;alternate&#39;) { alturl = entry.link[k].href; break; } } var li = document.createElement(&#39;li&#39;); var a = document.createElement(&#39;a&#39;); a.href = alturl; if(a.href!=location.href) { var txt = document.createTextNode(entry.title.$t); a.appendChild(txt); li.appendChild(a); ul.appendChild(li); } } for (var l = 0; l &lt; json.feed.link.length; l++) { if (json.feed.link[l].rel == &#39;alternate&#39;) { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;); var txt = document.createTextNode(label); var h = document.createElement(&#39;b&#39;); h.appendChild(txt); var div1 = document.createElement(&#39;div&#39;); div1.appendChild(h); div1.appendChild(ul); document.getElementById(&#39;data2007&#39;).appendChild(div1); } } } function search10(query, label) { var script = document.createElement(&#39;script&#39;); script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39; + label + &#39;?alt=json-in-script&amp;callback=listEntries10&#39;); script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;); document.documentElement.firstChild.appendChild(script); } var labelArray = new Array(); var numLabel = 0; <b:loop values='data:posts' var='post'> <b:loop values='data:post.labels' var='label'> textLabel = &quot;<data:label.name/>&quot;; var test = 0; for (var i = 0; i &lt; labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel &lt; maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </script> </div> </div> </b:if>

3. Thay đổi code màu đỏ theo ý bạn, trong đó :

maxNumberOfPostsPerLabel : số bài viết tối đa được hiển thị theo mỗi Label
maxNumberOfLabels : số Label được hiển thị

D. Style 4 : Related Posts v2.0 by Anhvo

1. Vào Thiết kế > Chỉnh sửa HTML > Tick chọn Mở rộng mẫu tiện ích

2. Tìm trong Template đoạn code tương tự như sau :

<div class='post-footer-line post-footer-line-3'/>

hoặc<div class='post-footer-line post-footer-line-2'/>

hoặc<div class='post-footer-line post-footer-line-1'/>
và chèn bên dưới nó đoạn code này :

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='post-labels-for-related' style='display:none'><b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop></b:if></div> <div id='post-timestamp-for-related' style='display:none'><data:post.timestampISO8601/></div> <style type='text/css'> #related-posts-block { margin:10px 5px 0 -20px; font-size:12px; color:#999999; text-transform:none; } #related-posts-block #related-posts-loading-text{ font-size:18px; color:#FF0033; text-align:center; } #related-posts-block #related-newest-href { margin:10px 5px; } #related-posts-block #related-newest-href ul{ list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMIEoD1DcDzXxDfwctFZkwL0y2I4v5aFEKIVXjB5KbWPmaaXG7ANSZ2D4L_e-i71nSv_vBIuQ5IonA27WYRMfVv19Qi3sLubmqK0Cv9RMDUl_QNzy7BKhKJC3ZWqXIRiOqk6LOJJpe_as/); } #related-posts-block #related-newest-href #related-newest-title { font-size:16px; margin:10px 5px } #related-posts-block #related-newest-href a{ font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#000000; } #related-posts-block #related-older-href { margin:10px 5px; } #related-posts-block #related-older-href ul{ list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMIEoD1DcDzXxDfwctFZkwL0y2I4v5aFEKIVXjB5KbWPmaaXG7ANSZ2D4L_e-i71nSv_vBIuQ5IonA27WYRMfVv19Qi3sLubmqK0Cv9RMDUl_QNzy7BKhKJC3ZWqXIRiOqk6LOJJpe_as/); } #related-posts-block #related-older-href #related-older-title { font-size:16px; margin:10px 5px } #related-posts-block #related-older-href a{ font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#000000; } </style> <div id='related-posts-block'> <div id='related-posts-loading-text'>Loading related posts... <img align='absmiddle' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjT4q8hXkdc_Mlu83r4vCoYMAMfm_EzVzeakrWDLIsUxOlOd7fFZSBg9ThW9tyzgEYWyBQ3tRUgA5bP8PjMXoepWUcdCqmqDcAVtTuIMg58ycbsQlH6WrH3UBQeU4xPje2K5k3XahmPZNs/'/></div> <div id='related-newest-href'><div id='related-newest-title'/></div> <div id='related-older-href'><div id='related-older-title'/></div> </div> </b:if>

3. Chèn đoạn code bên dưới lên trước thẻ đóng </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <script type='text/javascript'> //<![CDATA[ var showdate = false; var max_post = 12; //]]> </script> <script type='text/javascript'> //<![CDATA[ // Related posts script for Blogger // version 2.0 // (C) Anhvo // Homepage: vietwebguide.com // Please dont remove this copyright when using or redistributing this code function format(ptime){ return ptime.substr(0,19); } function formatdate(d){ var month = [1,2,3,4,5,6,7,8,9,10,11,12]; var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; var m = parseInt(d.substring(5,7),10); for(var j=0; j<month.length;j++){ if(m==month[j]){ m = month2[j]; break; } } return d.substring(8,10) + "-" + m + "-" + d.substring(0,4); } function getRelatedNewestLinks(json){ var entry = json.feed.entry; if(entry){ for(var k=0;k<entry.length;k++){ var li = document.createElement("li"); if(showdate){ li.innerHTML = "<a  href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>" + ' - <i>' + formatdate(entry[k].published.$t) +'</i>'; } else { li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>"; } if(!checkRelaxLinks("related-newest-href",entry[k].link[4].href)){ document.getElementById("related-newest-href-ul1").appendChild(li);                   document.getElementById("related-newest-title").innerHTML = "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrTSSjHcWDiG5CrUP9EhoXTmWqgX0bvQkd6KMT5EBPXW4h09wYnJEfZNV_LRRqiN39YVxoQNA_S-dN33md2YQSfoj2FK7bFGelqms6RViaLj5AzjPHG92d45EKo5uX3eBpDZklJoa2hmk/' width='347' height='21'>" } } } else { document.getElementById("related-older-title").innerHTML = "Không có bài nào mới hơn cùng chủ đề"; } } function getRelatedOlderLinks(json){ var entry = json.feed.entry; if(entry){ for(var k=0;k<entry.length;k++){ var li = document.createElement("li"); if(showdate){ li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>" + ' - <i>' + formatdate(entry[k].published.$t) + '</i>'; } else { li.innerHTML = "<a href='"+entry[k].link[4].href+"'>"+entry[k].title.$t+"</a>"; } if(!checkRelaxLinks("related-older-href",entry[k].link[4].href)){ document.getElementById("related-older-href-ul2").appendChild(li); document.getElementById("related-older-title").innerHTML = "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvWl2Hyqrv_13rXCJ-1GJflP6tfVAYZLUBGNYHANMyF1mAPbF9Gae4QFwujyP2vn7rnnPoujVefR9zEoPwVsCqVFg-HTkbR6ClDIDR4Ka6cC9HLUeS_BY3MM0oX9T6f0XnzYuSxTUlu4Q/' width='347' height='21'>" } } } else { document.getElementById("related-older-title").innerHTML = "Không có bài nào cũ hơn cùng chủ đề"; } document.getElementById("related-posts-loading-text").style.display = "none"; } function createRelatedJson(min_or_max,cRJ_label,fcn_callback,cRJ_max){ var script = document.createElement("script"); script.src = "/feeds/posts/summary/-/"+escape(cRJ_label)+"?orderby=published&max-results="+cRJ_max+"&published-"+min_or_max+"="+escape(format(document.getElementById("post-timestamp-for-related").innerHTML))+"&alt=json-in-script&callback="+fcn_callback; script.type = "text/javascript"; document.getElementsByTagName("head")[0].appendChild(script); } function checkRelaxLinks(cid,clink){ var check = false; var u = document.getElementById(cid); var a = u.getElementsByTagName("a"); for(var i=0;i<a.length;i++){ if(a[i].href==clink){ check = true; break; } } var url = location.href.split(".html")[0]+".html"; if(clink==url) check = true; return check; } function createRP(){ var postLabel = document.getElementById("post-labels-for-related").innerHTML.split(','); var max_ = Math.round(max_post/postLabel.length); var ul1 = document.createElement('ul'); ul1.id = 'related-newest-href-ul1'; document.getElementById('related-newest-href').appendChild(ul1); for(var i=0; i<postLabel.length;i++){ createRelatedJson("min",postLabel[i],"getRelatedNewestLinks",max_); } var ul2 = document.createElement('ul'); ul2.id = 'related-older-href-ul2'; document.getElementById('related-older-href').appendChild(ul2); for(var j=0; j<postLabel.length;j++){ createRelatedJson("max",postLabel[j],"getRelatedOlderLinks",max_); }  } createRP(); //]]> </script> </b:if>

Trong đoạn code trên : var showdate = false; : nếu muốn hiện thị ngày đăng thì thay false thành true 
var max_post = 12; : số bài viết tối đa hiển thị là 12 bài. 

* Update : giới thiệu đến các bạn một style khác do Fandung bên phandung.blogspot.com phát triển với hiệu ứng hiển thị mô tả khi rê chuột.

Lưu ý: Các bạn nên download các file ảnh về TẠI ĐÂY và upload lên host riêng của bạn
E. Style 5 : Related Posts with Description Effect

1. Vào Thiết kế > Chỉnh sửa HTML > Tick chọn Mở rộng mẫu tiện ích

2. Chèn đoạn code bên dưới vào trước thẻ đóng </head>

<style type='text/css'> .mota-desc{ position: relative; z-index: 0; text-decoration:none; } .mota-desc:hover{ background-color: transparent; z-index: 50; } .mota-desc span{ position: absolute; background-color: #ffffff; padding: 5px; left: -1000px; border: 1px solid #666; visibility: hidden; color: black; text-decoration: none; } .mota-desc span img{ border-width: 0; padding: 2px; } .mota-desc:hover span{ padding:5px; visibility: visible; top: 20px; left:70px; width:250px; background:#ddd; text-align: justify; } #related-posts { padding-top:40px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } </style> <script language='JavaScript'> imgr = new Array(); imgr[0] = &quot;http://farm4.static.flickr.com/3635/3638008086_87c5d93e22_o.gif&quot;; showRandomImg = true; imgwidth = 60; imgheight = 60; fntsize = 12; acolor = &quot;#555&quot;; aBold = true; motacolor = &quot;#f00&quot;; text = &quot;Nhận xét&quot;; showPostDate = true; summaryPost = 150; summaryFontsize = 12; summaryColor = &quot;#000&quot;; icon2 = &quot; &#187; &quot;; numposts = 5; home_page = &quot;http://viettin24h.com/&quot;; </script> <script type='text/javascript'> //<![CDATA[ function removeHtmlTag(strx,chop){ var s = strx.split("<"); for(var i=0;i<s.length;i++){ if(s[i].indexOf(">")!=-1){ s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); } } s = s.join(""); s = s.substring(0,chop-1); return s; } function showrelatedposts(json) { j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0; img = new Array(); for (var i = 0; i < numposts; i++) { var entry = json.feed.entry[i]; var posttitle = entry.title.$t; var pcm; var posturl; if (i == json.feed.entry.length) break; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { posturl = entry.link[k].href; break; } } for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') { pcm = entry.link[k].title.split(" ")[0]; break; } } if ("content" in entry) { var postcontent = entry.content.$t;} else if ("summary" in entry) { var postcontent = entry.summary.$t;} else var postcontent = ""; postdate = entry.published.$t; if(j>imgr.length-1) j=0; img[i] = imgr[j]; s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5); if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d; cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : ''; var month = [1,2,3,4,5,6,7,8,9,10,11,12]; var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]; var day = postdate.split("-")[2].substring(0,2); var m = postdate.split("-")[1]; var y = postdate.split("-")[0]; for(var u2=0;u2<month.length;u2++){ if(parseInt(m)==month[u2]) { m = month2[u2] ; break; } } var daystr = (showPostDate) ? '<i><font color="'+acolor+'"> - ('+day+ ' ' + m + ' ' + y + ')</font></i>' : ""; posttitle = (aBold) ? "<b>"+posttitle+"</b>" : posttitle; var trtd = '<img src="http://farm3.static.flickr.com/2426/3638176588_31366a6822_o.gif"/> <a class="mota-desc" href="'+posturl+'" style="color:'+acolor+'; font-size:'+fntsize+'px;">'+posttitle+'<span><div style="color:'+motacolor+';">'+posttitle+' </div>'+cmtext+ ' ' + daystr + ' <br/><img src="'+img[i]+'" style="float:left; border: #ccc 1px solid; padding:2px; margin-right:4px;" width="'+imgwidth+'" height="'+imgheight+'"/>'+icon2+removeHtmlTag(postcontent,summaryPost)+'...</span></a> <br/>'; document.write(trtd); j++; } } //]]> </script>

Trong đoạn code trên :

imgwidth = 60; , imgheight = 60; : kích thước ảnh thumbnail sẽ hiển thị trong phần mô tả
fntsize = 12; : size chữ của tiêu đề bài viết
acolor = "#555"; : màu của tiêu đề bài viết
motacolor = "#f00"; : màu của tiêu đề bài viết trong phần mô tả
summaryPost = 150; : số kí tự hiển thị trong phần mô tả bài viết
summaryFontsize = 12; : size chữ của phần mô tả
summaryColor = "#000"; : màu chữ của phần mô tả
numposts = 5; : số bài viết sẽ hiển thị trong list các bài liên quan của mỗi nhãn. Chú ý: giá trị này phải chỉnh bằng với giá trị max-results=5 ở bước 3.
home_page = "http://www.viettin24h.com/"; : thay bằng địa chỉ URL của blog bạn

3. Tìm trong template dòng code sau :<data:post.body/>

và ngay sau nó chèn đoạn code bên dưới :

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <font face='Arial' size='3'><b>Bài viết liên quan : </b></font><br/> <b:loop values='data:post.labels' var='label'><b>Nhãn : </b><font color='#FF0000'><data:label.name/></font><br/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?max-results=5&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrelatedposts&quot;' type='text/javascript'/> </b:if> </b:loop> </div> </b:if>

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

Số bác Bình đen?!

>> Mỹ ủng hộ Việt Nam về Hoàng Sa? (Hic, vậy ai ủng hộ TQ đánh chiếm Hoàng Sa của VN?)

>> Mỹ chuẩn bị kế hoạch chiến tranh chống Trung Quốc? (Trả nợ xong đã!)

>> Báo Thanh Niên gỡ bài về "rửa vàng" (viết lại cho đúng?) ->

>> “Rửa vàng” từ chính sách của NHNN

>> 1 nút tắc, 1 đàn xã tắc và một bế tắc (bởi quá nhiều nguyên tắc!)

Không biết các bác thế nào chứ thiển cận như em thì chốt vụ anh Bình lại được rồi.

Ban đầu NHNN thông qua SJC tạo nên thế độc quyền, nâng giá vàng miếng SJC lên, giữ độ chênh giữa SJC và phi SJC (để cho SJC cái quyền này họ đã làm một động tác dọn đường là tung tin vàng giả, một loạt phóng sự trên TV cuối năm 2011, sau đó lấy cớ là đảm bảo chất lượng để cộp mác SJC). Tạo được thế độc quyền này họ tha hồ móc túi dân, vì dân tình sợ vàng giả sẽ có xu hướng trao đổi với riêng hãng vàng này, họ mua vàng phi SJC rẻ cộp mác vào bán vàng SJC đắt, móc túi người dân nhánh thứ nhất.

Để quy tất cả về một mối, thì NHNN độc quyền luôn quyền xuất nhập vàng. Sau đó tổ chức các phiên đấu thầu vàng, thu lợi từ NHTN và các tổ chức tín dụng nhánh thứ 2 (vì trước khi đấu thầu NHNN có ký với SJC một hợp đồng cam kết gia công vàng miếng, có nghĩa là bán vàng nhưng bán vàng bằng thương hiệu SJC).

Nếu giá vàng thế giới không giao động mạnh thì việc làm này của NHNN sẽ rất trót lọt, giữ độ chênh khoảng 1 triệu là ổn. Nhưng số bác Bình đen, giá vàng thế giới lao một phát xuống dưới 1400u/o trong có mấy ngày, thế là bác ý trở tay không kịp, chênh cao nhất lên tới 7 triệu các phương tiện truyền thông mới rùm beng lên. Và thế là báo Thanh Niên vào cuộc.

Bác Bình vớt vát nên có hé lộ một thông tin rất quan trọng, thông tin này có thể đưa bác ấy vào nhà đá. Vì rằng thế này. Bác ấy bảo 12 tấn vàng lấy từ dự trữ ngoại hối quốc gia. Cái này tuyệt đối là không được vì dự trữ ngoại hối để đảm bảo an toàn cho toàn bộ hệ thống tài chính, đảm bảo thanh khoản trong việc xuất nhập khẩu, liên quan trực tiếp đến viêc đảm bảo ngoại tệ cho các doanh nghiệp sản xuất (vì vàng là thứ dễ và nhanh đổi ra ngoại tệ nhất) , không thể lấy dự trữ ngoại hối để cho mỗi một việc là điều tiết giá vàng, đó là chưa kể đến việc bác bán vàng ra mà thu tiền Việt về thì lại càng không được, vì để đổi từ số tiền việt này ra thành ngoại tệ bổ sung vào kho dự trữ ngoại hối bù đắp vào số vàng bán ra, vô tình tạo áp lực lên thị tường ngoại tệ vốn đang rất zíc zắc và không bình thường.

Tạo độc quyền cho thương hiệu SJC móc túi dân, lấy dự trữ ngoại hối quốc gia đi làm bậy hai tội này đủ để vào nhà đá rồi.

Phải bảo vệ báo Thanh Niên và cô phóng viên viết bài các bác ạ.

Nguồn: Bình Ruồi

P/s: Dạ thưa các anh, em chỉ là thằng lính thôi à!

Xem thêm:
- Giá vềnh
- Tướng ruồi bu
- Tai vì quan ngu, rất ngu!
- Những vết chân đầy mắn thúi của ruồi. (bài cực hay)

Chèn link tự động vào các từ khóa trong bài viết

Bạn lướt web nhiều đôi khi bạn thấy một số site hay sử dụng 1 số từ khóa và chèn link vào đến 1 bài viết hay 1 chủ đề nào đó có liên quan trong bài viết đang xem. Dĩ nhiên điều đó bạn có thể chèn thủ công trong lúc soạn thảo bài viết đó để người xem click tới bài viết liên quan đó. Tuy nhiên nếu bạn muốn đặt link cho 1 từ khóa mà thường xuyên lặp lại trong nội dung bài viết của bạn và liên quan đến nội dung web/blog bạn cung cấp rất nhiều, bạn muốn đánh dấu, đặt link cho từ khóa đó thì việc làm thủ công sẽ mất cho bạn khá nhiều thời gian. Để giải quyết vấn đề đó thì hôm nay mình chia sẻ cho các bạn một thủ thuật sẽ tự động add link cho các từ khóa mà bạn đã thiết lập trước. Khi bạn đã thiết lập từ khóa và link dẫn cho từ khóa đó trước thì nếu bất kỳ bài viết nào trong web/blog của bạn có từ khóa đó thì nó sẽ được tự động được thêm link và đường dẫn bạn thiết lập cho nó. 

» Bắt đầu thủ thuật 

1. Đăng nhập vào tài khoản  Blogger

2. Vào phần Mẫu (Template)

3. Chọn chỉnh sửa HTML (Edit HTML)

4. Chọn mở rộng mẫu tiện ích (Expand Widget Templates)

5. Chèn code bên dưới ngay trước thẻ </head>

<script type='text/javascript'>
//<![CDATA[
function doHighlight(a,c,f){for(var d="",b=-1,g=c.toLowerCase(),e=a.toLowerCase();0<a.length;)b=e.indexOf(g,b+1),0>b?(d+=a,a=""):a.lastIndexOf(">",b)>=a.lastIndexOf("<",b)&&e.lastIndexOf("/script>",b)>=e.lastIndexOf("<script",b)&&(d+=a.substring(0,b)+'<a title="'+a.substr(b,c.length)+'" alt="'+a.substr(b,c.length)+'" href="'+f+'">'+a.substr(b,c.length)+"</a>",a=a.substr(b+c.length),e=a.toLowerCase(),b=-1);return d} function highlightSearchTerms(a,c,f,d){searchArray=c?[a]:a.split(" ");div=document.getElementById(d);a=div.innerHTML;for(c=0;c<searchArray.length;c++)a=doHighlight(a,searchArray[c],f);div.innerHTML=a;return!0};
//]]>
</script> 

6. Tìm đến đoạn code như bên dưới

<data:post.body/>

7. Thay thế đoạn code vừa tìm được thành đoạn code sau

<div expr:id='"summary" + data:post.id'>

<data:post.body/>
</div>
<script type='text/javascript'>
highlightSearchTerms('Từ khóa 1',true,'Link cho từ khóa 1','summary<data:post.id/>');

highlightSearchTerms('Từ khóa 2',true,'Link cho từ khóa 2','summary<data:post.id/>');

highlightSearchTerms('Từ khóa 3',true,'Link cho từ khóa 3','summary<data:post.id/>');
</script> 

Bạn thay từ khóa và link cho các từ khóa tương ứng. Nếu bạn muốn thêm hay bớt từ khóa thì chỉ cần copy hay xóa bỏ đoạn code highlightSearchTerms('Từ khóa 1',true,'Link cho từ khóa 1','summary<data:post.id/>'); và chỉnh sửa lại cho hợp lý là được. 

8. Cuối cùng save template lại 

Bây giờ bạn hãy truy cập vào bất kỳ 1 bài viết mà có chứa từ khóa bạn đã thiết lập ở trên để thấy kết quả nhé. Đây là một cách khá hay giúp bạn đặt link cho từ khóa quan trọng khá nhanh và góp phần nào vào việc SEO cho từ khóa blog bạn. 

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

Hiển thị widget chỉ ở trang chủ hoặc trang riêng biệt

Một khi bạn tạo một widget trên blog thì nó sẽ được hiển thị ở tất cả các trang theo mặc định, bao gồm cả trang chủ. Đôi khi bạn chỉ cần hiển thị một vài widget ở trang chủ hoặc chỉ ở một số trang hoặc thậm chí ở một trang riêng biệt nào đó. Thủ thuật này cũng khá đơn giản. Điều quan trọng là bạn phải nắm được id của widget mà bạn tạo ra.

Đọc thêm »

Khát vọng sống của “dị nhân” 70 centimét

Dị nhân… Sơn “phích”

Người ta gọi anh là Sơn “phích”. Bởi, anh bị liệt từ nhỏ, đôi mắt lại mù loà, còn cơ thể thì teo tóp, co quắp và nhỏ như… cái phích.

Hơn 40 tuổi đời, nhưng người đàn ông này đã phải “quanh quẩn” trên chiếc giường nhỏ hơn 30 năm. Thế nhưng, bằng niềm tin, nghị lực và khát vọng sống mãnh liệt, anh quyết vượt qua số phận, và anh đã làm được.



Chuyến công tác về vùng ven biển Nga Sơn (Thanh Hóa), tôi được nghe nhiều người kháo nhau về Sơn “phích”. Nghe cái tên ngồ ngộ, khơi trí tò mò nên tôi lân la tìm về để tận mắt xem anh ta là ai, người như thế nào. Về đến đầu thôn Đồng Đội, xã Nga Lĩnh, hỏi tên “Sơn phích”, hầu như người dân nào cũng biết…

Đọc thêm »