Monday, 19 November 2018

Download DroidBuzz Responsive AMP HTML Blogger Template

Download DroidBuzz AMP HTML Blogger Template - Hallo sobat blogger, pada kesempatan kali ini saya akan membagikan template DroidBuzz atau sering dikenal dengan Brosense versi AMP.

Template ini awalnya adalah template Brosense buatan Mas Sugeng, lalu di modifikasi oleh Blog Situs Template. Jika sobat ingin menggunakannya, berikut adalah fitur-fitur beserta link Downloadnya.

DEMO | DOWNLOAD

Blogger Template Style
Name : DroidBuzz Responsive AMP HTML Blogger Template
Version : 1.0
Publish Date : Tidak ada
Designer : Iwan Efendi
URL : http://iwanberbagi.com
Published : http://situstemplate.com

Fitur Template
- Responsive
- Valid Structured Data
- Navigation Mobile by Kang Ismet
- Popular Post Thumbnail Code by Simini v1 bungfrangki
- Adsense Ready
- HIGH CTR
- Fast Loading
- Valid AMP HTML
- Related Post
- Search Box di samping Header
- Slot Iklan Di Antara Posting Tampilan Mobile
- Sosial AMP Button Custom
- Disqus Comments
- Subscribe Box Di Footer
- Dan Lain-lain

Template ini sudah disesuaikan dengan keinginan si pembuat, jika ada yang kurang mohon dimaklumi, kedepannya akan di perbaharui juga jika sudah mendapatkan feel yang terbaik.

Namun, untuk hosting file Disqus yang tidak bisa dihindarkan karena memang harus di hosting agar bisa digunakan dengan baik. Saran terbaik dari pembuat, kamu harus menghosting sendiri filenya yang sekarang di hosting sebagai berikut :

<amp-iframe expr:src='&quot;https://cdn.rawgit.com/Iwan27/DroidBuzz/master/amp_disqus_buzz.html?shortname=droidbuzz-1&amp;fontBodyFamily=sans-serif&amp;fontLinkColor=e8554e&amp;canonicalurl=&quot; + data:blog.canonicalUrl + &quot;&amp;url=&quot; + data:blog.url + &quot;&amp;homepageurl=&quot; + data:blog.homepageUrl + &quot;&amp;canonicalhomepageurl=&quot; + data:blog.canonicalHomepageUrl' frameborder='0' height='333' layout='responsive' resizable='resizable' sandbox='allow-forms allow-scripts allow-same-origin allow-modals allow-popups' width='556'><div aria-label='Disqus Comments' overflow='' role='button' tabindex='0'/></amp-iframe>



File hostingnya sudah di miror di firebase dan bisa diakses disini. Untuk menggantikan file hosting dari github berikut yang kode lengkapnya bisa kamu lihat :

<div id="comments"></div><script>  window.addEventListener('message', receiveMessage, false);
 function receiveMessage(event) {    if (event.data) {      var msg;      try {        msg = JSON.parse(event.data);      } catch (err) {}      if (!msg)        return false;      if (msg.name === 'resize') {        window.parent.postMessage({          sentinel: 'amp',          type: 'embed-size',          height: msg.data.height        }, '*');      }    }  }
 function getQueryVariable(variable) {    var query = window.location.search.substring(1);    var vars = query.split('&');    for (var i = 0; i < vars.length; i++) {      var pair = vars[i].split('=');      if (pair[0] == variable) {        return pair[1];      }    }    return (false);  }
   var css = '#disqus_thread {font-family:' + getQueryVariable('fontBodyFamily') + '} a {color:#' + getQueryVariable('fontLinkColor') + '}',    head = document.head || document.getElementsByTagName('head')[0],    style = document.createElement('style');style.type = 'text/css';if (style.styleSheet){  style.styleSheet.cssText = css;} else {  style.appendChild(document.createTextNode(css));}head.appendChild(style);
               var disqus_shortname = getQueryVariable('shortname');                var disqus_blogger_current_url = getQueryVariable('canonicalurl');
               if (!disqus_blogger_current_url.length) {                    disqus_blogger_current_url = getQueryVariable('url');                }
               var disqus_blogger_homepage_url = getQueryVariable('homepageurl');                var disqus_blogger_canonical_homepage_url = getQueryVariable('canonicalhomepageurl');
                   (function() {                        var bloggerjs = document.createElement('script');                        bloggerjs.type = 'text/javascript';                        bloggerjs.async = true;                        bloggerjs.src = '//'+disqus_shortname+'.disqus.com/blogger_item.js';                        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);                    })();
               (function() {                    var bloggerjs = document.createElement('script');                    bloggerjs.type = 'text/javascript';                    bloggerjs.async = true;                    bloggerjs.src = '//'+disqus_shortname+'.disqus.com/blogger_index.js';                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);                })();</script>


Satu lagi ada juga hosting related post sebagai berikut :

<amp-iframe frameborder='0' height='310' layout='responsive' resizable='resizable' sandbox='allow-scripts allow-same-origin allow-modals allow-popups' src='https://cdn.rawgit.com/Iwan27/DroidBuzz/master/related-droidbuzz.net.html?url=https://www.droidbuzz.net' width='556'><div aria-label='Related Posts' overflow='' role='button' tabindex='0'>Related Posts</div></amp-iframe>


Kamu bisa meng hosting sendiri agar lebih aman, namun kalau gak mau ribet yah dibiarin aja yang itu.

https://cdn.rawgit.com/Iwan27/DroidBuzz/master/related-droidbuzz.net.html
Namun, semoga saja tidak akan terjadi error oleh hostingnya, karena pengalaman saya menggunakan hosting github belum pernah terjadi error sama sekali. Namun apa salahnya kita berjaga-jaga. Jika ada yang ingin dibahas bisa melalui form komentar aja yah, semoga betah dan bermanfaat templatenya.

Update 13 Februari 2017, Menghapus iklan Adsense pada template.

Hapus semua kode yang mirip bahkan sama kode-kode berikut:

<b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;false&quot;'>    <div class='buzzads'>        <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='300'/>    </div></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>    <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='300'/></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;false&quot;'>    <div class='buzz-ad'>        <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='556'/>    </div></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>    <div class='buzz-ad'>        <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='300'/>    </div></b:if>
   <div class='post'>        <span class='title-ads'>Advertisement</span>        <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='300'/>    </div>
   <div class='post'>        <span class='title-ads'>Advertisement</span>        <amp-ad data-ad-client='ca-pub-6235611333449307' data-ad-slot='1767119270' height='250' layout='responsive' type='adsense' width='300'/>    </div>


Jika masih ada yang dibingungkan, kamu bisa komentar kita bahas langsung di komentar yah.

Hanya seorang Blogger & Content Writer yang senang mempelajari dan berbagi informasi, tutorial dan seputar dunia internet.


EmoticonEmoticon