Bài đăng

Hiển thị các bài đăng có nhãn Javasciprt

Cách thêm reaction facebook vào blogger thật dễ dàng

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách thêm tính năng facebook reaction vào blogger đơn giản. Cách Thực Hiện Bước 1 : Dán đoạn CSS bên dưới vào trước thẻ ]]></b:skin> .options{background:white;width:70px;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,0.08),0 2px 2px rgba(0,0,0,0.15);box-shadow:0 0 0 1px rgba(0,0,0,0.08),0 2px 2px rgba(0,0,0,0.15);border-radius:20px;padding:10px 13px;font-size:0;font-family:Helvetica;font-weight:bold;color:#7f7f7f;position:relative;cursor:pointer;text-align:center;left:100px} .options .button{font-size:12px;vertical-align:middle;float:none} .options::before{content:"";display:inline-block;vertical-align:middle;height:24px;width:26px;margin-right:4px;background-image:url(https://i.imgur.com/wFbNEKl.png);background-size:156px 24px} .options::before .reactions{opacity:1;-webkit-transition:0.1s 0.5s;transition:0.1s 0.5s} .options .reactions .icon-container:hover{-webkit-transform:scale(1.3,1.3) tr

Share bộ tài liệu lập trình Javascript cơ bản cho những bạn mới bước chân vào lập trình

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ bộ tài liệu học Javasciprt cơ bản nhất và dễ hiểu. Mình sẽ cố gắng ra nhiều bài tài liệu về lập trình nhất có thể, mong các bạn vẫn ủng hộ và ghé website nhiều hơn những tài liệu mình share điều được miễn phí và hữu ích cho những bạn mới bước chân vào lập trình. Tài liệu bào gồm 1. Javascript 2. Code Link download Link có quảng cáo (Các bạn có thể dành chút thời gian, bấm button link sau có kèm quảng cáo 7s. Ủng hộ chút kinh phí duy trì website nhé. Cám ơn các bạn nhiều) Download

Sử dụng Ajax Javascript tạo phân trang tự load giống Facebook

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ thủ thuật cách làm phân trang tự load khi bạn cuốn tới giống facebook. Cách thực hiện Thêm tất cả code bên dưới vào trước thẻ </body> <script type='text/javascript'> //<![CDATA[ !function(i){function e(e){i.getScript("http://"+e+".disqus.com/blogger_index.js")}function t(){g||(g=!0,r?(w.find("a").hide(),w.find("img").show(),i.ajax(r,{dataType:"html"}).done(function(t){var n=i("<div></div>").append(t.replace(c,"")),o=n.find("a.blog-pager-older-link"),d=n.find(s).children();i(s).append(d),window._gaq&&window._gaq.push(["_trackPageview",r]),window.gapi&&window.gapi.plusone&&window.gapi.plusone.go&&window.gapi.plusone.go(),window.disqus_shortname&&e(window.disqus_shortname),window.FB&&window.FB.XFBML&&window.FB.XFBML.parse&&am

Bộ tài liệu ngôn ngữ javascript full tiếng việt

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ bộ tài liệu Javascrip Full Tiếng Anh rất hữu ích cho các bạn mới tập. Link download: Download

Hướng dẫn cách ngăn chặn bình luận từ ngữ thô tục bằng Javascript cho Blog

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách ngăn chặn những bình luận thô tục với JavaScript Cách làm như sau Bước 1: Truy cập Blog ==> Chủ đề ==> Chỉnh Sửa HTML Bước 2: Thêm đoạn code bên dưới vào trước thẻ </body> <script type='text/javascript'> //<![CDATA[ function replaceText(){if(!document.getElementById){return;} bodyText = document.getElementById("comments"); theText = bodyText.innerHTML; theText = theText.replace(/lồn/gi, "*"); theText = theText.replace(/cặc/gi, "*"); theText = theText.replace(/buồi/gi, "*"); theText = theText.replace(/dái/gi, "*"); theText = theText.replace(/địt/gi, "*"); bodyText.innerHTML = theText; }replaceText(); //]]> </script> Chỉnh sửa tùy ý Dấu (*) có thế chỉnh dấu theo ý các bạn. Nếu bạn muốn chặn thêm ngôn ngữ thô tục thì thêm đoạn code bên dưới vào trong đoạn JS bên trên theText = theText.replace(/quidz/gi, &

Hướng dẫn tạo trang chờ chuyển hướng với liên kết ngoài cho Blog

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách trang chuyển hướng khi vào liên kết bên ngoài. Tác dụng: Khi bạn click vô link thì sẽ chuyển qua trang hạn chờ, sẽ có 1 nút button từ chối nếu bấm vào sẽ tắt tab nếu không sẽ tự chuyển qua trang bạn muốn đến sau 10 giây Cách làm Bước 1: Truy cập Blog ==> Trang ==> Trang mới ==> đặt tên cho trang Bước 2: Chuyển sang HTML ==> Dán đoạn code bên dưới vô khung HTML <b:if cond="data:view.isSingleItem" style="position: relative; top: -40px;"> <style> #button1{background-color:#4CAF50;border:none;border-radius:4px;color:white;padding:7px 14px;text-align:center;text-decoration:none;display:inline-block;font-size:14px;cursor:pointer}#button2{background-color:#008CBA;border:none;border-radius:4px;color:white;padding:7px 14px;text-align:center;text-decoration:none;display:inline-block;font-size:14px;cursor:pointer}.footer-credits{display:none} .container1, .timeline_m

Hướng dẫn cách tạo đồng hồ (clock) với javasrcipt cho Blog

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ code đồng hồ thời gian. CÁCH LÀM Bước 1: Truy cập Blog ==> Thêm code bên dưới vào trước </body> <script type='text/javascript'> //<![CDATA[ var _0x86c1=["\x63\x61\x6E\x76\x61\x73","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x32\x64","\x67\x65\x74\x43\x6F\x6E\x74\x65\x78\x74","\x68\x65\x69\x67\x68\x74","\x74\x72\x61\x6E\x73\x6C\x61\x74\x65","\x62\x65\x67\x69\x6E\x50\x61\x74\x68","\x50\x49","\x61\x72\x63","\x66\x69\x6C\x6C\x53\x74\x79\x6C\x65","\x77\x68\x69\x74\x65","\x66\x69\x6C\x6C","\x63\x72\x65\x61\x74\x65\x52\x61\x64\x69\x61\x6C\x47\x72\x61\x64\x69\x65\x6E\x74","\x23\x33\x33\x33","\x61\x64\x64\x43\x6F\x6C\x6F\x72\x53\x74\x6F\x70","\x73\x74\x72\x6F\x6B\x65\x53\x74\x79\x6C\x65","\x6C\x69\x6E\x65\x57

Hướng dẫn tạo trang "Trình Tạo Liên Kết Thẻ A (HTML)" Cho Blog

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách tạo trang "Trình Tạo Liên Kết Thẻ A (HTML)" Cho Blog giống NGUYENNGOCQUIDZ.TK DEMO Tác dụng: Tạo ra thẻ A (cho những bạn lười viết code) Cách làm: Bước 1: Truy cập Blogger ==> Chủ đề ==> Chỉnh sửa HTML. Bước 2: Ctrl + F ==> Chèn đoạn code dưới vào sau ]]></b:skin> .taolinkhtml{margin-top:30px;background:#355c7d!important; width: 703px; margin-left: 452px;} Bước 3: Thêm đoạn code dưới vào trước thẻ </body> <script type='text/javascript'> //<![CDATA[ // HTML links. var urla = document.getElementById('link'), linkText = document.getElementById('text'), output = document.getElementById('output'); outputc = document.getElementById('outputc'); result = document.getElementById("result"); var textCounta = 0; var textCountb = 0; function link(urli,text) { return ' <a href="' + urli

Bộ Meta SEO Open Graph & Twitter Cards Chuẩn SEO

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ Meta SEO Open Graph & Twitter Cards Chuẩn SEO Open Graph Meta <!-- Open Graph Meta --> <meta property="og:title" content="NGUYỄN NGỌC QUÍ ĐZ | Thủ Thuật Blog & Thủ Thuật Facebook" /> <meta property="og:description" content="Quí Đz" /> <meta property="og:url" content="https://www.nguyenngocquidz.tk/" /> <meta property="og:image" content="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioMMiLU2aoUMbmC3E5Y-Kj_6JYOnk5oHKH1VI8vFcZA-02zFzQp5ls32DJ6jG-IzgwZUzU1VfEJAIw-qmTYrbXSQLPv8XWyRWDEW7Zq7xYlD7MOrmGiBmtjtZLnSod7YPoP2GbjgmcRB4/s1600/Logo.png"/> Twitter Cards <!-- Twitter Cards --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@nguyenngocquiTK"> <meta name="twitter:creator

Cách làm phân trang dạng Load More cho Blog với Ajax Jquery Version 3.1.1

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách làm phân trang dạng Load More cho Blog với Ajax Jquery Version 3.1.1.             Cách làm phân trang dạng Load More CÁCH THỰC HIỆN Bước 1: Truy Cập Blogger ==> Bố cục ==> Thêm tiện ích (để tiện ích đấy dưới phần "Bài đăng trên blog") ==> HTML/JavaScript Bước 2: Sap chép Code bên dưới dán vào khung HTML/JavaScript <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js'></script><script type='text/javascript'> (function(a){function h(){g||(g=!0,d?(b.find("a").hide(),b.find("img").show(),a.ajax(d,{dataType:"html"}).done(function(c){var c=a("<div></div>").append(c.replace(j,"")),e=c.find("a.blog-pager-older-link");e?d=e.attr("href"):(d="",b.hide());c=c.find(i).children();a(i).append(c);window._gaq&&window

Tạo Widgets Bài VIết Ngẫu Nhiên Cho Blogspot

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách Tạo Widgets Bài VIết Ngẫu Nhiên Cho Blogspot Bước 1: Truy cập blog ==> Bố cục ==> Thêm tiện ích ==> HTML/JavaScript ==> Dán đoạn code bên dưới vào khung HTML <style> /*random posts*/ #random-posts img{float:left;margin-right:10px; background:#FFF;width:50px;height:50px; border-radius: 50%} .li_rd_post_tkn {margin-bottom: 7px!important; list-style: none; line-height: 23px; padding: 0!important; margin-top: 0!important; margin-left: 0!important; margin-right: 0!important} .a_rd_post_tkn { color: #000!important; text-decoration: none!important; font-family: Roboto; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .svc_rd_post { font-size: 14px; font-family: Roboto; font-weight: 400; color: #878787; padding-top: 3px } .rcs_tkn1 { background: #f4f4f4; padding: 2px; padding-left: 10px; padding-right: 10px; border-rad

Cách Tạo Trang Báo Lỗi "Error 404" Giống Quí Đz Cực Ngầu

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách trang báo lỗi error giống Nguyễn Ngọc Quí Đz, cực ngầu và độc. Bước 1: Chèn đoạn code bên dưới sau thẻ <body> HTML/ CSS <b:if cond='data:blog.pageType == &quot;error_page&quot;'><style>body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:100vh;font-family:&quot;Bad Script&quot;,cursive;font-size:16px;background:#f2f2f2} .wrap-404{overflow:hidden;padding:2rem 1rem} .label{text-align:center;font-size:.75em} .numbers{padding:2rem 0 0;text-align:center} .number{position:relative;display:inline-block;width:150px;-webkit-transform:translateX(60%);transform:translateX(60%)} .four{position:relative;width:30px;height:150px;border:1px solid #000} .four::before,.four::after{content:&#39;&#39;;position:absolute;

Cách Tạo Nút Button Hiệu Ứng Hover Cực Đẹp Cho Blogger

Hình ảnh
Xin chào các bạn mình đã quay lại rồi đây đã lâu rồi mình không đăng bài thì hôm nay mình xin chia sẻ chút thủ thuật nhỏ, tạo nút button với hiệu ứng hover cực đẹp cho blogger Tạo Button Hiệu Ứng Hover Cực Đẹp Bước 1: thêm CSS trước thẻ ]]></b:skin> CSS /* Hover Button */ .btn-quidz { display: flex; height: 100%; justify-content: center; align-items: center; } .btn-quidz { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .hover-button { color: white; font-family: 'Roboto', helvetica; background-color: dodgerblue; border: 0; border-radius: 0.5rem; padding: 1rem 2rem; font-size: 1rem; cursor: pointer; letter-spacing: 4px; font-weight: 100; text-transform: uppercase; -webkit-box-shadow: 16px 26px 35px 0px rgba(0, 0, 0, 0.3);

Cách tạo trang báo lỗi 404 giống Twitter cực ngầu

Hình ảnh
Xin chào các bạn mình đã quay lại rồi đây đã lâu rồi mình không đăng bài thì hôm nay mình xin chia sẻ chút thủ thuật nhỏ, tạo trang báo lỗi 404 giống Twitter cực ngầu. Tạo Trang Báo Lỗi 404 Giống Twitter Bước 1: Chèn đoạn code bên dưới sau thẻ <body> <b:if cond='data:blog.pageType == &quot;error_page&quot;'> <style> body {overflow:hidden!important} #fb-error-page{position:relative;display:table;width:100%;height:100vh;margin:0!important;padding:0!important;z-index:999;background:#1DA1F3;} .fb-error-page_content{position:relative;z-index:3} .intro_label h2{font-size:40px;font-weight:500;color:#fff;font-family:&quot;Roboto&quot;,sans-serif;} .intro_label p{font-size: 16px; font-weight: 400; color: #f3f3f3; margin: 0; padding: 0; letter-spacing: 2px} .intro_label{margin:0 auto;text-align:center;padding:2} .btn-error-page {color: #fff!important; display: inline-block; margin: 1.5em 3px; font-size: 14px; font-weight: 500;} .btn-error-page:after{co

Hiển thị nội dung trong suốt trên thumbnail đơn giản và đẹp

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ tới các bạn 1 hiệu ứng đẹp nhưng vô cùng đơn giản. Đó là hiện đoạn text trong suốt trên thumbnail. Thủ thuật chỉ dùng CSS và HTML, không có Javascript nên không ảnh hưởng nhiều đến tốc độ tải trang. Bước 1: Đăng nhập Blogger ==> Bố cục ==> Thêm tiện ích ==> HTML/Javascript Bước 2: Dán đoạn code bên dưới vào khung HTML ==> Lưu <style> *{box-sizing:border-box;}.container{position:relative;max-width:800px;margin:0 auto;}.container img{vertical-align:middle;}.container .content{position:absolute;bottom:0;background:rgba(0,0,0,0.5);color:#f1f1f1;width:100%;padding:10px;}.content {opacity: 0.7;} </style> <div class="container"> <img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3BWrj2bj90apxpSCOcvMtCodkqPl8IF5HiUL4Ixv1btFqV2J-M9A47Erff2_29txdM7-Eb82gThYNX0QxWpmXa5sTgs7BMVS3bMhhfLlR4eOdqR_pJT14dXKzoggSNAJKgaCuGGS-o0Q/s1600/Qu%25C3%25AD+%25C4%

Cách Thêm Popular Posts (bài đăng phổ biến) với hiệu ứng Đẹp Và Chuyên Nghiệp cho blogspot

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách thêm tiện ích Popular Posts (bài đăng phổ biến) với hiệu ứng đẹp và chuyên nghiệp cho blogspot. Cách Tạo Hiệu Ứng Popular Posts CÁCH THỰC HIỆN Bước 1: Vào Blog - Bố cục - Thêm tiện ích - Bài đăng phổ biến Các bạn chọn 10 bài và đặt tên cho tiện ích xong lưu Bước 2: Chèn đoạn CSS bên dưới trước thẻ ]]></b:skin> /* CSS PopularPosts */ .left{float:left;text-align:left} .right{float:right;text-align:right} .center{text-align:center} #PopularPosts1 ul{padding:0;margin-top:10px;counter-reset:popcount} #PopularPosts1 ul li{position: relative; height: 60px; padding-left: 45px; line-height: 20px;} #PopularPosts1 ul li:last-child{height:44px} span.title-top{margin-top:-3px;font-size:15px;line-height:20px;float:left;max-height:40px;overflow:hidden} #PopularPosts1 ul li:before{content:counter(popcount,decimal);counter-increment:popcount;text-align:center;list-style-type:none;position:absolute;display:

Cách đăng ký tài khoản Google AdSense cho Website/Blog

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách đăng ký tài khoản Google Adsense kiếm tiền online Adsense là một kênh kiếm tiền online cực tốt tại Việt Nam ở thời điểm hiện tại. Có vài cách đăng ký Google Adsense như đăng ký trên điện thoại, đăng ký trên nền web hay còn gọi là trên máy tính... trong bài viết này Taimienphi.vn sẽ hướng dẫn các bạn cách khác nhau để đăng ký AdSense một cách chi tiết nhất kèm theo hình ảnh để những người mới có thể thuận lợi hơn khi thực hiện. Google Adsense là 1 công cụ không còn xa lạ gì với dân kiếm tiền online, đây là công cụ kiếm tiền quảng cáo hàng đầu của Google. Adsense là dịch vụ quảng cáo trực tuyến phổ biến nhờ nội dung phù hợp, tương thích cao với các website so với cách quảng cáo truyền thống qua banner, adsense có nhiều cách để giúp bạn kiếm tiền và một trong số đó chính là Youtube, người dùng mới có thể tham khảo thêm hướng dẫn đăng ký Gmail bởi Gmail cũng chính là tài khoản Google được sử dụng cho

Cách thêm bài viết liên quan đẹp và chuyên nghiệp cho blogspot

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách thêm bài viết liên quan dưới chân bài viết đẹp và chuyên nghiệp cho blogspot Cách thêm bài viết liên quan

Cách viết bài chuẩn SEO cho Blogspot

Hình ảnh
Xin chào các bạn, đã đến với blog của mình hôm nay ở bài viết này mình xin chia sẻ cách viết bài chuẩn SEO Cách viết bài chuẩn SEO cho Blogspot (Blogger) thì các mục chính chúng ta cần nắm bắt khi viết bài trên Blogspot: Chỉnh sửa liên kết cố định Tối ưu tiêu đề và mô tả Thẻ Heading Tối ưu thẻ mô tả hình ảnh 1. Tối ưu link để tối ưu link cho bài viết thì ở bài đăng bên góc phải bạn chọn liên kết - liên kết cố định tùy chỉnh - nhập link. Link có chứa từ khóa cần seo Mỗi từ cách nhau bằng dấu gạch ngang (-), không dấu Hạn chế viết hoa và ký tự đặc biệt 2. Tối ưu tiêu đề và mô tả Thẻ tiêu đề (Title) và mô tả (Meta Description) là 2 thẻ khá quan trọng khi bạn viết bài cho blog. Hai thẻ mô tả và tiêu đề là các nội dung được hiển thị trên trang kết quả tìm kiếm của google. Do vậy các bạn cần chú ý tối ưu hai thẻ này để bài viết được lên top cao hơn. Thẻ tiêu đề, thường các template sẽ có cấu trúc thẻ title như sau: “Tên bài đăng – Tên website của bạn“. Do vậy khi viết bài mục Tiêu đề bài đăn