Hoạt hình Mr Bean

Hoạt hình hãy đợi đấy

Album Nguyễn Đoàn

Tạo banner quảng cáo dạng Popup

Ở

các bài viết trước, iTechPlus đã giới thiệu đến các bạn 2 thủ thuật tạo banner quảng cáo trượt dọc và banner quảng cáo hiển thị ngẫu nhiên cho Blogspot.

Tiếp tục chủ đề trên, hôm nay iTechPlus xin giới thiệu tiếp một style khác, đó là tạo banner quảng cáo hiển thị dạng popup – nghĩa là mẫu quảng cáo sẽ bật lên khi người đọc ghé thăm website của bạn.

Hình minh họa

Live Demo

Cách thực hiện :
1. Vào Thiết kế > Phần tử trang
2. Tạo một widget HTML\JavaScripts và chèn vào code bên dưới :
  <style type="text/css">
            * html div#fl813691 {position: absolute; overflow:hidden;
            top:expression(eval(document.compatMode &&
            document.compatMode=='CSS1Compat') ?
            documentElement.scrollTop
            +(documentElement.clientHeight-this.clientHeight)
            : document.body.scrollTop
            +(document.body.clientHeight-this.clientHeight));}
            #fl813691{font: 12px Arial, Helvetica, sans-serif; color:#666; position:fixed; _position: absolute; right:0; bottom:0; height:150px; }
            #eb951855{ width:279px; padding-right:7px; background:url(http://img98.imageshack.us/img98/9400/rightp.gif) no-repeat right top;}
            #cob263512{background:url(http://img205.imageshack.us/img205/2176/fulld.gif) no-repeat left top; height:150px; padding-left:7px;}
            #coh963846{color:#690;display:block; height:20px; line-height:20px; font-size:11px; width:277px;}
            #coh963846 a{color:#690;text-decoration:none;}
            #coc67178{float:right; padding:0; margin:0; list-style:none; overflow:hidden; height:15px;}
                        #coc67178 li{display:inline;}
                        #coc67178 li a{background-image:url(http://img205.imageshack.us/img205/9837/closebutton.gif); background-repeat:no-repeat; width:30px; height:0; padding-top:15px; overflow:hidden; float:left;}
                            #coc67178 li a.close{background-position: 0 0;}
                            #coc67178 li a.close:hover{background-position: 0 -15px;}
                            #coc67178 li a.min{background-position: -30px 0;}
                            #coc67178 li a.min:hover{background-position: -30px -15px;}
                            #coc67178 li a.max{background-position: -60px 0;}
                            #coc67178 li a.max:hover{background-position: -60px -15px;}
            #co453569{display:block; margin:0; padding:0; height:123px;  border-style:solid; border-width:1px; border-color:#111 #999 #999 #111; line-height:1.6em; overflow:hidden;}
            </style>
             <div id="fl813691" style="height: 152px;">
                <div id="eb951855">
                <div id="cob263512">
                    <div id="coh963846">
                        <ul id="coc67178">
                            <li id="pf204652hide"><a class="min" href="javascript:pf204652clickhide();" title="&#7848;n &#273;i">&#7848;n</a></li>
                            <li id="pf204652show" style="display: none;"><a class="max" href="javascript:pf204652clickshow();" title="Hi&#7879;n l&#7841;i">Xem </a></li>
                        </ul>
                    &nbsp;Xem Phim Blog Trần Phúc Minh
                   </div>
                    <div id="co453569">
     <!-- code ads -->
<a target="_blank" href="http://www.youtube.com/p/19504296AFE44F36?hl=vi_VN&amp;fs=1" rel="nofollow"> <img style="margin:3px 1px 1px 3px;" border="0" width="264" src="http://img.aicoly.com/debate/2010/11/13/2551289615538.jpg" height="115" title="Blog thông tin tỏng hợp | Trần Phúc Minh Phòng Nông nghiệp & PTNT"/></a>
<!-- code ads --></div></div></div></div>
            <script>
            pf204652bottomLayer = document.getElementById('fl813691');
            var pf204652IntervalId = 0;
            var pf204652maxHeight = 150;//Chieu cao khung quang cao
            var pf204652minHeight = 20;
            var pf204652curHeight = 0;
            function pf204652show( ){
              pf204652curHeight += 2;
              if (pf204652curHeight > pf204652maxHeight){
                clearInterval ( pf204652IntervalId );
              }
              pf204652bottomLayer.style.height = pf204652curHeight+'px';
            }
            function pf204652hide( ){
              pf204652curHeight -= 3;
              if (pf204652curHeight < pf204652minHeight){
                clearInterval ( pf204652IntervalId );
              }
              pf204652bottomLayer.style.height = pf204652curHeight+'px';
            }
            pf204652IntervalId = setInterval ( 'pf204652show()', 5 );
            function pf204652clickhide(){
                document.getElementById('pf204652hide').style.display='none';
                document.getElementById('pf204652show').style.display='inline';
                pf204652IntervalId = setInterval ( 'pf204652hide()', 5 );
            }
            function pf204652clickshow(){
                document.getElementById('pf204652hide').style.display='inline';
                document.getElementById('pf204652show').style.display='none';
                pf204652IntervalId = setInterval ( 'pf204652show()', 5 );
            }
            function pf204652clickclose(){
                document.body.style.marginBottom = '0px';
                pf204652bottomLayer.style.display = 'none';
            }
            </script>Trong đoạn code trên :

• Xem phim Blog Trần Phúc Minh : tiêu đề khung quảng cáo
• http://www.youtube.com/p/19504296AFE44F36?hl=vi_VN&amp;fs=1 : liên kết đến website nhà quảng cáo
• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhazv23jjF8zygig5XsiQ0hz9jHYAVTJKQ38-p04RM8Kfj_WfoU1m8FNpLkIzLu4ni_LywWMd8Nk82ZuSK3fvzj-UulUs-wlcngEwRijtDqAeU_Fi3DlN8xWP5MU94cmdV2lp54Wtm5Zug/s1600/bannerfans_419401.jpg : hình ảnh quảng cáo

3. Save and Done.
Chúc các bạn thành công !

Dùng Google Code,Google Site làm host chứa file js

Thường thì việc lưu trữ các file js tại các host free như 110mb tuy tốc độ nhanh nhưng không ổn định.Hôm nay mình xin giới thiệu với các bạn cách dùng GC(Google Code) và GS(Google Site)để làm nơi lưu trữ file js
1.Với Google Code

    Google Code là một trang web của Google trong đó tập trung các nhà phát triển các dự án phần mềm mã nguồn mở được hỗ trợ bởi Google. Trang có rất nhiều mã nguồn phần mềm và danh sách các dịch vụ có hỗ trợ các API công cộng để phục vụ cho việc phát triển các phần mềm hỗ trợ khác. (Wikipedia).

Các bước thực hiện: 

a. Đăng ký tài khoản Google (gmail, google adsense,….)

b. Đăng nhập Google Code 
c. Nhấn vào mục Creat a new project

d. Điền vào form đăng ký. Ô Version control system và Source code license thì tùy bạn lựa chọn. Dùng cho nhu cầu cá nhân thì không cần quan tâm.e. Creat Project. Sau đó, bạn sẽ có 1 trang tương tự như: https://code.google.com/p/minhmeofiles/
f. Nhấn vào Tab Downloads >>> New download. Rồi lựa chọn files cần upload (không quá 100 MB)
g. Lựa chọn file lưu trữ là Js file.Up load file js của mình lên.
h. Upload xong, bạn có thấy đường link tải files bạn vừa up.


Download>New Download

Nhấp chuột trái vào file js lấy link download nhúng vào blog_> Ẹnjoy ^^

2.Đối với Google Site:
Tạo 1 tài khoản tại http://sites.google.com/ >Tạo trang web mới
Sau đó bạn upload file js lên>Tài liệu đính kèm>Tải lên

Lấy link file js (Chuột phải vào download chọn copy link) nhúng vào blog :)

Theo mình thì các bạn nên dùng GC vì tốc độ load rất nhanh !

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

Tân cổ giao duyên

Bảng mã màu dành cho Blogger

Trong quá trình thiết kế Blog, ngoài chỉnh sửa bố cục thì việc phối màu để make-up giao diện là công việc thường xuyên của các Blogger.

Dưới đây là bảng mã màu thập lục rất hữu ích dành cho các bạn.

.

Game: Half Life 2 Total Mayhem

Game: Samura Jack: Code of the Samurai

Game: Penalty Fever

Game Uphill Rush

Uphill Rush

Tạo trang leech dễ dàng không cần host

Download từ Rapidshare khá khó khăn với nhiều người, tuy nhiên nếu biết cách chúng ta sẽ làm cho công việc ấy dễ dàng hơn. Một trong những phương pháp ấy chính là tự làm một trang web leech dành cho riêng mình. Không cần host, bạn vẫn có thể tạo trang leech cho riêng mình. Bài viết sau sẽ hướng dẫn bạn cách tạo web leech ngay trên máy tính của bạn…

Bước 1: DOWNLOAD RAPIDGET
Đầu tiên download mã nguồn PHP Rapidget bản mới nhất tại đây Hoặc cũng có thể dùng Rapidleech (download tại www.rapidleech.com) nhưng nó không hỗ trợ nhiều host bằng Rapidget nên bài viết này sẽ hướng dẫn cách cài đặt Rapidget (Rapidleech cũng tương tự như vậy) Sau khi down về, giải nén rồi để đấy (đặt tên cho thư mục vừa giải nén là rapidget), download tiếp chương trình tạo webserver ảo trên máy tính. Bước 2: CÀI ĐẶT APPSERV
Ở đây, tôi khuyên các bạn nên dùng Appserv vì nó rất dễ sử dụng, gọn nhẹ hơn XAMPP. Download Appserv 2.5.10 tại đây Cài đặt Appserv như sau (xin lấy vd cách cài đặt bản 2.5.7, bản 2.5.10 cài đặt tương tự) Chạy file vừa download, màn hình Welcome hiện ra như sau:

Chọn Next

Chọn I Agree

Bấm Browse… để chọn nơi cài đặt Appserv Xong nhấn Next

Chọn tất cả các mục vì có thể bạn sẽ cần đến chúng. Xong nhấn Next

Phần Server name ghi là localhost, Administrator’s Email Address: email của bạn, phần Port cứ để nguyên là 80. Next
qua bước tiếp theo

Điền Password và xác nhận password, đây sẽ là password tài khoản admin của bạn, hãy nhớ kỹ pass này. Next Quá trình cài đặt bắt đầu…

Cài xong, nhấn Next

Chọn Start Apache và Start SQL
Finish. Bây giờ bạn đã có thể bắt đầu công việc của mình. Mở trình duyệt lên, gõ vào khung Address địa chỉ localhost hoặc 127.0.0.1, nếu hiện ra thế này là bạn đã thành công

Muốn tạo thêm database mới truy cập vào localhost/phpmyadmin, Username: root, Pass: do bạn chọn lúc cài đặt

Bước 3: CÀI ĐẶT RAPIDGET
Cách cài đặt khá đơn giản, bạn chỉ việc copy thư mục rapidget ở bước 1 vào thư mục www của Appserv (mặc định là C:\Appserv\www). Thế là xong, bây giờ bạn mở trình duyệt lên gõ vào thanh address: localhost/rapidget. Nếu hiện ra trang này là được

Nếu có tài khoản Premium, bạn hãy chọn Option rồi điền acc vào, việc download sẽ diễn ra nhanh hơn.

CHÚ Ý:

• Điểm khác biệt so với dùng Rapidget trên host là file bạn tải về sẽ nằm trong ổ cứng của máy bạn, nếu bạn có ý định download từ 1 file từ RS thì cứ việc copy link vào khung URL, nhấn Download file, file tải về sẽ nằm trong thư mục files (mặc định đường dẫn là C:\AppServ\www\Rapidget\files)
• Nếu bạn không muốn tải file mà chỉ muốn lấy d-link thì cứ check vào hộp DirectLink, 1 cửa sổ hiện ra chứa d-link giúp bạn download nhanh chóng hơn.

Vậy là xong rồi, việc download từ RS sẽ không còn quá khó khăn đối với bạn

Tiện ích “Thông tin cần biết” cho Blogger

“Thông tin cần biết” là tiện ích được sử dụng rất phổ biến trên các trang Web tin tức ở VN, như báo VNExpress, Vietnamnet,…dưới nhiều dạng thức khác nhau. Tuy nhiên, tựu trung lại cũng chỉ chứa các thông tin như giá vàng, thời tiết, giá chứng khoán,…vv…

Cho dù nội dung trên Blog của bạn không liên quan gì đến các lĩnh vực đó, nhưng theo iTechPlus bạn cũng nên trang bị cho Blog của mình bởi đó là những “thông tin cần biết”, không lúc này thì lúc khác.
Và trong bài viết bên dưới, iTechPlus sẽ hướng dẫn các bạn tạo một bảng nội dung như hình dưới chỉ với 3 bước đơn giản :

DEMO

Thực hiện :
Bước 1 : Vào Thiết kế > Chỉnh sửa HTML

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

    .thongtin img{width:24px;height:18px;margin:5px 5px -5px 0}
    .thongtin li{margin:10px 0 20px}

Bước 3 : Tạo một widget HTML\JavaScript và chèn vào đoạn code sau :

    <script language="JavaScript">
    function popUp(URL) {
    day = new Date();
    id = day.getTime();
    eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=500,height=350,left = 380,top = 180');");
    }
    </script>

    <table border="0" width="100%" align="left" cellspacing="0" cellpadding="0" class="thongtin" style="border-bottom:1px solid #ddd">      
    <tr><td align="left" valign="top" width="50%">
    <ul><li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmk3jNFDFhtbuHO5Atu8bAZZHNFEErz5O1qc5KP7MeHVrZUXoKnUN2Y680sFGL2_jij4AOb5Mz7ncgoyTcpM2DiqGA8t8e7PqEIvtcqjvxKYodqQIGeWCVDIHwPQniyql7IBS0hHwsMSE/"/><a href="javascript:popUp('http://www.taichinhdientu.vn/services/infopage.aspx?svc=exchangerates')">Tỉ giá ngoại tệ</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_tA62YC6pXsBQ6c2ETQkUfzZUc8NGKV1TvP_v8aqpDc_oeCTDe1DFui1BZRsw91fzfQCooESoYpZLDxENSFgnCcAkTV5wz_TGPGdRJtT4hfPn9WX4eBNzbeIaX3InkEghyphenhypheng4ZqOg08vs/"/><a href="javascript:popUp('http://www.taichinhdientu.vn/services/infopage.aspx?svc=goldrates')">Bảng giá vàng</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkKkEZ9CfacpLVudrxQZkHImob2wvvhtghcDeSbJhurvvumDoMyp-l-ofTozv1SZYwx6Dab3F_e8fiEpSqHnSpD7vVAF4c_KnxonesUthKKRooGofDg0HTmjXOWD6cep-ClP9b8xibYow/"/><a href="javascript:popUp('http://www.taichinhdientu.vn/services/infopage.aspx?svc=oilrates')">Bảng giá dầu</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvu6aJ2V6o5oxAkOVyFqhpT8p1-LfBuy61DN4wqU1lRYLvO6kz9q45XHGHO6F2rt0ojoeOcF0d09WQCZKpwlwzWgQV5l2AmI3Qdp7dhQk112TF6DObYjfVTj8muI-x6UdldzJ5VuZ3log/"/><a href="javascript:popUp('http://chungkhoan.24h.com.vn/chungkhoan.php')">Giá chứng khoán</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAGKEukrEx2A2JvuZiNxATWm6SlJdPxFk9kK7QPt2oy4I30V6ths4e_2L2LiFi3-7uMkYe7vQ4MxFQsingqVwqhJ8rINWiQo4-iMFbcP1itxI9J7p5McAWq0LQTPERL2T_lVs8YVJ7YQA/"/><a href="javascript:popUp('http://www.chieuphimquocgia.com.vn/lichphim/Default.aspx?MenuId=14')">Lịch chiếu phim</a></li>
    </ul></td>

    <td align="left" valign="top" width="50%">
    <ul><li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGsK6HxVdzcaKvS7TiIOj5HDhTJ5d0PEM2GACcKnXAyagItTlin_iZ2Ucv5eN_f8dwTj0hqusSahHf9uuNsF3Qcohfl2wR2zTW0JN-A5BP5y2PRRCPVphgUQRdGPJo0BbHr58f9OS3xng/"/><a href="javascript:popUp('http://vovnews.vn/Services/Infopage.aspx?svc=lotteryresults')">Kết quả xổ số</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1bXRu3IYdOnaA9T1yCocCk6zEQiIGKWQNY0xljhARExat6P6iUrHuFL_IMzajy7i5RUeYOz5tvW1n01hW_X-5zWoJCMsjLMwd59gb14xpOG8kGitr4BsrIAegucVe3nNUgpK6NSn11Gw/"/><a href="javascript:popUp('http://baobongda.com.vn/lich-thi-dau/league/')">Lịch bóng đá</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpi8QghW2ChY6YJFztqVzfhubdPiw2HTwfjMqtnGqq1pwzPDuzHLeXtW7gl3g3lwhYBLI8xGIv7g8-ZzHt55QCe8xA9-ShBKtr4EqZNxVVVCcQxpR-p9zQlihtb4BJiDxiFUZEpi2TT9Y/"/><a href="javascript:popUp('http://www.taichinhdientu.vn/services/infopage.aspx?svc=tvschedules')">Lịch truyền hình</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhauFSBGN9NTeFAcTe7mGZqN-Rg2VQGWJOp5OUIdd5Awv4zR1Oxj2CFq8NJyg_CR4cDslGd3PPQTehs-bHolx-GcomfigeC5eOMcxOh8GtXG2APe4UWla54-T_3nVuTOAZ_YunIG9-5Vo8/"/><a href="javascript:popUp('http://vovnews.vn/Services/Infopage.aspx?svc=weathers')">Dự báo thời tiết</a></li>
    <li><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEF0oZIFLYf85IGh5umCMtuoaUd1JZNpWd7xCSfwzTPlCWy4OEPlViqLvTxjQitvR3bNwpI7DrB1Vk0mXDbORjJwQ_WlfNNxSx5Lf7ft4BVuxtp4vBIzuW2kTRadLAIbzAAjI1Q-C_pA4/"/><a href="javascript:popUp('http://service.thesaigontimes.vn/atm/tracuuatm.aspx')">Điểm đặt ATM</a></li>
    </ul></td></tr></table>

Lưu lại là bạn đã có tiện ích “Thông tin cần biết” giống iTechPlus rồi đó !

* Lưu ý : Các bạn nên download các file ảnh về và upload lên host riêng để sử dụng

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

Các Album Nhạc vàng tuyển chọn

THÔNG TƯ BAN HÀNH QUY CHUẨN KỸ THUẬT QUỐC GIA VỀ ĐIỀU KIỆN VỆ SINH THÚ Y

BỘ NÔNG NGHIỆP VÀ PHÁT TRIỂN NÔNG THÔN -------	CỘNG HÒA XÃ HỘI CHỦ NGHĨA VIỆT NAM                              Độc lập - Tự do - Hạnh phúc                               ---------------
Số: 33/2011/TT-BNNPTNT	Hà Nội, ngày 06 tháng 5 năm 2011

THÔNG TƯ  (TẢI ĐẦY ĐỦ TẠI ĐÂY)

BAN HÀNH QUY CHUẨN KỸ THUẬT QUỐC GIA VỀ ĐIỀU KIỆN VỆ SINH THÚ Y

Căn cứ Nghị định số 01/2008/CP ngày 03 tháng 01 năm 2008 của Chính phủ quy định chức năng, nhiệm vụ, quyền hạn và cơ cấu tổ chức của Bộ Nông nghiệp và Phát triển nông thôn; Nghị định 75/2009/NĐ-CP ngày 10 tháng 9 năm 2009 của Chính phủ về việc sửa đổi điều 3 Nghị định số 01/2008/CP ngày 03 tháng 01 năm 2008;
Căn cứ Luật Tiêu chuẩn và Quy chuẩn kỹ thuật ngày 29 tháng 6 năm 2006;
Căn cứ Pháp lệnh Thú y ngày 29 tháng 4 năm 2004;
Bộ Nông nghiệp và Phát triển nông thôn ban hành Quy chuẩn kỹ thuật quốc gia về điều kiện vệ sinh thú y:

Điều 1. Ban hành kèm theo Thông tư này 04 Quy chuẩn kỹ thuật quốc gia:

1. Quy chuẩn kỹ thuật quốc gia về vệ sinh nước dùng trong chăn nuôi.

Ký hiệu: QCVN 01 - 39: 2011/BNNPTNT

2. Quy chuẩn kỹ thuật quốc gia về điều kiện vệ sinh thú y cơ sở kinh doanh thuốc thú y.

Ký hiệu: QCVN 01 - 40: 2011/BNNPTNT

3. Quy chuẩn kỹ thuật quốc gia về yêu cầu xử lý vệ sinh đối với việc tiêu huỷ động vật và sản phẩm động vật.

Ký hiệu: QCVN 01 - 41: 2011/BNNPTNT

4. Quy chuẩn kỹ thuật quốc gia về điều kiện vệ sinh thú y đối với cơ sở thử nghiệm, khảo nghiệm thuốc thú y.

Ký hiệu: QCVN 01 - 42: 2011/BNNPTNT

Điều 2. Thông tư này có hiệu lực sau 6 tháng, kể từ ngày ký ban hành.

Điều 3. Cục trưởng Cục Thú y, Thủ trưởng các cơ quan, tổ chức và cá nhân có liên quan có trách nhiệm tổ chức thực hiện.

Trong quá trình thực hiện, nếu có vướng mắc, các cơ quan, tổ chức và cá nhân kịp thời phản ánh về Bộ Nông nghiệp và Phát triển nông thôn để nghiên cứu, sửa đổi, bổ sung./.

Nơi nhận: Văn phòng Chính phủ (để b/c); Các Bộ, cơ quan ngang Bộ, cơ quan thuộc CP; UBND các Tỉnh, TP trực thuộc TƯ; Chi cục Thú y các Tỉnh, TP trực thuộc TƯ; Các Cục, Vụ, Viện, Trường Đại học thuộc Bộ Nông nghiệp và PTNT; Công báo, Website Chính phủ; Cục Kiểm tra văn bản, Bộ Tư pháp; Lưu: VT, KHCN.

KT. BỘ TRƯỞNG THỨ TRƯỞNG Bùi Bá Bổng

Liên khúc Tuấn Vũ

Hình chuyến đi chơi lễ 30-4 (2)

Tiện ích Recent Posts with 3 columns for Blogger

Chắc các bạn cũng thấy trên site iTechPlus.info ở sidebar có một trương mục là Bản quyền phần mềm, với bố cục là logo và tên của phần mềm được chia làm 3 cột hiển thị khá gọn gàng và đẹp mắt.

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,…kết hợp sử dụng tiện ích Multi Tabbed Widget For Blogger sẽ càng làm cho Blog của bạn trông ngăn nắp và chuyên nghiệp hơn.

Hình minh họa | Demo

Thể theo yêu cầu của bạn Mobile, cũng như muốn chia sẻ với các bạn tiện ích hữu ích này, bài viết bên dưới iTechPlus sẽ hướng dẫn các bạn cách tạo widget Recent Posts with 3 columns for Blogger qua 2 bước đơn giản.
Thực hiện :
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:320px;}
    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:8px 0 2px; height:60px; width:50px; border:1px solid #ccc; padding:1px;}
    #rc-3cot a:link {font:normal 12px arial;}
    #itechplus-rc-3cot h2 {
    background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW0S_1PLivxhnw9N7g1h_cHOFL-kNDcsUryjq1EetUIcdMHJ8H8epANyLdlqOIoaarywJexhKwEDs1jGw2R_jI1Xp08pUdvu7bvtRwm5eUsd_OjO3qPb1Nv0Ch4I1TrUCnwW3nMHT_TzA/) 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://itechplus.info/";
    label = "License";
    numposts = 9;
    sumTitle = 24;
    colortitle = "#333";
    imgr = new Array();
    imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkF4_ANwfUf6Fg9wVRrclsGlcEp2lnG82mbmMB6X2C8mbIIKBZoxfq0LDgoDJb7KlO3eIO7rHnsRKFEBMLOUspQurAV_Zr5pHq-9I3S6_F-OftMs9SnNStWEv2PgHGsUxjynuDD7apLYI/";
    showRandomImg = true;
    </script>
    <div id="itechplus-rc-3cot">
    <h2>Recent Posts 3 column</h2>
    <script src="https://sites.google.com/site/itechroot/javascripts/itechplus-rc-3cot.txt" type="text/javascript"></script>
    <p style="float:right;margin:0;padding:3px">Xem tất cả<a href="http://www.itechplus.info/search/label/License?&max-results=8"> Phần mềm bản quyền &#187;</a></p>
    </div>

Trong đoạn code trên :

    width:320px; : chiều rộng của widget
    height:60px; width:50px; : chiều rộng và chiều cao của ảnh đại diện
    home_page = "http://itechplus.info/"; : địa chỉ blog của bạn
    label = "License"; : tên trương mục muốn hiển thị
    numposts = 9; : số bài viết sẽ hiển thị
    sumTitle = 24; : số ký tự dòng tiêu đề bài đăng
    colortitle = "#333"; : màu tiêu đề bài đăng
    imgr[0] = “…”; : hình đại diện cho bài viết không có ảnh

Các bạn thay đổi cho phù hợp. Hy vọng các bạn sẽ thích tiện ích này.

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

Hiển thị bài viết dạng list ở các trang Home, Label, Archive

Mình đã từng giới thiệu với các bạn thủ thuật chỉ hiển thị tiêu đề bài viết ở các trang Home, Label, Archive (xem thêm ở đây), hôm nay mình sẽ giới thiệu 1 cách hiển thị cũng tương tự, nhưng có hơi phức tạp hơn 1 chút. Cũng với dạng hiển thị dạng list, nhưng ở thủ thuật này sẽ bổ xung thêm phần ngày đăng, tác giả, nhãn...

Hình ảnh minh họa :

* Các bước để thực hiện thủ thuật:

- Bước 1 : Thiết lập lại ngày giờ hiển thị của bài đăng

Để hiển thị được ngày giờ như trong hình demo, các bạn thực hiện các bước sau:
- Vào Cài đặt » Định dạng » tới mục Định dạng dấu thời gian , và điều chỉnh lại như hình minh họa bên dưới :

- Bước 2 : Ẩn toàn bộ phần bài viết ở các trang Home, Label, Archive
Phần bài viết bạn sẽ có 3 chỗ phải ẩn, đó là Header bài viết, nội dung bài viết và phần Footer của bài viết.
- Phần Header bài viết : gồm có 2 phần, đó là tiêu đề và phần date-header (ngày đăng bài viết).
- Phần nội dung : chứa nội dung bài viết.
- Phần Footer : gồm ngày đăng, nhãn, tác giả...

Để hoàn thực bước 2 này, các bạn làm theo các bước bên dưới :
Vào Thiết kế > Chỉnh sửa HTML > Mở rộng mẫu tiện ích
- Chèn đoạn code bên dưới vào trước thẻ đóng </head> để ẩn phần header & footer của bài viết :

    <b:if cond='data:blog.pageType != "item"'>
    <style type='text/css'>
    .post-footer {display : none;}
    .date-header {display : none;}
    .post-title {display : none;}
    </style>
    </b:if>

- Tiếp tục tìm đoạn code bên dưới :

    <data:post.body/>

hoặc có thể là

    <p><data:post.body/></p>

và thêm đoạn code được in đậm vào như bên dưới để ẩn nội dung bài viết :

    <b:if cond='data:blog.pageType == "item"'>
    <data:post.body/>
    </b:if>

- Save template.

- Bước 3 : Thủ thuật chính

1. Trước tiên ta sẽ tạo header cho phần list này (xem hình minh họa)

=> Các bước thực hiện :

- Vào Thiết kế > Chỉnh sửa HTML  > Mở rộng mẫu tiện ích
- Tìm đoạn code bên dưới (hoặc tương tự):

    <b:includable id='main' var='top'>
    <!-- posts -->
    <div class='blog-posts hfeed'>
    <b:include data='top' name='status-message'/>
    <data:defaultAdStart/>
    <b:loop values='data:posts' var='post'>
    <b:if cond='data:post.dateHeader'>
    <h2 class='date-header'><data:post.dateHeader/></h2>
    </b:if>
    <b:include data='post' name='post'/>

- thêm đoạn code được in đậm như bên dưới:

    <b:includable id='main' var='top'>
    <!-- posts -->
    <div class='blog-posts hfeed'>
    <b:include data='top' name='status-message'/>

    <b:if cond='data:blog.pageType != "item"'>

    <table style='background:#eee; width:100%'>

    <tr>

    <td style='width:70%; text-align:center; font-weight:bold;'>Tiêu đề</td>

    <td style='width:15%; text-align:center; font-weight:bold;'>Tác Giả</td>

    <td style='width:15%; text-align:center; font-weight:bold;'>Ngày đăng</td>

    </tr>

    </table>

    </b:if>

    <data:defaultAdStart/>
    <b:loop values='data:posts' var='post'>
    <b:if cond='data:post.dateHeader'>
    <h2 class='date-header'><data:post.dateHeader/></h2>
    </b:if>
    <b:include data='post' name='post'/>

- Khoan Save template, tiếp tục thực hiện sang bước 2.

2. Tạo & trang trí cho list bài viết:

- Tìm đến đoạn code bên dưới:

    <div class='post-header-line-1'/>
    <div class='post-body entry-content'>

- Thêm đoạn code được in đậm như bên dưới:

    <div class='post-header-line-1'/>

    <b:if cond='data:blog.pageType != "item"'>

    <table style='border-bottom:1px solid #aaa; width:100%'>

    <tr>

    <td style='width:70%; font-weight:bold;'>

    [<span class='post-labels'>

    <b:if cond='data:post.labels'>

    <b:loop values='data:post.labels' var='label'>

    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if></b:loop> </b:if>

    </span>] <a expr:href='data:post.url'><data:post.title/></a>

    </td>

    <td style='width:15%; font-weight:bold; text-align:center;'>

    <span class='post-author vcard'>

    <b:if cond='data:top.showAuthor'>

    <span class='fn'><data:post.author/></span>

    </b:if>

    </span>

    </td>

    <td style='width:15%; font-weight:bold; text-align:center;'>

    <span class='post-timestamp'>

    <b:if cond='data:top.showTimestamp'>

    <data:post.timestamp/>

    </b:if>

    </span>

    </td>

    </tr>

    </table>

    </b:if>

    <div class='post-body entry-content'>


- Save template để hoàn tất .

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

Recent posts 2 cột với hiệu ứng Tooltip

Việc áp dụng tooltip vào các tiện ích recent posts sẽ làm cho các tiện ích này trở nên pro hơn. Thực ra mình đã từng thử việc này lâu rồi, nhưng các lần trước “mò” đều ko ra, nản nên bỏ đó, bây giờ “cảm hứng” đang dâng, tự nhiên test lại được. Và thế là post cho mọi người. Với thủ thuật này khi rê chuột vào tiêu đề bài viết thì nội dung tóm tắt của bài viết sẽ được hiển thị. Với cách này dễ thu hút người đọc hơn so với chỉ tiêu đề bài viết và ảnh thumbnail minh họa.
Nếu có gì không rõ, các bạn hãy xem lại bài viết : Recent posts 2 cột

Hình ảnh minh họa

Xem DEMO : Recent Posts with Tooltip
* Sau đây là các bước thực hiện :
1. Vào bố cục
2. Vào chỉnh sửa code HTML
3. Chèn đọan code bên dưới vào trước thẻ đóng </head>

<link href="http://data.fandung.com/blog/demo/tooltip-recentposts/tooltip.css" rel="stylesheet" type="text/css" />
<script src="http://data.fandung.com/blog/demo/tooltip-recentposts/System_Tooltip.js" type="text/javascript"></script>

4. Tạo widget HTML/Javascript và dán đọan code bên dưới vào :

<style type="text/css">
#rc-posts-2-col {
width:320px;
}
#rc-posts-2-col h3 {
background:url(http://data.fandung.com/blog/demo/tooltip-recentposts/img-bg-rd.png) no-repeat top left;
padding:3px 5px 14px 5px;
font-size:13px;
color:#fff;
}
table#rc-2cot {border-top:1px solid #ccc;border-bottom:1px solid #ccc; border-left:1px solid #ccc;}
#rc-tr1 {background:#f3f3f3;}
#rc-tr0 {background:#fff;}
#rc-td {padding:2px; color:#CC0000; border-right:1px solid #ccc;width:160px;}
#rc-td img {float:left; margin-right:2px; height:50px; width:50px; border:1px solid #ccc; padding:1px;}
#rc-td a {text-decoration:none;}
#rc-td a:hover {text-decoration:underline;}
</style>

<script type="text/javascript">
home_page = "http://www.fandung.com/";
label = "Thu%20Thuat%20Blog";
numposts = 12;
postcount = 400;
sumTitle = 40;
colortitle = "#555";
tcolortitle = "#ff6c00";
cmcolor = "#6b1f01";
nocmtext = "No Comment";
cmtext = "Comments";
posttext = "Posted in";
</script>

<div id="rc-posts-2-col"><h3>Recent Posts with tooltip</h3>
<div id="rc-posts-loading">
<img align='absmiddle' src='http://data.fandung.com/img/loading-related.gif'/>
</div>
<script src="http://data.fandung.com/blog/demo/tooltip-recentposts/tooltip-rc-post-2cot.js" type="text/javascript"></script>
</div>

- Ở bài viết mở rộng này, chỉ có thêm các biến mới là :
postcount = 400; //số kí tự của đọan nội dung tóm tắt bài viết
tcolortitle = “#ff6c00″; // màu của tiêu đề bài viết ở phần mô tả
cmcolor = “#6b1f01″; // màu của phần thông tin bài viết (gồm : ngày đăng và số nhận xét)

còn các biến : nocmtext, cmtext, posttext các bạn có thể thay thế bằng các đọan text khác tùy ý bạn.

- Nếu muốn hiển thị bài viết mới cho cả blog, các bạn thay file js ở trên lại thành file bên dưới :

http://data.fandung.com/blog/demo/tooltip-recentposts/tooltip-rc-post-2cot-all.js

5. Save widget lại để hòan thành.

Tạm thời widget này sẽ chỉ hiển thị được 1 cái ở 1 trang mà thôi, nếu bạn nào hiển thị 2 widget này trên 1 trang sẽ gặp 1 số trục trặc. Tất nhiên là với những người am hiểu 1 chút về javascript thì vấn đề này ko có gì đáng ngại. Mình chỉ lưu ý với 1 số bạn chưa rành về js.
Update : Recent posts with Tooltip (1 cột)

Theo yêu cầu của 1 số bạn, mình đã fix lại thủ thuật này với 1 cột hiển thị.
Xem DEMO : Recent posts with tooltips (1 cột)

Hình ảnh minh họa :
 
* Để thực hiện, các bạn chỉ cần điều chỉnh 1 vài đọan code như bên dưới :
Code CSS :

#rc-posts-2-col {
width:220px; /*Thay đổi giá trị này cho phù hợp với độ rộng của sidebar ở blog của bạn*/
}
#rc-td {padding:2px; color:#CC0000; border-right:1px solid #ccc;width:220px;} /*thay đổi giá trị 220px bằng với giá trị đã thay đổi ở trên*/

Code javascript :

thay đổi giá trị của biến :
sumTitle = 60;
cho phù hợp

Thay link file javascript của thủ thuật thành link bên dưới là ok :
http://data.fandung.com/blog/demo/tooltip-recentposts/tooltip-rc-post-1cot.js (dùng cho 1 nhãn)
http://data.fandung.com/blog/demo/tooltip-recentposts/tooltip-rc-post-1cot-all.js (dùng cho cả blog)

Với 1 chút thay đổi nhỏ như vậy bạn đã có thể có 1 tiện ích recent posts with tooltip với 1 cột hiển thị.
Chúc các bạn thành công.
Nguồn mothuthuat.com

Album Kiếp Tằm (Vol.3)-Khưu Huy Vũ

Bảo vệ Gmail với 2 cấp mật khẩu

Google vừa cho ra mắt một tính năng mới , giúp bạn có thể bảo tài khoản của bạn một cách có thể nói là rất an toàn, nó được ví như là một “Pháo đài số ” . Với việc sử dụng tính năng này thì cho dù bạn bị đánh cắp mật khẩu cũng không lo bị người khác đọc thư và chiếm đoạt tài khoản Gmail.
Chỉ với 10 bước sau đây tài khoản của bạn sẽ được bảo đảm an toàn ngay cả khi bị đánh cắp mật khẩu.

Bước 1 :

Sau khi đăng nhập vào Gmail bạn cần phải vào phần cài đặt và chọn lại ngôn ngữ là tiếng anh

Chọn lại ngôn ngữ

Bước 2 :

Sau khi thay đổi lại ngôn ngữ, bạn vào lại phần Setting và chọn Accounts and Import tiếp theo là chon Other Google account settings

Chọn Other Google Account Settings

Bước 3 :

Sau khi chọn, trình duyệt sẽ đưa bạn sang một trang mới.  và chọn Using 2-step Vertification

Chọn Using 2-step Vertification

Bước 4:

Tiếp tục chọn Set up 2-step verification

Chọn Set up 2-step verification

Bước 5:

Trang web tiếp tục hiện ra và bạn hãy điền số điện thoại của mình vào và chọn dạng gửi code là SMS text . Tiếp tục bấm vào phần Send code, và đợt hệ thống gửi mã xác nhận tới máy di động của bạn và điền mã đó vào ô thứ 2 rồi chọn  Verify

Điền số điện thoại và xác nhận

Bước 6:

Khi trang web chuyển sang phần tiếp theo . Hệ thống hỏi bạn có muốn tạo code dự phòng không. Và bạn hãy chọn Next để tiếp tục

Bước 7:

Sau khi bấm vào Next . Hệ thống sẽ tạo cho mạn 10 mã số ngẫu nhiên , bạn hãy lưu hoặc in nó ra giấy .

Lưu mã hoặc in ra giấy

Bước 8:

Tiếp tục điền một số điện thoại khác vào để đề phòng khi điện thoại của bạn không liên lạc được hoặc bị mất. ( Nên chọn số máy bàn). Tiếp theo bạn chọn Automated voice message. Chọn Send code , Google sẽ tự động thực hiện một cuộc gọi đến máy bàn của bạn và đọc 5 số để xác nhận. Sau khi điền xong 5 số bạn hãy bấm vào Verify và tiếp tục bấm Next

Chọn máy bàn

Bước 9:

Một bảng thiết lập thành công , và bạn tiếp tục chọn NEXT

Thiết lập thành công

Bước 10:

Sau đó, hệ thống sẽ hiển thị nút chức năng Turn on 2-step verification . Một bảng thông báo hiện ra hỏi bạn có muốn sử dụng chức năng này không. Thì bạn hãy bấm vào OK

Kích hoạt chức năng

Cuối cùng hệ thống sẽ đưa bạn sang trang đăng nhập. Sau khi đăng nhập hệ thống tiếp tục gửi 1 mã để xác minh qua điện thoại di động của bạn và hãy điền mã số đó vào .

Sau khi xác minh , trang web sẽ đưa bạn đến phần cấu hình cho tài khoản của bạn. Bao gồm số điện thoại và 10 mã ngẫu nhiên.

Cấu hình

Như vậy chỉ sau 10 bước làm đơn giản tài khoản của bạn đã được bảo vệ bằng hai lớp mật khẩu chắc chắn. Kẻ xâm nhập khó lòng mà nhăm nhe tài khoản của bạn cho dù kẻ đó biết mật khẩu của bạn là gì.

Chú ý

Nếu như bạn không nhận được tin nhắn SMS hoặc điện thoại hãy làm theo cách sau

Chọn Other ways to get a verification code

và một bảng thông báo nữa hiện ra. Bạn hãy lữa chọn cái nào thích hợp với mình nhất ( Nên sử dụng mã dự phòng)

Nguồn Skynetvn.com