Bu yazımızda blog messenger sayesinde yönetici, blog ziyaretçileri ve ziyaretçilerin arasında etkileşim sağlayarak blog üzerinden sohbet ve yorum ekleme hizmeti oluşturma ipuçlarını paylaşıyoruz. Sohbet kanalı ile blog ziyaretçilerinin daha özgürce yazı yazabilmesi, içeriğinize eklemek istediğiniz yazlar yada sadece blog ziyaretçilerinin selamlaşmak veya bir çok şeyi tartışmak için messenger iletişim kutusunu kurabilirsiniz.
Bu hizmeti sağlayabilecek bir çok ücretli veya ücretsiz messenger sohbet kutusu vardır. Şunu özellikle vurgulamak gerekirse; hemen hemen bir çok blog yöneticisi ve ziyaretçilerinin facebook hesabı var. Bu nedenle blogunuza bir sohbet kutusu eklemeyi düşünüyorsanız ve blog için oldukça kullanışlı olan açılır messenger kutusunu ekleyebilirsiniz.
Blog Messenger Sobet Kutusu Nasıl Eklenir?
Blog sohbet kutusu, messenger iframe kullanarak blogunuza monte etmeniz mümkün değildir. Bu yüzden blogunuzda messenger kutusu görüntülemek için bir pop-up açılır pencere kodularını kullanmanız gerekir.
Şimdi blog messenger sohbet kutusunu eklemek için, aşağıdaki adımları takip edin lütfen;
1. Blogger hesabınıza giriş yapın ve eklemek istediğiniz blogun kumanda panelinden Şablon > HTML'i Düzenle sekmesine tıklayın. Açılan sayfada aşağıdaki CSS kodlarını eklemek için, CTRL+F yardımıyla ]]></b:skin> veya </style> kodunu bulun ve aşağıdaki CSS kodlarını ]]></b:skin> veya </style> kodunun bir satır üzerine ekleyin.
.blogmsn_kutu {background: #fff;width: 250px;height: 160px;position: fixed;bottom: -125px;left: 60px;transition: all .3s;border: 1px solid transparent;border-radius: 3px 3px 0 0;
-webkit-box-shadow: rgba(0, 0, 0, 0.089) 0 0 1px 2px;
-moz-box-shadow: rgba(0, 0, 0, 0.089) 0 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.089) 0 0 1px 2px;
kutu-shadow: rgba(0, 0, 0, 0.089) 0 0 1px 2px;overflow: hidden;z-index:1000000;}
.pesan_blogmsn {text-align: center;text-decoration: none;display: block;height: 100%;padding:4px 4px 10px;}
.blogmsn_button {background:#526ba5;border: 0;margin: 0 auto;padding: 5px 18px;font-size: 18px;font-weight:400;color: #fff;text-align: center;display: inline-block;border-radius: 3px;transition: all .3s;text-decoration: none;}
.blogmsn_button:hover {background: #2b529c;}
.blogmsnheader {margin: 0 auto;padding: 0 10px;height: 35px;line-height: 35px;font-size: 18px;font-weight:600;color:#526ba5;text-align: center;display: block;cursor: pointer;}
.pesan_blogmsn p {color:#ea7237;font-size:15px;margin:10px;}2. Aşağıdaki javaScript kodlarını eklemek için, CTRL+F yardımıyla </body> kodunu bulun ve aşağıdaki kodları kopyalayıp </body> kodunun bir satır üzerine ekleyin.
<div class="blogmsn_kutu" id="blogmsn">
<div class="blogmsnheader" onclick='showhideblogmsn()'>Blogger Eklentileri</div>
<div class="pesan_blogmsn">
<p>Merhaba! Buradan arkadaşlarınız ile sohbet edebilirsiniz,
<br/> Teşekkürler.</p>
<a href="javascript: void(0)" onclick="popup('//m.me/bloggereklentileri');showhideblogmsn()" title="Messenger Sohbet">
<span class="blogmsn_button">Messenger Sohbet</span></a>
</div>
</div>
<script>
//<![CDATA[
function showhideblogmsn(){var o=document.getElementById("blogmsn");"0px"!==o.style.bottom?o.style.bottom="0px":o.style.bottom="-125px"}function popup(o){var t=650,n=400,e=(screen.width-t)/2,i=(screen.height-n)/2,s="width="+t+", height="+n;return s+=", top="+i+", left="+e,s+=", directories=no",s+=", location=no",s+=", menubar=no",s+=", resizable=no",s+=", scrollbars=no",s+=", status=no",s+=", toolbar=no",newwin=window.open(o,"windowname5",s),window.focus&&newwin.focus(),!1};
//]]>
</script>Blog Messenger Sobet Kutusu Açıklamaları
Yukarıdaki CSS ve javaScript kodları içerisinde belirtilen yerleri kendi blogunuza göre düzenleyerek messenger kutusunun doğru çalışmasını sağlayabilirsiniz.- Yukarıdaki CSS kodları içerisinde bulunan left: 60px kodu ile blog messenger kutusunun sol tarafta yer almasını sağladık, eğer siz messenger kutusunun sağ tarafta yer almasını istiyorsanız belirtilen kod yerine right: 60px kodunu eklemeniz yeterli olacaktır.
- Yine yukarıdaki javaScript kodu içerisinde belirtilen yere kendi blogunuzun yada kendinizin facebook sayfa ID adını yazın. Facebook ID adresi: facebook com/NiloyaTRTCocuk/ olarak adres çubuğunda görünmektedir.
Bir önceki yazımızda farklı bir mesaj gönderme sistemi olan Blogger Facebook Messenger Uygulaması paylaşmıştık. Bu yazmıza da göz atabilirsiniz.
Daha fazla bilgi ve diğer sorularınız için, lütfen yorum sistemimizi kullanarak bize ulaşabilirsiniz. Bizi takip ettiğiniz için teşekkürler.
Yorum Gönder