Kompi Design Blogger Template Download (Premium) - TemplateHack

Halaman

    Social Items

/ / / / / / / Kompi Design Blogger Template Download (Premium)
TemplateHack.com - Download Kompidesign blogger template. Since 24 February 2016, Google implemented AMP to search engine on mobile platrofrm. What is AMP? AMP is Accelerated Mobile Page. It is feature for your page loaded fastly. AMP is reason to built webpage with static content and can load fast. AMP built from JS, HTML, and from Google Cache.

Google recomended to publisher / blogger to use templates that have this features (AMP). before, I just share for free AMP blogger template, Sahabat AMP. today, I will share one again blogger com templates built with Google AMP, Kompidesign. This is usefull blogger templates, optimized SEO and I recomended this blogger template with Google AMP for your blog. After I try on my personal blog in24 hours, I got shock! My visitor increase 500%, wow! Absolutely!!

Screenshoot



Features


  1. SEO Friendly
  2. Responsive
  3. AMP (Accelerated Mobile Page)
  4. Mobile Friendly
  5. One right sidebar
  6. Simple design
  7. Light color base design
  8. Blogger com templates
  9. Html5 blogger templates
  10. Disqus commentary
  11. Template blogger XML
  12. Premium blogger templates


Customization


Here is some customizable kompi design blogger templates premium

1. Change Logo Blog Kompidesign, change your image URL with this code. Make logo with size 30 pixel x 30 pixel


<b:includable id='title'><a expr:href='data:blog.homepageUrl' expr:title='data:title' itemprop='url'><span itemprop='name'><amp-img alt='Logo' expr:title='data:title' height='30' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMZzMwEPpW3Ak-9DGIm-sQPFhBHsPUlXQxxhIcX13HTQGh0Z0UAZu4G2sUu3zPPu_cmms-YHiY5WZmc5N4cXDf9-22_pIoqKDchm1g_zOInOObBlFbw53A8cwr6osHNSIZYPqPc9Q-yv8/s640/cara-root-hp-xiaomi.jpg' width='30'/> <data:title/></span></a>
</b:includable>

2. Change Disqus Commentary, change yukampus code with your Disqus username


<b:includable id='disqus-comments' var='post'><div class='disqus-comments' id='disqus_comments'><amp-iframe expr:src='"https://cdn.rawgit.com/KompiAjaib/kompi-html/master/disqus_amp2.html?shortname=yukampus&url=" + data:blog.canonicalUrl' frameborder='0' height='300' layout='responsive' resizable='resizable' sandbox='allow-scripts allow-same-origin allow-modals allow-popups' width='600'><div aria-label='Disqus Comments' overflow='' role='button' tabindex='0'>Disqus Comments</div></amp-iframe></div></b:includable>

3. Change Ads place


For ads on header, copy and paste this code to your templates

<div class='headerad'><amp-img alt='Header Ads' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbvV-wxOvvlzrvlfJTsJSpwWW4W0d1d7e3vdRmjIchMCigQ8Cklu9_I8Y2bYC9EgoXA477Be62OdnP_h88VpZ9Ut8R998F2tP2dAwFppdlGF3d51Jc81RhAXYMmnCcbxpgQn0yJZbBlKc/s640/kingroot-xiaomi.jpg' title='Header Ads' width='728'/>
<div class='clear'/></div>

For ads on above post (330x250), paste this code into your blog templates

<div class='postabovead'><amp-img alt='Sidebar Ads' height='250' layout='responsive' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXZkygNGr83tq_49VWyf4bAMGf_gzL3jxNoVJ-oB0YArtxkmo38kKmUchTcoxZ3H7CCdc-lLn8IPl2GXGh5-hNeOgHlN6chgF10IfAAoFWrHE0ARgDCSdShLyBrC_QOV4epdZr56u9b4/s320/download-twrp-xiaomi-all-type.jpg' title='Sidebar Ads' width='300'/>
</div>

For ads on under post, paste this code

<div class='underpostad'><amp-img alt='Under Post Ads' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4lwOkxWXPWBgQZHpaBLPzEWk3a3dBDDoj6bRnTmFCyJ6wTzAMkS4AA4mdMHLZVdSx3hkVoJJNh04dkhVYhVDDaZfKt1piIdI3zMRRXmOs83IrXRuqN1zOUG4bxLEsLF0qa9LJloY2HT0/s320/hapus-aplikasi-bawaan-xiaomi.jpg' title='Under Post Ads' width='728'/>
<div class='clear'/></div>

Thumbnail post, copy this code and paste on top of blogger templates

<div class="thumb-post"><noscript><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZkFyZ4jtQpREHvpuu0f4Lfq8daVrkTBOl3O_giaE5J__d6wTHTNpRJlcjChPKY9Ryg1nb-pTAl5CnuxKtsbfWVrDz3kRP1pmtplET8ylOKV4gAIes0YhdnHa9nh9wHvgDuZeag-JuLv4/s320/cara-hapus-akun-google-gmail-xiaomi.jpg" width="650" height="350" alt="Curabitur placerat est sem"/></noscript>
</div>

4. Insert other image, paste this code to your kompidesign blogger templates


<amp-img      alt="Curabitur placerat est sem"      height="350"      layout="responsive"      on="tap:lightbox1"      role="button"      src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjC_iWfOLJ6fEV2NPhvNGTgQgVfONEohx28Zyi9p0Lu2R2Po51WJlLsFiuuP6sMBrGPvn2jU-HoE-bGIjBBDz6k8Y1CKY68sCr-yBdXBvajBwCSxzlNtQAEOFYb4puz2U54UlLDsuiWBaU/s320/home+2.jpg"
      tabindex="0"      width="650"></amp-img>

5. Insert youtube video, paste this code to your personal templates and change ID VIDEO YOUTUBE to your id video Youtube.


<amp-youtube     data-videoid="ID VIDEO YOUTUBE"     height="270"     layout="responsive"     width="480"></amp-youtube>

6. Insert slider for some image, paste this code to your kompidesign blogger com templates


<amp-carousel width="400"      height="300"      layout="responsive"      type="slides">    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU1aKylNf9NMcTOLO-FaBvxj0TVyJheWWxjdVxjQxzzpWZBpfMDUGYyKBFlPgIxcWzNvvL_pH5HWi8MZ93BF5LjzMG-461mppH6gVONP4r38M4Fu8unk2oEsXT8E-kPXoVL6JF2bkBFLc/s400/cara-root-xiaomi-redmo-note-6-pro.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkIbkJ0lo44GiKu7nMVZSyfhelrUB1KJMbCeKDdGDD6hKfwiiyqaHVwarRygtkBw2Z-Jnqp3yoDVeyBUa9cQ6geEYBCm1tJ_apJoCP8S6H1dJGzkxQ2KwGtMe7aabjkXE17V4iUSKeL08/s400/cara-root-redmi-note-4.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh407iLFJ0Iu689kjGL_mdzwDmQQ_Qr47ETfUQ_jEUircWgyFQynT5Z4wb74MhL9JNg35ETcwOyIsuok25mr7BlZxnvlrT5ZwNzWslmfJnqlHCpISoLvUsya_aiQMLpJcWBYWnSqjvTZt0/s400/twrp-xiaomi-miui-10.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>  </amp-carousel>

7. Insert google Analytic to blogger templates, paste this code to every place you happy :D. change UA-XXXXX-Y with your Google Analytic code.


<script type='application/json'>{  "vars": {    "account": "UA-XXXXX-Y"  },  "triggers": {    "trackPageview": {      "on": "visible",      "request": "pageview"    }  }}</script>

8. Insert external link on AMP blogger templates, just copy this code ang change https://yukampus.com/ to your link


.post-body .separator a:after,.post-body a[href^="https://yukampus.com/"]:after,.post-body a[href^="https://twitter.com/intent/tweet"]:after{content:'';background:none;width:0;height:0;margin-left:0}

Download


If you already impatient and interested in Kompidesign, please click the button bellow

DOWNLOAD
DEMO

Kompi Design Blogger Template Download (Premium)

TemplateHack.com - Download Kompidesign blogger template. Since 24 February 2016, Google implemented AMP to search engine on mobile platrofrm. What is AMP? AMP is Accelerated Mobile Page. It is feature for your page loaded fastly. AMP is reason to built webpage with static content and can load fast. AMP built from JS, HTML, and from Google Cache.

Google recomended to publisher / blogger to use templates that have this features (AMP). before, I just share for free AMP blogger template, Sahabat AMP. today, I will share one again blogger com templates built with Google AMP, Kompidesign. This is usefull blogger templates, optimized SEO and I recomended this blogger template with Google AMP for your blog. After I try on my personal blog in24 hours, I got shock! My visitor increase 500%, wow! Absolutely!!

Screenshoot



Features


  1. SEO Friendly
  2. Responsive
  3. AMP (Accelerated Mobile Page)
  4. Mobile Friendly
  5. One right sidebar
  6. Simple design
  7. Light color base design
  8. Blogger com templates
  9. Html5 blogger templates
  10. Disqus commentary
  11. Template blogger XML
  12. Premium blogger templates


Customization


Here is some customizable kompi design blogger templates premium

1. Change Logo Blog Kompidesign, change your image URL with this code. Make logo with size 30 pixel x 30 pixel


<b:includable id='title'><a expr:href='data:blog.homepageUrl' expr:title='data:title' itemprop='url'><span itemprop='name'><amp-img alt='Logo' expr:title='data:title' height='30' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMZzMwEPpW3Ak-9DGIm-sQPFhBHsPUlXQxxhIcX13HTQGh0Z0UAZu4G2sUu3zPPu_cmms-YHiY5WZmc5N4cXDf9-22_pIoqKDchm1g_zOInOObBlFbw53A8cwr6osHNSIZYPqPc9Q-yv8/s640/cara-root-hp-xiaomi.jpg' width='30'/> <data:title/></span></a>
</b:includable>

2. Change Disqus Commentary, change yukampus code with your Disqus username


<b:includable id='disqus-comments' var='post'><div class='disqus-comments' id='disqus_comments'><amp-iframe expr:src='"https://cdn.rawgit.com/KompiAjaib/kompi-html/master/disqus_amp2.html?shortname=yukampus&url=" + data:blog.canonicalUrl' frameborder='0' height='300' layout='responsive' resizable='resizable' sandbox='allow-scripts allow-same-origin allow-modals allow-popups' width='600'><div aria-label='Disqus Comments' overflow='' role='button' tabindex='0'>Disqus Comments</div></amp-iframe></div></b:includable>

3. Change Ads place


For ads on header, copy and paste this code to your templates

<div class='headerad'><amp-img alt='Header Ads' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbvV-wxOvvlzrvlfJTsJSpwWW4W0d1d7e3vdRmjIchMCigQ8Cklu9_I8Y2bYC9EgoXA477Be62OdnP_h88VpZ9Ut8R998F2tP2dAwFppdlGF3d51Jc81RhAXYMmnCcbxpgQn0yJZbBlKc/s640/kingroot-xiaomi.jpg' title='Header Ads' width='728'/>
<div class='clear'/></div>

For ads on above post (330x250), paste this code into your blog templates

<div class='postabovead'><amp-img alt='Sidebar Ads' height='250' layout='responsive' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiXZkygNGr83tq_49VWyf4bAMGf_gzL3jxNoVJ-oB0YArtxkmo38kKmUchTcoxZ3H7CCdc-lLn8IPl2GXGh5-hNeOgHlN6chgF10IfAAoFWrHE0ARgDCSdShLyBrC_QOV4epdZr56u9b4/s320/download-twrp-xiaomi-all-type.jpg' title='Sidebar Ads' width='300'/>
</div>

For ads on under post, paste this code

<div class='underpostad'><amp-img alt='Under Post Ads' height='90' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4lwOkxWXPWBgQZHpaBLPzEWk3a3dBDDoj6bRnTmFCyJ6wTzAMkS4AA4mdMHLZVdSx3hkVoJJNh04dkhVYhVDDaZfKt1piIdI3zMRRXmOs83IrXRuqN1zOUG4bxLEsLF0qa9LJloY2HT0/s320/hapus-aplikasi-bawaan-xiaomi.jpg' title='Under Post Ads' width='728'/>
<div class='clear'/></div>

Thumbnail post, copy this code and paste on top of blogger templates

<div class="thumb-post"><noscript><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZkFyZ4jtQpREHvpuu0f4Lfq8daVrkTBOl3O_giaE5J__d6wTHTNpRJlcjChPKY9Ryg1nb-pTAl5CnuxKtsbfWVrDz3kRP1pmtplET8ylOKV4gAIes0YhdnHa9nh9wHvgDuZeag-JuLv4/s320/cara-hapus-akun-google-gmail-xiaomi.jpg" width="650" height="350" alt="Curabitur placerat est sem"/></noscript>
</div>

4. Insert other image, paste this code to your kompidesign blogger templates


<amp-img      alt="Curabitur placerat est sem"      height="350"      layout="responsive"      on="tap:lightbox1"      role="button"      src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjC_iWfOLJ6fEV2NPhvNGTgQgVfONEohx28Zyi9p0Lu2R2Po51WJlLsFiuuP6sMBrGPvn2jU-HoE-bGIjBBDz6k8Y1CKY68sCr-yBdXBvajBwCSxzlNtQAEOFYb4puz2U54UlLDsuiWBaU/s320/home+2.jpg"
      tabindex="0"      width="650"></amp-img>

5. Insert youtube video, paste this code to your personal templates and change ID VIDEO YOUTUBE to your id video Youtube.


<amp-youtube     data-videoid="ID VIDEO YOUTUBE"     height="270"     layout="responsive"     width="480"></amp-youtube>

6. Insert slider for some image, paste this code to your kompidesign blogger com templates


<amp-carousel width="400"      height="300"      layout="responsive"      type="slides">    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiU1aKylNf9NMcTOLO-FaBvxj0TVyJheWWxjdVxjQxzzpWZBpfMDUGYyKBFlPgIxcWzNvvL_pH5HWi8MZ93BF5LjzMG-461mppH6gVONP4r38M4Fu8unk2oEsXT8E-kPXoVL6JF2bkBFLc/s400/cara-root-xiaomi-redmo-note-6-pro.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkIbkJ0lo44GiKu7nMVZSyfhelrUB1KJMbCeKDdGDD6hKfwiiyqaHVwarRygtkBw2Z-Jnqp3yoDVeyBUa9cQ6geEYBCm1tJ_apJoCP8S6H1dJGzkxQ2KwGtMe7aabjkXE17V4iUSKeL08/s400/cara-root-redmi-note-4.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh407iLFJ0Iu689kjGL_mdzwDmQQ_Qr47ETfUQ_jEUircWgyFQynT5Z4wb74MhL9JNg35ETcwOyIsuok25mr7BlZxnvlrT5ZwNzWslmfJnqlHCpISoLvUsya_aiQMLpJcWBYWnSqjvTZt0/s400/twrp-xiaomi-miui-10.jpg"
        width="400"        height="300"        layout="responsive"></amp-img>  </amp-carousel>

7. Insert google Analytic to blogger templates, paste this code to every place you happy :D. change UA-XXXXX-Y with your Google Analytic code.


<script type='application/json'>{  "vars": {    "account": "UA-XXXXX-Y"  },  "triggers": {    "trackPageview": {      "on": "visible",      "request": "pageview"    }  }}</script>

8. Insert external link on AMP blogger templates, just copy this code ang change https://yukampus.com/ to your link


.post-body .separator a:after,.post-body a[href^="https://yukampus.com/"]:after,.post-body a[href^="https://twitter.com/intent/tweet"]:after{content:'';background:none;width:0;height:0;margin-left:0}

Download


If you already impatient and interested in Kompidesign, please click the button bellow

DOWNLOAD
DEMO
Ads Ready AMP One Right Sidebar Responsive SEO Friendly Two Column
Subscribe to: Post Comments (Atom)