06:52 - Thứ Hai, 17 tháng 6, 2013

Hiển thị bài viết dạng 3 cột trong 1 nhãn cho blogger/blogspot

    [tintuc]
    Demo ngay trên trang chủ của mình nhé




    Tiện ích này rất thích hợp cho các trang giới thiệu phần mềm, ebook, quảng cáo sản phẩm,…làm cho Blog của bạn trông ngăn nắp và chuyên nghiệp hơn






    Thực hiện: (đưa vào tiện ích)
    1. Vào Thiết kế > Phần tử trang
    2. Tạo một widget HTML/JavaScript và dán code bên dưới vào :

    <style type="text/css"> 

    #itechplus-rc-3cot {width:516px;} 
    table#itechplus-rc-3cot {border:1px solid #ccc;} 
    #rc-3cot {padding:0 8px;width:30%;} 
    #rc-3cot p{padding:0;margin:0 0 5px 0;} 
    #rc-3cot img {margin:10px 9px 5px -15px; height:120px; width:165px; border:1px solid #ccc; padding:1px;} 
    #rc-3cot a:link {font:bold 12px arial;} 
    #itechplus-rc-3cot h2 { 
    background:url(#) no-repeat top left; 
    padding:5px 0 14px 15px; 
    font:bold 13px Verdana; 
    margin:0px; 
    color:#fff; 
    </style> 
    <script type="text/javascript"> 
    home_page = "http://www.hacbayit.com/"; 
    label = "Template Blogspot"; 
    numposts = 6; 
    sumTitle = 18; 
    colortitle = "#333"; 
    imgr = new Array(); 
    imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6yBxYiK-Od-QQS_RMFOScKidSg05tGFL3E91BF-y1Qv9VwXxgMSWCpHOPymNGDbUJc3wv3xe_G-grqIGFW8kdBoxWLCte6hm8Wwl5fj8-y_LZFyGfj-dedEHClImCfeobFnHoaFrgHTw/s300/no_image.jpg"; 
    showRandomImg = true; 
    </script> 
    <div id="itechplus-rc-3cot"> 

    <script type='text/javascript'>
    //<![CDATA[
    eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('15 O(a,b){8(a.w("<")!=-1){4 s=a.12("<");z(4 i=0;i<s.9;i++){8(s[i].w(">")!=-1){s[i]=s[i].10(s[i].w(">")+1,s[i].9)}}a=s.17("")}b=(b<a.9-1)?b:a.9-2;1c(a.1k(b-1)!=\' \'&&a.w(\' \',b)!=-1)b++;a=a.10(0,b-1);1m a}15 Z(e){j=(1j)?Y.1l((L.9+1)*Y.16()):0;q=U T();4 f=U T();z(4 i=0;i<K;i++){4 g=e.S.R[i];4 h=g.A.$t;4 l;4 n;8(i==e.S.R.9)F;z(4 k=0;k<g.x.9;k++){8(g.x[k].Q==\'18\'){n=g.x[k].H;F}}z(4 k=0;k<g.x.9;k++){8(g.x[k].Q==\'1a\'&&g.x[k].1x==\'1d/1e\'){l=g.x[k].A.12(" ")[0];F}}8("W"J g){4 o=g.W.$t}D 8("N"J g){4 o=g.N.$t}D 4 o="";s=o;a=s.w("<q");b=s.w("E=\\"",a);c=s.w("\\"",b+5);d=s.1b(b+5,c-b-5);8(j>L.9-1)j=0;q[i]=L[j];8((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))q[i]=d;4 p=h.9;8(p>P){f[i]=\'<B v="u-r"><C><q G="\'+h+\'" E="\'+q[i]+\'"/><p><a A="\'+h+\'" H="\'+n+\'" V="M:\'+X+\';">\'+O(h,P)+\' ...</a></p><C></B>\'}D{f[i]=\'<B v="u-r"><C><q G="\'+h+\'" E="\'+q[i]+\'"/><p><a A="\'+h+\'" H="\'+n+\'" V="M:\'+X+\';">\'+h+\'</a></p></C></B>\'}}4 m=K/3;6.7("<11 1f=\\"0\\" 1g=\\"0\\" 1h=\\"0\\" v=\\"1i-u-r\\">");z(4 j=0;j<m;j++){8(j%3==0){6.7("<y v=\\"u-r-13\\">");6.7(f[j*3]);6.7(f[j*3+1]);6.7(f[j*3+2]);6.7("<y v=\\"u-r-13\\">");6.7("</y>")}D{6.7("<y v=\\"u-r-14\\">");6.7(f[j*3]);6.7(f[j*3+1]);6.7(f[j*3+2]);6.7("<y v=\\"u-r-14\\">");6.7("</y>")}}6.7("</11>")}6.7("<I E=\\""+1n+"1o/1p/1q/-/"+1r+"?1s-1t="+K+"&1u=1v&G=1w-J-I&19=Z\\"><\\/I>");',62,96,'||||var||document|write|if|length|||||||||||||||||img|3cot|||rc|id|indexOf|link|tr|for|title|td|center|else|src|break|alt|href|script|in|numposts|imgr|color|summary|removeHtmlTag|sumTitle|rel|entry|feed|Array|new|style|content|colortitle|Math|showrecentposts99|substring|table|split|top|bottom|function|random|join|alternate|callback|replies|substr|while|text|html|border|cellspacing|cellpadding|itechplus|showRandomImg|charAt|floor|return|home_page|feeds|posts|default|label|max|results|orderby|published|json|type'.split('|'),0,{}))
    //]]>
    </script>


    <p style="float:right;margin:0;padding:3px"><a href="http://www.hacbayit.com/search/label/Template%20Blogspot?&max-results=10"></a></p> 
    </div>
    [/tintuc]

Bình luận & Góp ý
  1. Cảm ơn anh vì bài viết rất bổ ích này. Em ko biết về thiết kế nhưng may mắn tìm được bài chia sẻ này của anh. Nhưng khi em áp dụng hiển thị widget dạng 3 cột (ví dụ widget ÁO KIỂU ở phần dưới trang chủ), thì click vào ảnh thumbnail ko link đến bài viết được mà phải click vào tên bài viết. Em phải làm sao để click vào ảnh thumbnail link đến bài viết được ạ? Trang của em là http://sakurafashionfans.blogspot.com/ Một lần nữa chân thành cảm ơn anh <3

    Trả lờiXóa
    Trả lời
    1. ĐOạn code chia sẻ trên bên mình đã mã hóa, nên bạn ko can thiệp và tùy biến dc nhé.

      Xóa
    2. Em muốn nhờ anh chỉnh code thì phí như thế nào ạ?
      - Click vào ảnh thumbnail ở widget trang chủ (vd ÁO KHOÁC, ÁO KIỂU...) link đến bài viết, đồng thời xóa tên sản phẩm (vd Áo khoác thêu ren mã SF84) chỉ hiển thị ảnh thumbnail.
      - Link được đến bài viết khi click vào ảnh thumbnail ở widget "Mới nhất" sidebar bên trái (giống như widget "Xem nhiều nhất").
      - Khi xem theo label (vd http://sakurafashionfans.blogspot.com/search/label/%C3%81o%20kho%C3%A1c?&max-results=48 ), bỏ dạng list, chỉ hiển thị dạng grid, anh chỉnh hộ để 3 mẫu đầu thẳng hàng chứ không dạng bậc thang như vậy.
      - Dịch các mục (TRANG CHỦ, CÁC LOẠI ÁO...) ở menu trên cùng vào trong phạm vi chiều rộng của blog.
      Trang của em http://sakurafashionfans.blogspot.com/
      Cảm ơn anh :)

      Xóa
    3. Bạn vui lòng liên hệ 0985899017 hoặc fb https://www.facebook.com/thaiaiti để mình báo giá chi tiết. Cảm ơn

      Xóa