Description

Ap ke liye ye code he is ki madad sy ap apni site ky tmam user or vewer sy contect me reh skty ho or wo ap sy easly contect kr skta he bus ap ne ye code lgana he or apna no add krna he os ke bad jo b user start chat pr clik kry ga wo ap ki id me ajae ga or ap sy contect kr ly ga ..

Features

• Responsive
• Google Testing Tool Validator
• Mobile Friendly
• Dynamic Heading
• simple load
• Valid Schema.org
• High CTR
• Personal Blog
• 2 Column Grid
• Responsive Ad Slot
• Footer Link
• Social Share Button
• Back to Top Button
• Unlimited Page Numbered

Note:

Note: ye Live chate box ka code bilkol free he or bohat zyada easy he is ki full detail nichy add he  .

Download

Free DownloadHereDonateBank/EasyPaisaHere

Preview

Template Details

• Name Whatsapp chat live code 
• File Theme & Documentation
• Layout Responsive
• Editing Zubair Ahmed
• Designer Themes Collections

Template Future

• Remove Footer Credits
• No Payment
• No Encrypted Or Hide Scripts
• Lifetime Update
• For Unlimited Domains
• And Much More...

Hello friends If you want to like this start in WhatsApp Chat box  So follow this post.

ADD FACEBOOK LIVE CHAT PLUGIN INTO BLOGGER

1. Step 1: Log in to your Blogger Account and Go to your Blogger Dashboard
2. Step 2: Go to Blogger Layout section.
      Step 3: Click This Theme Option 
3. Step 4: Click Edit HTML Option 

Step 5: This code will open in front of you Clink HTML Code And Press  CTRL+F Open Search Box And Type This Code   ]]></b:skin   

/* CSS Multiple Whatsapp Chat */ #whatsapp-chat{position:fixed;background:#fff;width:350px;border-radius:10px;box-shadow:0 1px 15px rgba(32,33,36,.28);bottom:90px;right:30px;overflow:hidden;z-index:99;animation-name:showchat;animation-duration:1s;transform:scale(1)} a.blantershow-chat{background:linear-gradient(to right top,#6f96f3,#164ed2);color:#fff;position:fixed;z-index:98;bottom:25px;right:30px;font-size:15px;padding:10px 20px;border-radius:30px;box-shadow:0 1px 15px rgba(32,33,36,.28)} a.blantershow-chat i{transform:scale(1.2);margin:0 10px 0 0}.header-chat{background:linear-gradient(to right top,#6f96f3,#164ed2);color:#fff;padding:20px} .header-chat h3{margin:0 0 10px}.header-chat p{font-size:14px;line-height:1.7;margin:0} .info-avatar{position:relative}.info-avatar img{border-radius:100%;width:50px;float:left;margin:0 10px 0 0} .info-avatar:before{content:'\f232';z-index:1;font-family:"Font Awesome 5 Brands";background:#23ab23;color:#fff;padding:4px 5px;border-radius:100%;position:absolute;top:30px;left:30px} a.informasi{padding:20px;display:block;overflow:hidden;animation-name:showhide;animation-duration:2.5s} a.informasi:hover{background:#f1f1f1}.info-chat span{display:block}#get-label,span.chat-label{font-size:12px;color:#888} #get-nama,span.chat-nama{margin:5px 0 0;font-size:15px;font-weight:700;color:#222}#get-label,#get-nama{color:#fff}span.my-number{display:none} .blanter-msg{color:#444;padding:20px;font-size:12.5px;text-align:center;border-top:1px solid #ddd} textarea#chat-input{border:none;font-family:'Arial',sans-serif;width:100%;height:20px;outline:none;resize:none} a#send-it{color:#555;width:40px;margin:-5px 0 0 5px;font-weight:700;padding:8px;background:#eee;border-radius:10px} .first-msg{background:#f5f5f5;padding:30px;text-align:center} .first-msg span{background:#e2e2e2;color:#333;font-size:14.2px;line-height:1.7;border-radius:10px;padding:15px 20px;display:inline-block} .start-chat .blanter-msg{display:flex}#get-number{display:none}a.close-chat{position:absolute;top:5px;right:15px;color:#fff;font-size:30px} @keyframes showhide{from{transform:scale(.5);opacity:0}}@keyframes showchat{from{transform:scale(0);opacity:0}} @media screen and (max-width:480px){#whatsapp-chat{width:auto;left:5%;right:5%;font-size:80%}} .hide{display:none;animation-name:showhide;animation-duration:1.5s;transform:scale(1);opacity:1} .show{display:block;animation-name:showhide;animation-duration:1.5s;transform:scale(1);opacity:1}

After pressing ]]></b:skin  You will be Highlight This Code .  paste this code into the upper (first) to make it stand still.And Save This Theme 

After Save This Theme  now you are back again Ctrl + F Press Do it  </body>  Search To do And then (earlier) just pasted this code and put it And Save And back to sleep.


<script type='text/javascript'> //<![CDATA[ /* Whatsapp Chat Widget by https://www.templatescollection.com */ $(document).on("click","#send-it",function(){var a=document.getElementById("chat-input");if(""!=a.value){var b=$("#get-number").text(),c=document.getElementById("chat-input").value,d="https://web.whatsapp.com/send",e=b,f="&text="+c;if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))var d="whatsapp://send";var g=d+"?phone="+e+f;window.open(g, '_blank')}}),$(document).on("click",".informasi",function(){document.getElementById("get-number").innerHTML=$(this).children(".my-number").text(),$(".start-chat,.get-new").addClass("show").removeClass("hide"),$(".home-chat,.head-home").addClass("hide").removeClass("show"),document.getElementById("get-nama").innerHTML=$(this).children(".info-chat").children(".chat-nama").text(),document.getElementById("get-label").innerHTML=$(this).children(".info-chat").children(".chat-label").text()}),$(document).on("click",".close-chat",function(){$("#whatsapp-chat").addClass("hide").removeClass("show")}),$(document).on("click",".blantershow-chat",function(){$("#whatsapp-chat").addClass("show").removeClass("hide")}); //]]> </script>

And Goto  Layout Section And Click Add A Gadget Select  Html/Java Script Tab .

Html / Java Script Open it, paste this code into And Save Now

<div id='whatsapp-chat' class='hide'> <div class='header-chat'> <div class='head-home'> <h3> Hello!</h3> <p> Click one of our representatives below to chat on WhatsApp or send us an email to rioblanter@gmail.com</p> </div> <div class='get-new hide'> <div id='get-label'> </div> <div id='get-nama'> </div> </div> </div> <div class='home-chat'> <!-- Info Contact Start --> <a class='informasi' href='javascript:void' title='Chat Whatsapp'> <div class='info-avatar'> <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfu9_f_JPCg8YkafkHDAI5Ek86UA_XEUGMxqFbnD6KDSdsIbLvHGcOmVNsAYckGfdqSVjlHcweCphgrprAbw6Sdq5HoPlIHEQ241FCFZb_Xp_lQVQXaPMttT38BYKfw42KXjHP7Pg2DrM/s70/supportmale.png'/></div> <div class='info-chat'> <span class='chat-label'>Support</span> <span class='chat-nama'>Customer Service 1</span> </div> <span class='my-number'>923451416173</span> </a> <!-- Info Contact End --> <!-- Info Contact Start --> <a class='informasi' href='javascript:void' title='Chat Whatsapp'> <div class='info-avatar'> <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglbFAScDt-S6byYQYMcODty_YKBbSdeC39MRf8Ak01cCowScFkcGirUIWuy66A3Bx95iucWRrM2AsDaFda3GzTMbve8GjsyX0rw8bQICgIflZ9A1dA28d2aaY21Q4hxihfXWpIHh1d9Y8/s70/supportfemale.png'/></div> <div class='info-chat'> <span class='chat-label'>Sales</span> <span class='chat-nama'>Customer Service 2</span> </div> <span class='my-number'>923451416173</span> </a> <!-- Info Contact End --> <div class='blanter-msg'> Call us to <b>+62123456789</b> from <i>0:00hs a 24:00hs</i></div> </div> <div class='start-chat hide'> <div class='first-msg'> <span>Hello! What can I do for you?</span></div> <div class='blanter-msg'> <textarea id='chat-input' placeholder='Write a response' maxlength='120' row='1'>

Change your mobile number in this code. And put the pouch to sleep. Now look at your blog page and look up your WhatsApp chat button On Thanks