Facebook Messenger Widget For Sending Instant Messages to Blog Admin

Would..

you like to add a fancy Facebook Messenger widget in you Blog thus your Blog

visitors can communicate with you? Yes then this widget is perfect for you. Generally

in Blog we use contact use widget for receiving email from blog readers but if

you want to use facebook messenger to receive your Blog message directly into

your facebook fan page then this widget is ideal for you. This widget works

like a charm. And because of floating widget it doesn’t occupy any space on

your Blog.

You

can show your facebook fan pages Like button as well as able to enable visitors

to write you. And all messages will go into your facebook message box. So you

can reply them, or instantly start communicates with them. I hope this widget

can strengthen the relation between blog.

Step #1:Log in to your Blogger Account and Go to your Blogger Dashboard.

Step #2: Go to Blogger Layout section.

Step #3:Click on Click on Add a Gadget then HTML/JavaScript Gadget.

Step #4:Leave the Title field blank. And copy the script from below and paste the widget code into Gadget. Please change facebook page name or ID by locating https://www.facebook.com/Thanuworlds

URL and Click “Save” button.

#b-c-facebook .fbchat_box,#chat_f_b_smal,#f_bt_start_chat{background:#3a5897}

#fbchat_box{padding-right:15px;max-width:210px;max-height:50px;display:block;transition:all .3s}

#b-c-facebook .f-chat-conent .chat-single a,#chat_f_b_smal{font-family:Arial,sans-serif}

#b-c-facebook .fbchat_box,#chat_f_b_smal{text-shadow:0 1px 0 rgba(0,0,0,.1);background-repeat:repeat-x;background-size:auto;background-position:0 0;text-decoration:none}

.chat_f_vt{position:fixed;right:10px}

#chat_f_b_smal{padding:0 10px;cursor:pointer;width:90px;color:#fff;height:38px;line-height:38px;background-color:#3a5897;border:0;margin-right:12px;font-size:14px;z-index:999999999;bottom:0;border-top-left-radius:5px;border-top-right-radius:5px;bottom:-400px;transition:all .3s;text-align:center;display:block}

#chat_f_b_smal:hover{background-color:#3B5998;opacity:1}

#b-c-facebook{margin-right:50px;bottom:0;z-index:9999999999;transition:all .3s;width:250px;height:auto;max-height:375px;min-height:38px;box-shadow:0 10px 50px 0 rgba(0,0,0,0.25);border-top-left-radius:5px;border-top-right-radius:5px;overflow:hidden;display:block}

#b-c-facebook .f-chat-conent{float:left;width:100%;height:335px;overflow:hidden;display:none;background-color:#fff;position:relative}

#b-c-facebook .f-chat-conent .chat-single{float:left;position:absolute;bottom:0;left:0;background-color:#fff;line-height:25px;color:#fff;width:100%}

#b-c-facebook .f-chat-conent .chat-single a{float:left;text-decoration:none;margin-left:10px;color:#0C5BB5;font-size:12px}

#b-c-facebook .f-chat-conent .chat-single a:hover{color:#F60}

#b-c-facebook .fbchat_box label{width:185px}

#b-c-facebook .f-chat-conent .chat-single label{float:right;color:silver;margin-right:5px;font-size:12px;font-family:Arial}

#b-c-facebook .fbchat_box,#b-c-facebook .fbchat_box label{line-height:20px;margin:0;cursor:pointer;font-family:Arial,sans-serif;font-size:14px}

#b-c-facebook .f-chat-conent .chat-single i{color:#0C5BB5}

#b-c-facebook .f-chat-conent .fb-page{margin-top:0;float:left;height:310px}

#b-c-facebook .fbchat_box{float:left;padding:0 25px;padding-left:15px;width:250px;color:#fff;height:38px;line-height:38px;background-color:#3a5897;border:0;z-index:9999999;margin-right:12px}

#b-c-facebook .fbchat_box label{position:absolute;top:10px}

//Widget by thanuworldhits.blogspot.com

.title-f-chat-icon{margin-left:-10px}

#t_f_chat{float:left;position:absolute;right:15px;top:-5px}

#t_f_chat a{color:#fff;font-size:17px;font-family:verdana;text-decoration:none}

#t_f_chat a:hover i{color:#ff0;text-decoration:none}

.chat-left-5{margin-left:2px}

#start_chat{position:absolute;width:248px;height:239px;top:70px;left:0;background-color:#fff;padding:10px;float:left;display:none}

#start_chat em{font-size:11px;color:gray}

.msg_b{color:#434a54;width:80%;word-wrap:break-word;overflow:hidden;font-family:Arial,sans-serif;font-size:14px;background:#edeef1;padding:10px;min-height:13px;margin-bottom:5px;position:relative;margin:5px;border-radius:5px;border:1px solid #dfe3e9}

#close_chat{opacity:0.5}

#close_chat:hover{opacity:1}

.msg_b a{text-decoration:underline;color:#01509E}

#f_bt_start_chat{margin:auto;background-color:#3a5897;border-radius:3px;color:#fff;font-family:Arial;font-size:14px;font-weight:bold;padding:9px 35px;text-decoration:none}

#f_bt_start_chat:hover{text-decoration:none;opacity:0.8}

#start_chat p{margin-top:30px}

#fb_alert_num{background-color:#ff0;padding:0 7px;color:red;border-radius:40px;font-size:13px;font-family:Arial;font-weight:700;position:absolute;right:55px;top:12px;height:20px;line-height:20px;display:none!important}

.hide_chatbox{display:none}

#f_enter_3{margin-top:30px}

</style>

//<![CDATA[

function check_fist_vist_f(){var _=f_read_cki("check_fist_vist_f");(0==_||""==_)&&(fb_eshow("f-chat-conent"),f_create_cki("check_fist_vist_f","1",1),f_create_cki("f_chat_open","1",1))}

function close_chat(){fb_ehide('b-c-facebook'),f_create_cki('close_chat',1,1),$('body').find('.zopim').remove(),fb_eshow('chat_f_b_smal'),on_playsound('click')}

function open_chat(){f_create_cki('close_chat','0',1),fb_eshow('b-c-facebook'),fb_eshow('f-chat-conent'),fb_ehide('chat_f_b_smal')}

function f_bt_start_chat(){f_create_cki('f_bt_start_chat','1',10),fb_ehide('start_chat'),fb_ehide('fb_alert_num'),on_playsound('click')}

function f_c_start_chat(){var t=f_read_cki('f_bt_start_chat');0==t||''==t?(fb_eshow('start_chat '),fb_eshow('fb_alert_num'),f_chat_step()):(fb_ehide('start_chat'),fb_ehide('fb_alert_num'))}

function b_f_chat(){var t=f_read_cki('f_chat_open');0==t||''==t?(fb_eshow('f-chat-conent'),f_create_cki('f_chat_open','1',1)):(fb_ehide('f-chat-conent'),f_create_cki('f_chat_open','0',1)),on_playsound('click')}

function f_ck_chat(){check_fist_vist_f();f_c_start_chat();var t=f_read_cki('close_chat');if(''==t||0==t||'0'==t){fb_eshow('b-c-facebook'),fb_ehide('chat_f_b_smal');var e=f_read_cki('f_chat_open');(1==e||'1'==e)&&fb_eshow('f-chat-conent')}else fb_eshow('chat_f_b_smal'),fb_ehide('b-c-facebook')}

function f_chat_step(){on_playsound('door_bell')

fb_eshow('f_enter_1');fb_eshow('f_enter_3');}

function fb_eshow(t){document.getElementById(t).style.display='block';}

function fb_ehide(t){document.getElementById(t).style.display='none';}

function f_create_cki(t,e,n){if(n){var o=new Date;o.setTime(o.getTime()+24*n*60*60*1e3);var c='; expires='+o.toGMTString()}else var c='';document.cookie=t+'='+e+c+'; path=/';}

function f_read_cki(t){for(var e=t+'=',n=document.cookie.split(';'),o=0;o<n.length;o++){for(var c=n[o];' '==c.charAt(0);)c=c.substring(1,c.length);if(0==c.indexOf(e))return c.substring(e.length,c.length)}

return''}

function on_playsound(t){}

function ionSound(){1==web_sound&&$.ionSound({sounds:['click','door_bell'],path:fb_path.live_chat_path+'sounds/',multiPlay:!0,volume:'1.0'})}

if(o&&(e.volume=o),_.multiPlay||a){if(_.multiPlay)

if(e.ended)e.play();else{try{e.currentTime=0}catch(i){}

e.play()}}else e.play(),a=!0,c=setInterval(function(){e.ended&&(clearInterval(c),a=!1)},250)},l=function(t){var e=f[t];if('object'==typeof e&&null!==e){e.pause();try{e.currentTime=0}catch(n){}}},r=function(t){var e=f[t];if('object'==typeof e&&null!==e){try{f[t].src=''}catch(n){}

f[t]=null}};t.ionSound=function(n){if(_=t.extend({sounds:['water_droplet'],path:'/sounds/',multiPlay:!0,volume:'0.5'},n),e=_.sounds.length,'function'==typeof Audio||'object'==typeof Audio)

for(c=0;e>c;c+=1)i(_.sounds[c]);t.ionSound.play=function(t){u(t)},t.ionSound.stop=function(t){l(t)},t.ionSound.kill=function(t){r(t)}},t.ionSound.destroy=function(){for(c=0;e>c;c+=1)f[_.sounds[c]]=null;e=0,t.ionSound.play=function(){},t.ionSound.stop=function(){},t.ionSound.kill=function(){}}}}(jQuery);

//]]>

</script>

<a title="Open Chat" id="chat_f_b_smal" onclick="open_chat()" class="chat_f_vt">Open Chat</a> <div id="b-c-facebook" class="chat_f_vt"> <div id="fbchat_box" onclick="b_f_chat()" class="fbchat_box"> <label>Send Message to Admin</label> <span id="fb_alert_num">1</span> <div id="t_f_chat"><div class='close_chatfb' onclick='hidechatfb()'>_</div></div></div><div id="f-chat-conent" class="f-chat-conent"> <div class="fb-page" data-tabs="messages" data-href="https://www.facebook.com/Thanuworlds/" data-width="250" data-height="310" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="false" data-show-posts="true"> </div><div id="start_chat"> <div id="f_enter_1" class="msg_b hide_chatbox"> Hello! Thanks for visiting my site. Please press Start button to Contact with Admin :) </div><p id="f_enter_3" class="hide_chatbox" align="center"> <a href="javascript:;" onclick="f_bt_start_chat()" id="f_bt_start_chat">Start</a> </p></div></div></div>

Step #5:Press the Save arrangement button from the top.

Now visit your blog

and see the widget at the bottom right corner of your Blog. Just click on it

and write message. Your instant message will go into the message box.

However for writing message readers must have a facebook id, otherwise s/he can’t write any message. For any further help feel free to write me. Thank you.

Thanu Tech

Breaking

Tuesday, November 21, 2017

Facebook Messenger Widget For Sending Instant Messages to Blog Admin