Helps In Hindi

  • Blogging
  • SEO
  • Adsense
  • Make Money
  • Mobile Tips
  • Sarkari Yojna
  • Amazing Facts
  • Skip to main content
  • Skip to primary sidebar
  • Skip to footer

Facebook Messenger Chat Widget Ko Blog/Website Me Kaise Add Kare

Posted By: Mangal Gupta Last Updated: Feb 20, 2019

Hello dosto aaj hum log janege ki Facebook Messenger Chat Widget Ko Blog/Website Me Kaise Add Kare. Asha karta hu aap ne bhi apne blog ya website ke liye. Facebook Page to jarur banaya hoga. Aur aap ke visitors aap ke facebook page par message bhi karte hoge. Magar us ke liye aap ke visitors ko aap ke facebook page par ja kar message karna hota hai. But agar aap apne blog ya website par hi facebbok messenger ka option dede. To aap ke visitors aap ki blog ya website se. Facebook messenger dwara app ke facebook page par direct message send kar shakte hai.

Facebook Messenger Chat Widget Ko Blog-Website Me Kaise Add Kare

Facebook Messenger ko apne blog ya website par add kar dene se. App ke aur visitors ke beech ka connection pahle se kahi jayada majbut ho jayega. Jo ki her ek blog ya website owner chahta hai. To cahliye aur jayada baat na karte huwe. Ab hum log jaan lete hai ki ‘Facebook Messenger Chat Widget Ko Blog/Website Me Kaise Add Kare’. But us se pahle jaan lete hai Facebook Messenger kya hai.

Facebook Messenger Kya Hota Hai?

Aaj ka samay internet aur social media ka samay hai. Facebook Messenger ek instant messaging service aur software application hai. Ish ke dwara aap bina facebook ko open kiye. Apne friends ko direct messenge send ya receive kar shakte hai. Facebook ne ish se Aug 2011 ko iOS aur Android apps ke liye released kiya tha. Facebook messenger se aap voice aur video calling bhi kar shakte hai. April 2017 tak Facebook Messenger ke 1.2 billion user ho chuke the.

  • Facebook Page Kya Hai Aur Facebook Page Kaise Banaye

Apne Blog/Website Me Facebook Messenger Chat Widget Kaise Add Kare?

Facebook Messenger Chat Widget apne blog ya website me add karna bahut hi aasan hai. Kyu ki aap ko bus ek code ko apne blog ya website me add kar dena hai. Us ke baad aap ka Facebook Messenger Chat Widget ek contact form ki tarah se kaam karne lagega.

Step 1 : Sab se pahle aap apne blogger ya wordpress account me login kar dashboard par jaye. Aur niche jo code diya huwa hai use copy kar le.

<style>.fb-livechat,.fb-widget{display:none}.HIH.fb-button,.HIH.fb-close{position:fixed;right:24px;cursor:pointer}.HIH.fb-button{z-index:1;background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIGhlaWdodD0iMTI4cHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjggMTI4IiB3aWR0aD0iMTI4cHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnPjxyZWN0IGZpbGw9IiMwMDg0RkYiIGhlaWdodD0iMTI4IiB3aWR0aD0iMTI4Ii8+PC9nPjxwYXRoIGQ9Ik02NCwxNy41MzFjLTI1LjQwNSwwLTQ2LDE5LjI1OS00Niw0My4wMTVjMCwxMy41MTUsNi42NjUsMjUuNTc0LDE3LjA4OSwzMy40NnYxNi40NjIgIGwxNS42OTgtOC43MDdjNC4xODYsMS4xNzEsOC42MjEsMS44LDEzLjIxMywxLjhjMjUuNDA1LDAsNDYtMTkuMjU4LDQ2LTQzLjAxNUMxMTAsMzYuNzksODkuNDA1LDE3LjUzMSw2NCwxNy41MzF6IE02OC44NDUsNzUuMjE0ICBMNTYuOTQ3LDYyLjg1NUwzNC4wMzUsNzUuNTI0bDI1LjEyLTI2LjY1N2wxMS44OTgsMTIuMzU5bDIyLjkxLTEyLjY3TDY4Ljg0NSw3NS4yMTR6IiBmaWxsPSIjRkZGRkZGIiBpZD0iQnViYmxlX1NoYXBlIi8+PC9zdmc+) center no-repeat #0084ff;width:60px;height:60px;text-align:center;bottom:24px;border:0;outline:0;border-radius:60px;-webkit-border-radius:60px;-moz-border-radius:60px;-ms-border-radius:60px;-o-border-radius:60px;box-shadow:0 1px 6px rgba(0,0,0,.06),0 2px 32px rgba(0,0,0,.16);-webkit-transition:box-shadow .2s ease;background-size:80%;transition:all .2s ease-in-out}.HIH.fb-button:focus,.HIH.fb-button:hover{transform:scale(1.1);box-shadow:0 2px 8px rgba(0,0,0,.09),0 4px 40px rgba(0,0,0,.24)}.fb-widget{background:#fff;z-index:2;position:fixed;width:360px;height:435px;overflow:hidden;opacity:0;bottom:0;right:24px;border-radius:6px;-o-border-radius:6px;-webkit-border-radius:6px;box-shadow:0 5px 40px rgba(0,0,0,.16);-webkit-box-shadow:0 5px 40px rgba(0,0,0,.16);-moz-box-shadow:0 5px 40px rgba(0,0,0,.16);-o-box-shadow:0 5px 40px rgba(0,0,0,.16)}.fb-credit{text-align:center;margin-top:8px}.fb-credit a{transition:none;color:#bec2c9;font-family:Helvetica,Arial,sans-serif;font-size:12px;text-decoration:none;border:0;font-weight:400}.HIH.fb-overlay{z-index:0;position:fixed;height:100vh;width:100vw;-webkit-transition:opacity .4s,visibility .4s;transition:opacity .4s,visibility .4s;top:0;left:0;background:rgba(0,0,0,.05);display:none}.HIH.fb-close{z-index:4;padding:0 6px;background:#365899;font-weight:700;font-size:11px;color:#fff;margin:8px;border-radius:3px}.HIH.fb-close::after{content:'x';font-family:sans-serif}</style><style>.fb-livechat,.fb-widget{display:none}.HIH.fb-button,.HIH.fb-close{position:fixed;right:24px;cursor:pointer}.HIH.fb-button{z-index:1;background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyOCAxMjgiIGhlaWdodD0iMTI4cHgiIGlkPSJMYXllcl8xIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMjggMTI4IiB3aWR0aD0iMTI4cHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnPjxyZWN0IGZpbGw9IiMwMDg0RkYiIGhlaWdodD0iMTI4IiB3aWR0aD0iMTI4Ii8+PC9nPjxwYXRoIGQ9Ik02NCwxNy41MzFjLTI1LjQwNSwwLTQ2LDE5LjI1OS00Niw0My4wMTVjMCwxMy41MTUsNi42NjUsMjUuNTc0LDE3LjA4OSwzMy40NnYxNi40NjIgIGwxNS42OTgtOC43MDdjNC4xODYsMS4xNzEsOC42MjEsMS44LDEzLjIxMywxLjhjMjUuNDA1LDAsNDYtMTkuMjU4LDQ2LTQzLjAxNUMxMTAsMzYuNzksODkuNDA1LDE3LjUzMSw2NCwxNy41MzF6IE02OC44NDUsNzUuMjE0ICBMNTYuOTQ3LDYyLjg1NUwzNC4wMzUsNzUuNTI0bDI1LjEyLTI2LjY1N2wxMS44OTgsMTIuMzU5bDIyLjkxLTEyLjY3TDY4Ljg0NSw3NS4yMTR6IiBmaWxsPSIjRkZGRkZGIiBpZD0iQnViYmxlX1NoYXBlIi8+PC9zdmc+) center no-repeat #0084ff;width:60px;height:60px;text-align:center;bottom:24px;border:0;outline:0;border-radius:60px;-webkit-border-radius:60px;-moz-border-radius:60px;-ms-border-radius:60px;-o-border-radius:60px;box-shadow:0 1px 6px rgba(0,0,0,.06),0 2px 32px rgba(0,0,0,.16);-webkit-transition:box-shadow .2s ease;background-size:80%;transition:all .2s ease-in-out}.HIH.fb-button:focus,.HIH.fb-button:hover{transform:scale(1.1);box-shadow:0 2px 8px rgba(0,0,0,.09),0 4px 40px rgba(0,0,0,.24)}.fb-widget{background:#fff;z-index:2;position:fixed;width:360px;height:435px;overflow:hidden;opacity:0;bottom:0;right:24px;border-radius:6px;-o-border-radius:6px;-webkit-border-radius:6px;box-shadow:0 5px 40px rgba(0,0,0,.16);-webkit-box-shadow:0 5px 40px rgba(0,0,0,.16);-moz-box-shadow:0 5px 40px rgba(0,0,0,.16);-o-box-shadow:0 5px 40px rgba(0,0,0,.16)}.fb-credit{text-align:center;margin-top:8px}.fb-credit a{transition:none;color:#bec2c9;font-family:Helvetica,Arial,sans-serif;font-size:12px;text-decoration:none;border:0;font-weight:400}.HIH.fb-overlay{z-index:0;position:fixed;height:100vh;width:100vw;-webkit-transition:opacity .4s,visibility .4s;transition:opacity .4s,visibility .4s;top:0;left:0;background:rgba(0,0,0,.05);display:none}.HIH.fb-close{z-index:4;padding:0 6px;background:#365899;font-weight:700;font-size:11px;color:#fff;margin:8px;border-radius:3px}.HIH.fb-close::after{content:'x';font-family:sans-serif}</style>

<div class="fb-livechat">  
  <div class="HIH fb-overlay"></div>  
  <div class="fb-widget">    
    <div class="HIH fb-close"></div>    
    <div class="fb-page" data-href="https://www.facebook.com/helpsinhindi/" data-tabs="messages" data-width="360" data-height="400" data-small-header="true" data-hide-cover="true" data-show-facepile="false">      
      <blockquote cite="https://www.facebook.com/helpsinhindi/" class="fb-xfbml-parse-ignore"> </blockquote>    
      </div>    
      <div class="fb-credit">       
       <a href="http://helpsinhindi.com/facebook-messenger-chat-widget/" target="_blank">Facebook Messenger Chat Widget</a>    
      </div>    <div id="fb-root"></div>  
    </div>  
  <a href="https://m.me/helpsinhindi" title="Send us a message on Facebook" class="HIH fb-button"></a> 
</div> 

<script src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.9">
</script><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>$(document).ready(function(){var t={delay:125,overlay:$(".fb-overlay"),widget:$(".fb-widget"),button:$(".fb-button")};setTimeout(function(){$("div.fb-livechat").fadeIn()},8*t.delay),$(".HIH").on("click",function(e){e.preventDefault(),t.overlay.is(":visible")?(t.overlay.fadeOut(t.delay),t.widget.stop().animate({bottom:0,opacity:0},2*t.delay,function(){$(this).hide("slow"),t.button.show()})):t.button.fadeOut("medium",function(){t.widget.stop().show().animate({bottom:"30px",opacity:1},2*t.delay),t.overlay.fadeIn(t.delay)})})});</script>

Step 2 : Upper jo code diya huwa hai. Us code me aap meri Facebook Page ke Username ki jagah. Apne Facebook page ka username daal dijiye. Sab se pahle aap upper diye huwe code ko ek notepad par copy kar lijiye. Aur us me mere username hi jagah apna username daal diiye.

  1. https://www.facebook.com/helpsinhindi
  2. http://helpsinhindi.com
  3. https://m.me/ helpsinhindi

Step 3 : Username dalne ke baad. App puri code ko copy kar le. Phir apne WordPress ya Blogger ke HTML Widget me paste kar de. Aur agar aap HTML code me add karna chahte hai. To Body tag me bhi paste kar shakte hai. Paste karne ke baad Save jarur kar de. Save karte hi Facebook Messenger Chat Widget aap ke blog me add ho jayega. Chahe to aap ja kar check kar shakte hai.

Widget Code source: Labnol

Asha katra hu ab aap ko pata chal gaya hoga. Facebook Messenger Chat Widget Ko Blog/Website Me Kaise Add Kare. But agar koi problem aati hai. To aap hume comment kar ke puch shakte hai. Hume aap ki madad kar ke bahut khushi hogi. Finally ab aap apne visitors se direct connect ho kar accha relation bana payege.

  • Facebook Like Box Apne Blog Me Kaise Add Kare

Dosto aap ko mera yah post kaisa laga. Agar aap ko mera yah post pasand aaya hai. To ish se social media par share jarur kare. Aur ish si tarah ke interesting update ke liye humare Newsletter ko Subscribe jarur kar le. Taki aap ke email par humare new post ka notification milta rahe. Thank you.

Post Pasand Aayi Hai To – Please Share This Post On Social Media:

Related Posts

Wordpress Par Blog Banane Ke Baad Kya Kare
WordPress Par Blog Banane Ke Baad 15 Essential Setting Jarur Kare
Domain Par Hosting Name Server Kaise Configure Kare
Domain Par Hosting Name Server Kaise Configure Kare
fb id block kaise kare
Facebook id ब्लॉक करना और हटाना सीखे बस 2 मिनट में

About Mangal Gupta

Helpsinhindi.com
He is a Indian blogger and share useful content on this blog regularly. If you like his articles then you can share this blog on social media with your friends. Want learn more then Click Here

WHAT OTHERS ARE READING:

youtube video background me kaise chalaye

Youtube Video को Background में कैसे चलाए? 2025 का नया तरीका

CIF Number kaise pata kare

SBI CIF Number कैसे पता करें? ऑनलाइन और ऑफलाइन तरीका 2025

sbi bank se personal loan kaise le

SBI से Personal Loan कैसे ले? 2025

Reader Interactions

Share Your Comments & Feedback: Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

हमसे सोशल मीडिया पर जुड़ें

कैटेगोरीस

  • Blogging
  • WordPress
  • Seo
  • Adsense
  • Tips And Tricks
  • Facebook
  • Earn Money Online
  • Amazing Facts
  • Whatsapp
  • Internet
  • Mobile
  • Android Apps
  • Youtube
  • Google
  • Festival
  • Computer
  • Web Hosting
  • Affiliate Marketing
  • Jio
  • Life Success
  • Security Tips

Footer

LITTLE ABOUT BLOG AUTHOR

दोस्तों मेरे ब्लॉग Helps In Hindi पर आप सभी का स्वागत है. मै मंगल गुप्ता एक इंडियन ब्लॉगर हु. मैंने ये वेबसाइट लोगो की मदद करने के लिए बनाई है. यहाँ हम अपने audience के लिए internet से सम्बंधित जानकारी हिंदी भाषा में शेयर करते है.

इस साईट पर आप Make Money Online, Blogging, Youtube, Android Apps, Mobile Tips and Trick और New Website कैसे बनाए के बारे में सिख सकते है.

SUBSCRIBE NEWS LETTER

अगर आप चाहते है की, जब भी हमारे साईट कोई new post publish हो. तो आपको तुरंत उस पोस्ट का notification मिल जाये. तो इसके लिए आप हमारे blog को जरुर से subscribe कर ले.

MOST POPULAR POST

  • किसी दुसरे की Phone Call अपने मोबाइल में सुने.
  • किसी भी Mobile Number की Call Details निकाले.
  • Android Phone के 20 Common Problems With Solution.
  • भूमि/ज़मीन का Bhulekh khasra khatauni, नक़ल नंबर कैसे निकले?
  • 2020 में नई वेबसाइट के लिए 21 आसान एसईओ टिप्स

Copyright © 2025 - Helps In HindiAbout UsContact UsPrivacy PolicyDisclaimerSitemap