Chuyển đến nội dung chính

Thêm Khung Liên Lạc Bên Tay Trái Cho WebBlog


Hôm nay Hùng Coder hướng dẫn cho các bạn một đoạn code khá hay cho các bạn bán hàng online hay tự vấn hổ trợ trực tiếp :), một dạng như chat online nhưng lại có thể gọi điện hoặc nhắn tin cho người đó ^^~.


Nếu bạn nào cần thì có thể bỏ đoạn code bên dưới và bỏ trên thẻ : </body> và lưu lại.

<!-- Support online hungcoder.com -->
<link href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css' rel='stylesheet'/>
<style>
.support-online{position:fixed;z-index:999;left:1%;bottom:11%}
.support-online a{position:relative;margin:20px 10px;text-align:left;width:40px;height:40px}
.support-online i{width:40px;height:40px;background:#43a1f3;color:#fff;border-radius:100%;font-size:20px;text-align:center;line-height:1.9;position:relative;z-index:999}
.support-online a span{border-radius:2px;text-align:center;background:#67b634;padding:9px;display:none;width:180px;margin-left:10px;position:absolute;color:#fff;z-index:999;top:0;left:40px;font-size:14.5px;transition:all .2s ease-in-out 0;-moz-animation:headerAnimation .7s 1;-webkit-animation:headerAnimation .7s 1;-o-animation:headerAnimation .7s 1;animation:headerAnimation .7s 1}
.support-online a:hover span{display:block}
.support-online a{display:block}
.support-online a span:before{content:&quot;&quot;;width:0;height:0;border-style:solid;border-width:10px 10px 10px 0;border-color:transparent #67b634 transparent transparent;position:absolute;left:-10px;top:10px}
.kenit-alo-circle-fill{width:60px;height:60px;top:-12px;position:absolute;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid transparent;-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;transition:all .5s;background-color:rgba(0,175,242,0.5);opacity:.75;right:-12px}
.kenit-alo-circle{width:50px;height:50px;top:-6.5px;right:-6.5px;position:absolute;background-color:transparent;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;border:2px solid rgba(30,30,30,0.4);opacity:.1;border-color:#0089B9;opacity:.5}
.support-online .btn-support{cursor:pointer}
</style>
<div class='support-online'>
<div class='support-content'>
<a class='call-now' href='tel: 0868 7878 92' rel='nofollow'>
<i aria-hidden='true' class='fa fa-whatsapp'/>
<div class='animated infinite zoomIn kenit-alo-circle'/>
<div class='animated infinite pulse kenit-alo-circle-fill'/>
<span>Hotline: 0868 7878 92</span>
</a>
<a class='mes' href='https://www.facebook.com/messages/t/100002632149630'>
<i aria-hidden='true' class='fa fa-facebook-official'/>
<span>Nhắn tin facebook</span>
</a>
<a class='zalo' href='https://chat.zalo.me/'>
<i aria-hidden='true' class='fa fa-comment'/>
<span>Zalo: 0868 7878 92</span>
</a>
<a class='sms' href='sms:0868787892'>
<i aria-hidden='true' class='fa fa-weixin'/>
<span>SMS: 0868 7878 92</span>
</a>
</div>
<a class='btn-support'>
<i aria-hidden='true' class='fa fa-user-circle'/>
<div class='animated infinite zoomIn kenit-alo-circle'/>
<div class='animated infinite pulse kenit-alo-circle-fill'/>
</a>
</div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){

$('a.btn-support').click(function(e){
e.stopPropagation();
$('.support-content').slideToggle();
});
$('.support-content').click(function(e){
e.stopPropagation();
});
$(document).click(function(){
$('.support-content').slideUp();
});
});
//]]>
</script>
<!-- End Support -->
Và qua đoạn code trên bạn như thay đỗi những phần mình bôi đỏ trên đoạn code đó nhé :)


DEMO BÊN TAY TRÁI CỦA CÁC BẠN


Chúc các bạn thành công với thủ thuật này nhé :)



Nhận xét

  1. Trả lời
    1. Hehe, bt thôi e. Tại a thấy bên ông niệm cũng hay nên lách về đấy, chứ thực ra thì thủ thuật ấy ko thể đặt trên blog a :) vì 1 số lý do

      Xóa
  2. Ngon đấy, Blog ông nhìn tùm lum hết à :v

    Trả lờiXóa
    Trả lời
    1. hehe có cái gì liên quan đến html + css + javascript + vb.net là có ở blog tui thôi :) tui ko chọn lọc kỹ bài viết đâu. Thích gì viết nẫy thôi :D

      Xóa
  3. mỗi tội màu đen khó nhìn quá

    Trả lờiXóa
    Trả lời
    1. Màu xanh mà ông chứ có màu đen đâu ?

      Xóa
    2. màu đen đâu ông, màu sáng mà ;) chắc css nó cũng với cái gì trong css của blog ông mất r đấy :D

      Xóa
  4. Blog này ông tối ưu load chưa Hùng

    Trả lờiXóa
    Trả lời
    1. Chưa ông ạ, vì mình thấy nó load cũng ok rồi nên ko tối ưu? mà sao ông hỏi thế vậy ? ông có cách tối ưu load hả?

      Xóa
    2. Không ý tôi là nên sửa lại một chút cho tăng điểm speeg google

      Xóa
    3. hiện tại cái đó m đang mù bạn ạ vời là m` bận cho việc đi làm quá nên không có time nhiều để tối ưu cho lắm. Nên cứ để vậy xài tạm thôi :D

      Xóa
  5. Đổi màu footer đi Hùng, đen thùi lùi ko thấy chữ đâu cả

    Trả lờiXóa
    Trả lời
    1. Haiz gắng nhìn thôi chứ mình không có time nhiều để edit lại bạn ạ ! với lại m` cũng khá thích màu tối :D vì đơn giản hồi xưa m` cũng là 1 Black Hat :D :D

      Xóa
  6. có link demo thôi mà còn xài 123link

    Trả lờiXóa
    Trả lời
    1. Hehe. Đó ko phải là do m cài đặt đâu bạn nhé. Nó đã tự mặc định vì mình có đặt 1 đoạn script của nó vào blog r bạn ạ. :)

      Xóa
  7. Cuối năm rồi, kiếm được khoản nào bự ăn Tết chưa bác Hùng? :D

    Trả lờiXóa
    Trả lời
    1. Chưa ông ạ. Đi làm còng lưng mà đếu thấy tết là gì luôn r, còn quảng cáo trên site thì treo cho vui chứ ko có kết quả gì về mơ ni cả :(

      Xóa
    2. Uh năm nay lương thưởng bèo bọt,làm ăn thất thu. Tui cũng đói như con mèo hen đây :))

      Xóa
    3. Ngán lắm ông ạ :( tiền bạc ko có gái nào nó theo :(( chán quá. Biết khi nào H mới đc như CƯỜNG ĐÔ LA đây :))

      Xóa

Đăng nhận xét

Bài đăng phổ biến từ blog này

[Blogger] Gỡ bỏ bản quyền template Blogspot không bị chuyển hướng

Xin chào các blogger, hẳn khi làm blog bạn chẳng còn xa lạ gì những trang cung cấp template nổi tiếng như soratemplates, gooyaabitemplates,... đúng không. Mỗi khi bạn tải template về thường có 2 tùy chọn đó là bản free và bản premium. Sự khác biệt giữa chúng là quá rõ ràng kể đến như support hoặc mã hóa code,...


Dân nghèo như chúng ta thường chỉ chơi bản free thôi, và đương nhiên sẽ có nhiều template dính quả bản quyền thần chưởng, ở đó thì họ thường gắn tên vào cuối footer và khi ta xóa dòng đó đi web site sẽ tự động chuyển hướng tới trang chủ của họ. Nói chung ta không nên xóa bản quyền template đi vì đó thể hiện sự tôn trọng tới người đã tạo ra template cho ta sử dụng.

Còn trong khuôn khổ bài viết này hung1001 sẽ cùng bạn tìm hiểu cách gỡ và thêm bản quyền của bạn vào nếu như bạn thích.


Ở đây tôi làm mẫu với template Treasury của Sora bản free. Đây là dòng tác giả đã chèn bản quyền và có đoạn js điều hướng nếu dòng bị xóa


Nhiệm vụ của bạn đó là đi dò toàn bộ các đoạn mã js đã bị mã hó…

[Blogger] Tạo hiệu ứng tuyết rơi chào đón Noel cho blogspot

Noel sắp đến để tăng thêm hiệu ứng cho blog của bạn hãy thêm vào 1 chút hiệu ứng tuyết rơi để cho không khí thêm sôi động


Cách làm cực kì đơn giản:

Đăng nhập vào blogChọn mẫu và vào phần chỉnh sửa htmlBạn để đoạn code sau vào giữa cặp thẻ <body> ... </body>
<script src='https://cdn.rawgit.com/hung1001/blogspot/master/js/tuyetroi.js'/>

Code nhúng trực tiếp vào web không thông qua host

<script type="text/javascript">
//<![CDATA[
var snowmax=100
var snowcolor=new Array("#f2f8fa","#eff5f7","#dcedf1","#ffffff")
var snowtype=new Array("Times","Arial","Times","Verdana")
var snowletter="*"
var sinkspeed=1
var snowmaxsize=30
var snowminsize=20
// Set 1 for all-over-snowing, set 2 for left-side-snowing
// Set 3 for center-snowing, set 4 for right-side-snowing
var snowingzone=1
// Do not edit below this line
var snow=new Array()
var marginbottom
var marginright
var timer
var i_snow=0
v…

Share Template Mudah Grid Responsive.

Chào mọi người, dạo gần đây mình thấy có một bản mẫu blogspot đi kèm với một giao diện khá thân thiện nên mình cũng đem về rồi nhờ người anh em thân thiết xóa cái bản quyền template đi rồi share cho anh em dùng.  ƯU ĐIỂMLoad nhanhSEO tốtChuẩn responsiveRecent labelButton ShareFollow by emailBreadcrumbs...NHƯỢC ĐIỂMThì mình chưa tìm ra. Cách nhận template- Comment link share trên mạng xã hội ( tùy tâm ) - Comment mail phía dưới. Lưu ý: Bản này hoàn toàn đã xóa bản quyền rồi nhé.
Xem Demo