NETRAL'ID

Ini adalah Documentation template Amp untuk user nikami

Menu Navigasi

Silahkan buka Blogger > Tema > Klik Edit HTML
Cari kode di bawah ini dan temukan kode # di bawahnya lalu ganti kode # dengan link blog Anda

<input autocomplete='off' id='amp-go' role='button' type='checkbox'/>
<ul id='amp-gooms'>
<li><a href='#' title='Free Template'><i class='material-icons'>&#59518;</i> Free Template</a></li>
<li><a href='#' title='Premium Template'><i class='material-icons'>&#59517;</i> Premium Template</a></li>
<li class='payment'><a href='#' title='Payment'><i class='material-icons'>&#59596;</i> Payment</a></li>
</ul>
</div>

Slider Halaman Depan

Template

Documentation aMP

Nikami Selasa, 19 November 2019

Goomify Responsive Blogger Template ini sangat rigan cocok buat anda yang mempunyai blogger berbagi template , dan Pembagi wallpapers.. Template ini tidak mempunyai layout widget sidebar Membuat Template ini sangat mudah di gunakan dan loading Cepat .untuk settingan, anda harus mengedit-nya di dalam Edit Html, nah berikut ini Documentation Template Goomify editing by Theboegis.com :

Template

Documentation Template Goomify

Nikami Jumat, 09 Agustus 2019

template ini sangat rigan cocok buat anda yang mempunyai blogger berbagi template , dan template ini tidak mempunyai layout widget sidebar untuk settingan anda harus mengedit-nya di dalam Edit Html nah berikut Documentation Template Platinumify :

Template

Documentation Template Platinumify

Nikami Senin, 05 Agustus 2019

h2 class="doc-subtitle">0. Daftar Isi

1. Info Template beserta Fitur & Kelebihan

Info Template
Supermasboy adalah template Blogger dengan layout Responsif dan cocok untuk semua blog. Dengan desain yang memiliki kombinasi warna yang sederhana, terlihat bersih dan modern, SEO Optimized, dan telah dibangun dengan menggunakan beberapa trend desain saat ini yang paling populer.

Template

Documentation SuperMasBro

Nikami Minggu, 04 Agustus 2019

Template Detikcoy adalah template blogger yang mirip dengan Situs Detik Com . Cocok untuk anda yang ingin buat website berita tanpa harus memikirkan hosting . Cukup beli template ini + siapkan domain andalan anda .

Template Tips Blogger

Panduan Instal Template Blogger detikcoy

Nikami Senin, 15 Juli 2019

1. Info Template beserta Fitur & Kelebihan

Info Template
LiviaTheme adalah template Blogger dengan layout Responsif dan cocok untuk semua blog. Dengan desain yang memiliki kombinasi warna yang sederhana, terlihat bersih dan modern, SEO Optimized, dan telah dibangun dengan menggunakan beberapa trend desain saat ini yang paling populer.

Fitur Template

Responsive
SEO Friendly
Google Testing Tool Validator
2 Column
Auto Readmore
Related Post with Thumb
Search Box
Recent Post Slider
Subcription Box
Back to Top Button
Responsive Drop Down Menu
And More...

2. Menu Navigasi

Silahkan buka Blogger > Template > Edit HTML

Cari kode di bawah ini dan temukan kode # di bawahnya lalu ganti kode # dan 5298418528980018389 dengan tulisan atau link milik Anda

<div class='levelon'>
<div class='joinus-button'><a href='https://www.blogger.com/follow-blog.g?blogID=5298418528980018389' itemprop='url' target='_blank'><span itemprop='name'><i class='fa fa-user'/> Join Our Site</span></a></div>
<ul class='social-on'>
<li><a class='facebook' href='#' itemprop='url' target='_blank' title='Follow our Facebook'><span itemprop='name'/></a></li>
<li><a class='twitter' href='#' itemprop='url' target='_blank' title='Follow our Twitter'><span itemprop='name'/></a></li>
<li><a class='instagram' href='#' itemprop='url' target='_blank' title='Follow our Instagram'><span itemprop='name'/></a></li>
<li><a class='gplus' href='#' itemprop='url' target='_blank' title='Follow our Google+'><span itemprop='name'/></a></li>
</ul>
</div>
    <ul class='menu'>
        <li class='fa fa-user-o'><a href='#' itemprop='url'><span itemprop='name'>About</span></a></li>  
        <li class='fa fa-envelope-o'><a href='#' itemprop='url'><span itemprop='name'>Contact</span></a></li>
        <li class='fa fa-list-alt'><a href='#' itemprop='url'><span itemprop='name'>Sitemap</span></a></li>
        <li class='fa fa-check-square-o'><a href='#' itemprop='url'><span itemprop='name'>Disclaimer</span></a></li>
        <li class='fa fa-exclamation-triangle'><a href='#' itemprop='url'><span itemprop='name'>Privacy Policy</span></a></li>
    </ul>
</nav>

3. Mengatur Subscribe Box

Silahkan buka Blogger > Template > Edit HTML

Cari kode di bawah ini dan ganti naminakiky dengan feedburner blog Anda

<div id='namina-subs'>
<p>Join Our Newsletter</p> 
<div class='emailfield'>
<form action='https://feedburner.google.com/fb/a/mailverify' class='namina-form' method='post' novalidate='' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=naminakiky&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
  <input name='name' placeholder='Your name' title='Add your name' type='text'/>
  <input name='email' placeholder='Email *' title='Email' type='text'/>
  <input name='uri' type='hidden' value='naminakiky'/>
  <input name='loc' type='hidden' value='en_US'/>
  <input class='submitbutton' type='submit' value='Subscribe'/>
</form>
</div></div></div></div>

4. SEO Meta Tag

Template > Edit HTML

Cari dan ganti tiap tulisan di kode meta tag

<!-- [ Meta Tag SEO ] -->
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<script type='application/ld+json'>{ &quot;@context&quot;: &quot;http://schema.org&quot;, &quot;@type&quot;: &quot;WebSite&quot;, &quot;url&quot;: &quot;<data:blog.homepageUrl/>&quot;, &quot;potentialAction&quot;: { &quot;@type&quot;: &quot;SearchAction&quot;, &quot;target&quot;: &quot;<data:blog.homepageUrl/>?q={search_term}&quot;, &quot;query-input&quot;: &quot;required name=search_term&quot; } }</script>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + &quot;, &quot; + data:blog.pageTitle + &quot;, &quot; + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='DESKRIPSI-BLOG' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS/posts' rel='publisher'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS/about' rel='author'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS' rel='me'/>
<meta content='KODE-VALIDASI-GOOGLE-WEBMASTER' name='google-site-verification'/>
<meta content='KODE-VALIDASI-BING-WEBMASTER' name='msvalidate.01'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='NAMA-ADMIN' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<!-- [ Social Media Meta Tag ] -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Silakan kunjungi &quot; + data:blog.pageTitle + &quot; Untuk membaca postingan menarik.&quot;' property='og:description'/>
</b:if>
</b:if>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
</b:if>
<meta content='https://www.facebook.com/PROFIL-FACEBOOK' property='article:author'/>
<meta content='https://www.facebook.com/FAN-PAGE-FACEBOOK' property='article:publisher'/>
<meta content='KODE-APLIKASI-FACEBOOK' property='fb:app_id'/>
<meta content='KODE-ADMIN-FACEBOOK' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='USER-TWITTER' name='twitter:site'/>
<meta content='USER-TWITTER' name='twitter:creator'/>
<meta content='summary_large_image' name='twitter:card'/>

5. SEO

Untuk masalah SEO pada template ini sudah saya setting semaksimal mungkin sesuai dengan apa yang saya bisa. Sobat tidak perlu melakuan modifikasi apapun pada template ini.

6. Widget

Widget sitemap

Tambahkan kode di bawah ini di dalam postingan statis blog

<div id="bp_toc">
</div>
<script src="https://rawcdn.githack.com/Arlina-Design/redvision/master/daftar-isi-simple.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">#comments,#Label1,#FollowByEmail1{display:none;} /* CSS Full Sitemap */  #bp_toc{color:#000;margin:0 auto;overflow:auto;max-height:1400px;} span.toc-note{padding:20px 20px 30px 20px;margin:0 auto;display:block;text-align:center;color:#000;font-size:1.2rem;text-transform:uppercase;line-height:normal} .toc-header-col1{padding:10px;background-color:#f5f5f5;width:250px} .toc-header-col2{padding:10px;background-color:#f5f5f5;width:75px} .toc-header-col3{padding:10px;background-color:#f5f5f5;width:125px} #bp_toc td.toc-header-col1,#bp_toc td.toc-header-col2,#bp_toc td.toc-header-col3{border:0;border-bottom:1px solid rgba(0,0,0,0.1)} #bp_toc tr:nth-child(1) a{color:#666} #bp_toc td.toc-header-col1{background-color:#fff} #bp_toc td.toc-header-col2{background-color:#fff} #bp_toc td.toc-header-col3{background-color:#fff} #bp_toc td.toc-entry-col1,#bp_toc td.toc-entry-col2,#bp_toc td.toc-entry-col3{border:0} #bp_toc td a{color:#000} .toc-header-col1 a:link,.toc-header-col1 a:visited,.toc-header-col2 a:link,.toc-header-col2 a:visited,.toc-header-col3 a:link,.toc-header-col3 a:visited{font-size:13px;text-decoration:none;color:#aaa;font-family:&#39;Roboto&#39;;font-weight:700;letter-spacing:0.5px} .toc-header-col1 a:hover,.toc-header-col2 a:hover,.toc-header-col3 a:hover{text-decoration:none} .toc-entry-col1,.toc-entry-col2,.toc-entry-col3{padding:10px 5px;font-size:90%} .toc-entry-col1 a,.toc-entry-col2 a,.toc-entry-col3 a{color:#000;} .toc-entry-col1 a:hover,.toc-entry-col2 a:hover,.toc-entry-col3 a:hover{color:#3498db} #bp_toc table{width:100%;margin:0 auto;counter-reset:rowNumber} .toc-entry-col1{counter-increment:rowNumber} #bp_toc table tr td.toc-entry-col1:first-child::before{content:counter(rowNumber);min-width:1em;margin-right:0.5em;background:#70b8e7;color:#fff;padding:3px 5px;border-radius:3px;font-size:.8rem}#bp_toc td a{float:none;background:transparent;color:#666;font-size:100%;text-transform:capitalize;padding:0 0 0 5px;font-weight:400}#bp_toc td a:hover{color:#3498db}</style>

Widget Contact Form

Tambahkan kode di bawah ini di dalam postingan statis blog

Silakan isi form di bawah ini untuk menghubungi admin. Jika tidak ada halangan dan kesibukan lainnya, admin akan langsung merespon pesan yang Anda kirimkan.

<form name="contact-form">
Nama
<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />  
Alamat Email 
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />  
Isi Pesan
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea> 
<input id="ContactForm1_contact-form-submit" type="button" value="Kirim" />  
<div style="max-width: 100%; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
<style scoped="" type="text/css">#ContactForm1,#HTML97{display:none} #ContactForm1_contact-form-name,#ContactForm1_contact-form-email{width:50%;height:auto;margin:10px auto;padding:10px;background:#fff;color:#666;border:1px solid rgba(0,0,0,0.08)} #ContactForm1_contact-form-email-message{width:100%;height:175px;margin:10px auto;padding:10px;background:#fff;color:#666;border:1px solid rgba(0,0,0,0.08)} #ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{background:#fff;outline:none;border:1px solid rgba(0,0,0,0.18)} #ContactForm1_contact-form-submit{font-size:15px;width:101px;height:35px;float:left;color:#fff;padding:0;margin:10px 0 3px 0;cursor:pointer;background:#aeb2ba;border:none;border-radius:2px;transition:background 0.4s linear} #ContactForm1_contact-form-submit:hover{background:#e74c3c} #ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px} </style>

Gunakan script ini untuk membuat table Spesifikasi template, etc.

<table>
<tbody>
<tr> <th>Features</th>             <th>Availability</th>         </tr>
<tr> <td>Responsive</td>             <td>True <a href="#" rel="nofollow noopener" target="_blank">Cek</a></td>         </tr>
<tr> <td>Mobile Friendly</td>             <td>True <a href="#" rel="nofollow noopener" target="_blank">Cek</a></td>         </tr>
<tr> <td>Google Testing Tool Validator (Index)</td> <td>True <a href="#" rel="nofollow noopener" target="_blank">Cek</a></td>  </tr>
<tr> <td>Google Testing Tool Validator (Item)</td> <td>True <a href="#" rel="nofollow noopener" target="_blank">Cek</a></td>  </tr>
<tr> <td>SEO Friendly</td>             <td>True</td>         </tr>
<tr> <td>Personal Blog</td>             <td>True</td>         </tr>
<tr> <td>2 Column</td>             <td>True</td>         </tr>
<tr> <td>Top Navigation</td>             <td>True</td>         </tr>
<tr> <td>Breadcrumbs</td>             <td>True</td>         </tr>
<tr> <td>2 Option Search Box</td>             <td>True</td>         </tr>
<tr> <td>Back to Top Button</td>             <td>True</td>         </tr>
<tr> <td>Footer Menu</td>             <td>True</td>         </tr>
<tr> <td>ShareThis Share Button</td>             <td>True</td>         </tr>
<tr> <td>Featured Recent Post</td>             <td>Pro Version</td>         </tr>
<tr> <td>2 Option Comment System</td>             <td>Pro Version</td>         </tr>
<tr> <td>Fast Version</td>             <td>Pro Version</td>         </tr>
<tr> <td>Newsletter Widget</td>             <td>Pro Version</td>         </tr>
<tr> <td>Related Post</td>             <td>Pro Version</td>         </tr>
<tr> <td>Sticky Sidebar</td>             <td>Pro Version</td>         </tr>
<tr> <td>Image Lightbox</td>             <td>Pro Version</td>         </tr>
<tr> <td>Sitemap Widget</td>             <td>Pro Version</td>         </tr>
<tr> <td>Contact Form Widget</td>             <td>Pro Version</td>         </tr>
<tr> <td>Fixed Menu on Mobile</td>             <td>Pro Version</td>         </tr>
<tr> <td>Shortcodes</td>             <td>Pro Version</td>         </tr>
</tbody></table>

Script untuk link download

<div class="clear">
</div>
</div>
<div style="display: none;">
<div id="Theme-details">
<div id="store-style">
<a class="storebutton but1" href="#" rel="nofollow" target="_blank"><i class="fa fa-eye" aria-hidden="true"></i> Live Preview</a>
<a class="storebutton but2" href="#" target="_blank"><i class="fa fa-cloud-download" aria-hidden="true"></i> Pasword Theme</a>
<br />
<span class="pasword">Password Rar: <a href="#" target="_blank">Check it</a></span>
<div class="rio-ss idb">
</div>
</div>
<div id="store-style">
<div class="rio-ss">
<span class="storelist">Support Template Update</span>
<span class="storelist">Remove Footer Credits</span>
<span class="storelist">For Unlimited Domains</span>
<span class="storelist">No Encrypted Scripts</span>
<span class="storelist">And Many More...</span></div>
</div>
</div>

Memasang Video Youtube di Postingan
Tambahkan kode di bawah ini di dalam postingan blog pada tab HTML dan ganti link video youtube
ini _1EYAH8dmx0 dengan link video youtube Anda

Spoiler

<div id="flippy"><button>Spoiler</button></div>
<div id="flippanel">
--- TAMBAHKAN KONTEN DISINI ---
</div>

Membagi konten post menjadi tiga

<div class="bagitiga">
--- TAMBAHKAN KONTEN DISINI ---
</div>

<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/_1EYAH8dmx0">
</div>
</div>
</div>

Menambahkan Kode Highlighter di Postingan
Tambahkan kode di bawah ini di dalam postingan blog pada tab HTML dan ganti tulisan ini --PASTE KODE DI SINI-- dengan tulisan kode HTML/JavaScript/CSS Anda

<pre><code>--PASTE KODE DI SINI--</code></pre>

Trimakasih

Template Tips Blogger

Documentation Templates LivaTheme

Nikami Minggu, 16 Juni 2019

This template uses a vertical navigation menu beside the left with an approved and optimized sub menu, as well as a homepage posting display that uses a different grid design from the previous Material Design template.

Documentation Templates Masign Alpha Premium Version 2.0

SEO Meta Tag
Please open Blogger> Themes> Click Edit HTML

<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + &quot;, &quot; + data:blog.pageTitle + &quot;, &quot; + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='hacking, tutorial, tips, trik, cara-cara, internet, blog, seo, komputer, game, moba, facebook, blogging, optimization' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='https://www.blogger.com/profile/xxxxx' rel='publisher'/>
<link href='https://www.blogger.com/profile/xxxxx' rel='author'/>
<link href='https://www.blogger.com/profile/xxxxx' rel='me'/>
<meta content='xxxxx' name='google-site-verification'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='ADMIN NAME' name='Author'/>
<meta content='id' name='geo.country'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>  
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageName' property='og:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta content='xxxxx' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='xxxxx' property='fb:admins'/>
<meta content='xxxxx' property='fb:app_id'/>
<meta expr:content='data:blog.title' name='twitter:site'/>
<meta content='@xxxxx' name='twitter:creator'/>

Menu on Click
Please open Blogger> Themes> Click Edit HTML
This menu location is on the left of your site.

<div id='headermenu'>
  <li><a class='waves-effect' href='#' itemprop='url' title='About'><span itemprop='name'>About</span></a></li>
  <li><a class='waves-effect' href='#' itemprop='url' title='Contact'><span itemprop='name'>Contact</span></a></li>
  <li><a class='waves-effect' href='#' itemprop='url' title='Sitemap'><span itemprop='name'>Sitemap</span></a></li>
  <li><a class='waves-effect' href='#' itemprop='url' title='Disclaimer'><span itemprop='name'>Disclaimer</span></a></li>
</div>

Social Media
Please open Blogger> Themes> Click Edit HTML
Change # with your Social Media URL.

<a class='blanter' href='#' itemprop='sameAs' target='_blank' title='Instagram'><i aria-hidden='true' class='fa fa-instagram'/></a>
<a class='blanter' href='#' itemprop='sameAs' target='_blank' title='Twitter'><i aria-hidden='true' class='fa fa-twitter'/></a>
<a class='blanter' href='#' itemprop='sameAs' target='_blank' title='Facebook'><i aria-hidden='true' class='fa fa-facebook'/></a>

Menu Navigation
Please open Blogger> Themes> Click Edit HTML
Change # with your Menu URL.

<div id='css-menu' itemprop='mainEntity' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>
<div id='cssmenu'>
<div class='profilemenu'>
<img expr:alt='data:blog.title' expr:title='data:blog.title' src='https://1.bp.blogspot.com/-aGIAA5RiK_k/XHUR9j78l9I/AAAAAAAACgM/QDFpPUS97bYXkY3GCx0g9XIHQecefeXBACLcBGAs/s1600/md-image.png'/>
<h3><data:blog.title/></h3>
<a class='ripple' href='javascript:;' id='info2'><i class='material-icons'>&#58821;</i></a>
<p>The Best Download.</p>
</div>
<ul id='nav-menu1'>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Google+</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Facebook</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Twitter</span></a></li>
</ul>
<ul id='navmenu2'>
<li><a class='waves-effect' href='/' itemprop='url' title='Home'><i class='material-icons'>&#59530;</i> <span itemprop='name'>Home</span></a></li>
<li class='has-sub'><a class='waves-effect' href='#' title='Apps'><i class='material-icons'>&#58819;</i> <span itemprop='name'>Apps</span></a>
<ul>
<li><a class='waves-effect' href='#' title='Themes'><span itemprop='name'>Themes</span></a></li>
<li><a class='waves-effect' href='#' title='Layout'><span itemprop='name'>Layout</span></a></li>
<li><a class='waves-effect' href='#' title='Settings'><span itemprop='name'>Settings</span></a></li>
</ul>
</li>
<li class='has-sub'><a class='waves-effect' href='#' itemprop='url' title='Groups'><i class='material-icons'>&#59375;</i> <span itemprop='name'>Groups</span></a>
<ul>
<li><a class='waves-effect' href='#' title='Blogger'><span itemprop='name'>Blogger</span></a></li>
<li><a class='waves-effect' href='#' title='Design'><span itemprop='name'>Design</span></a></li>
</ul>
</li>
<li><a class='waves-effect' href='#' itemprop='url' title='Bookmarks'><i class='material-icons'>&#59525;</i> <span itemprop='name'>Bookmarks</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Trending Topic'><i class='material-icons'>&#59406;</i> <span itemprop='name'>Trending Topic</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Feedback'><i class='material-icons'>&#59519;</i> <span itemprop='name'>Feedback</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Online Store'><i class='material-icons'>&#59596;</i> <span itemprop='name'>Online Store</span></a></li>
</ul>
</div>
</div>

Newsletter

Open Layout

Change DuniaBlanter with your Feedburner ID.

<div id='material-subscribe'>
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=DuniaBlanter', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<div class="input-field">
<input class="inputfield" name="email" type="email" required="" class="validate"/>
<span class="highlight"></span>
<span class="bar"></span>
<label>Email</label>
<input type="hidden" value="DuniaBlanter" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<button class="buttonx subs waves-effect waves-light" type="submit"/><i class="fa fa-envelope"></i> Subscribe</button>
</div>
</form>
</div>

Blog Post Button

Change YOUR-LINK with your link.

<a class="buttonx" href="YOUR-LINK" target="_blank" title="Preview">Preview</a>

This Button have 7 Colors You can change to : "buttonx color + x" = "buttonx greenx"

<a class="buttonx greenx" href="YOUR-LINK" target="_blank" title="Preview">Preview</a>

Color : indigox, pinkx, bluex, greenx, orangex, redx, purplex

Thank you

Template

Documentation Templates Masign Alpha Premium Version 2.0

Nikami Senin, 03 Juni 2019

Asal Seo adalah template Blogger dengan layout Responsif dan cocok untuk semua blog. Dengan desain yang memiliki kombinasi warna Dark yang Cooll, terlihat berani dan modern, SEO Optimized, dan telah dibangun dengan menggunakan beberapa trend desain saat ini yang paling populer.
Nav Menu
Silahkan buka Blogger > Tema > Klik Edit HTML
Cari kode di bawah ini dan temukan kode # di bawahnya lalu ganti kode # dengan link blog Anda

   <ul>
      <li><a href='#' itemprop='url'><span itemprop='name'>Entertainment</span></a></li>
      <li><a href='#' itemprop='url'><span itemprop='name'>Featured</span></a></li>
      <li><a href='#' itemprop='url'><span itemprop='name'>Food</span></a></li>
      <li><a href='#' itemprop='url'><span itemprop='name'>Lifestyle</span></a></li>
      <li><a href='#' itemprop='url'><span itemprop='name'>Music</span></a></li>
      <li><a href='#' itemprop='url'><span itemprop='name'>Travel</span></a></li>
      <li>
         <a href='#' itemprop='url'><span itemprop='name'>Filter <i aria-hidden='true' class='fa fa-angle-down fa-fw'/></span></a>
         <ul>
            <li><a href='#' itemprop='url'><span itemprop='name'>Product 1</span></a></li>
            <li><a href='#' itemprop='url'><span itemprop='name'>Product 2</span></a></li>
            <li><a href='#' itemprop='url'><span itemprop='name'>Product 3</span></a></li>
         </ul>
      </li>
   </ul>

Footer Menu
Silahkan buka Blogger > Tema > Klik Edit HTML Cari kode di bawah ini dan temukan kode di bawahnya lalu ganti kode dengan link blog Anda

<ul class='menufoot mobile-hide' itemprop='mainEntity' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
<li><a href='/p/paypal.html' itemprop='url' title='Paypal'><span itemprop='name'><i aria-hidden='true' class='fa fa-paypal'/> Paypal</span></a></li>
<li><a href='/p/contact-form.html' itemprop='url' title='Contact'><span itemprop='name'><i aria-hidden='true' class='fa fa-envelope'/> Contact</span></a></li>
<li><a href='/p/disclaimer.html' itemprop='url' title='Disclaimer'><span itemprop='name'><i aria-hidden='true' class='fa fa-book'/> Disclaimer</span></a></li>
<li><a href='/p/privacy-policy.html' itemprop='url' title='Privacy Policy'><span itemprop='name'><i aria-hidden='true' class='fa fa-cloud'/> Privacy Policy</span></a></li>
<li><a href='/p/sitemap.html' itemprop='url' title='Sitemap'><span itemprop='name'><i aria-hidden='true' class='fa fa-list'/> Sitemap</span></a></li>
</ul>

Meta Tag Seo
Tema > Klik Edit HTML Cari dan ganti tiap tulisan di kode meta tag di bawah ini pada template.

<!-- [ Meta Tag SEO ] -->
<include expiration='7d' path='*.css'/>
<include expiration='7d' path='*.js'/>
<include expiration='3d' path='*.gif'/>
<include expiration='3d' path='*.jpeg'/>
<include expiration='3d' path='*.jpg'/>
<include expiration='3d' path='*.png'/>
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='https://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<script type='application/ld+json'>{ &quot;@context&quot;: &quot;https://schema.org&quot;, &quot;@type&quot;: &quot;WebSite&quot;, &quot;url&quot;: &quot;<data:blog.homepageUrl/>&quot;, &quot;potentialAction&quot;: { &quot;@type&quot;: &quot;SearchAction&quot;, &quot;target&quot;: &quot;<data:blog.homepageUrl/>?q={search_term}&quot;, &quot;query-input&quot;: &quot;required name=search_term&quot; } }</script>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<meta expr:content='data:blog.pageName + &quot;, &quot; + data:blog.pageTitle + &quot;, &quot; + data:blog.title' name='keywords'/>
</b:if></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='DESKRIPSI-BLOG' name='keywords'/></b:if>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/>
<link expr:href='&quot;https://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.postImageThumbnailUrl'>
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/>
</b:if></b:if>
<link expr:href='data:blog.url' hreflang='x-default' rel='alternate'/>
<link href='/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS/posts' rel='publisher'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS/about' rel='author'/>
<link href='https://plus.google.com/USER-GOOGLE-PLUS' rel='me'/>
<meta content='KODE-VALIDASI-GOOGLE-WEBMASTER' name='google-site-verification'/>
<meta content='KODE-VALIDASI-BING-WEBMASTER' name='msvalidate.01'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='NAMA-ADMIN' name='Author'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<!-- [ Social Media Meta Tag ] -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Silakan kunjungi &quot; + data:blog.pageTitle + &quot; Untuk membaca postingan menarik.&quot;' property='og:description'/>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
</b:if>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
</b:if>
</b:if>
<meta content='https://www.facebook.com/PROFIL-FACEBOOK' property='article:author'/>
<meta content='https://www.facebook.com/FAN-PAGE-FACEBOOK' property='article:publisher'/>
<meta content='KODE-APLIKASI-FACEBOOK' property='fb:app_id'/>
<meta content='KODE-ADMIN-FACEBOOK' property='fb:admins'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='USER-TWITTER' name='twitter:site'/>
<meta content='USER-TWITTER' name='twitter:creator'/>
<meta content='summary_large_image' name='twitter:card'/>

Widget Recent Post by Label

Klik menu Tata Letak > Klik Edit pada widget recent-sec2 (Di Footer) Ganti label Slipknot yang ada di dalam widget dengan label Anda pada kode seperti ini

[Slipknot][recentbylabel]

Breaking News
Silahkan buka Blogger > Tema > Klik Edit HTML
Cari kode di bawah ini dan temukan ini : https://metaltailaco.blogspot.com di bawahnya lalu ganti dengan link blog Anda

// Breaking News
$(document).ready(function(){var e="https://metaltailaco.blogspot.com/",t=10;$.ajax({url:""+e+"/feeds/posts/default?alt=json-in-script&amp;max-results="+t,type:"get",dataType:"jsonp",success:function(e){function t(){$("#recentbreaking li:first").slideUp(function(){$(this).appendTo($("#recentbreaking ul")).slideDown()})}var n,r,a="",i=e.feed.entry;if(void 0!==i){a="<ul>";for(var l=0;l<i.length;l++){for(var s=0;s<i[l].link.length;s++)if("alternate"==i[l].link[s].rel){n=i[l].link[s].href;break}r=i[l].title.$t,a+='<li><i class="fa fa-check-square"></i><a href="'+n+'" target="_blank">'+r+"</a></li>"}a+="</ul>",$("#recentbreaking").html(a),setInterval(function(){t()},5e3)}else $("#recentbreaking").html("<span>There nothing here?</span>")},error:function(){$("#recentbreaking").html("<strong>Error Loading Feed!</strong>")}})});

Pemasangan Iklan di Safelink
Silahkan buka Blogger > Tema > Klik Edit HTML
Cari kode di bawah ini dan temukan ini : ==== YOUR ADS ==== di bawahnya lalu ganti dengan KODE IKLAN ANDA

<center>

==== YOUR ADS ====
<!-- Kode iklan di sini -->

           </center><br/>
<div id='timer'/>
<div class='text-center'>
<button class='btn bt-success hidden' disabled='' id='getlink'>Get Link</button>
<br/>

<!-- Kode iklan di sini -->
==== YOUR ADS ====

</div>

Dan ini

<br/><center>

==== YOUR ADS ====
<!-- Kode iklan di sini -->

</center><br/>
<div class='text-center'>
<button class='btn bt-success hidden' disabled='' id='gotolink'>Go to Link</button>
<div style='margin:auto;display:inline-block'>
<!-- Kode iklan di sini -->
</div>
</div><br/>
<center>

<!-- Kode iklan di sini -->
==== YOUR ADS ====

           </center>

Auto Safelink

Untuk menggunakan Auto Safelink, tambahkan kode di bawah ini di blog utama Anda tepat sebelum kode </body> agar otomatis semua link yang ada di blog utama mengarah ke blog Safelink Anda.

<script type="text/javascript">
//<![CDATA[
var setting={exceptionurl:"google.com,twitter.com",path:"#?o="};
//]]>
</script>
<script src="https://cdn.jsdelivr.net/gh/Indzign/theme@master/autosafelink.js"></script>
<script src="https://www.blogger.com/feeds/3441289521812010022/posts/default?alt=json-in-script&max-results=150&callback=showurl"></script>

Ganti ID blog ini 3441289521812010022 dengan ID blog Safelink Anda. Dan tambahkan URL pengecualian pada kode exceptionurl.

Untuk Demonya Silahkan Convert Link di Halaman Depan Blog ini

Template

Documentation Templates Asal Seo Safelik Premium

Nikami Sabtu, 01 Juni 2019

1. Pada bagian menu Anda hanya bisa menambahkan 6 link saja

2. Untuk mengedit bagian Tanggal dan waktu

Anda bisa cari kode di bawah ini di dalam template

<script language='Javascript'>
      var dayName = new Array(&quot;Minggu&quot;, &quot;Senin&quot;, &quot;Selasa&quot;, &quot;Rabu&quot;, &quot;Kamis&quot;, &quot;Jumat&quot;, &quot;Sabtu&quot;);
      var monName = new Array(&quot;Januari&quot;, &quot;Februari&quot;, &quot;Maret&quot;, &quot;April&quot;, &quot;Mei&quot;, &quot;Juni&quot;, &quot;Juli&quot;, &quot;Agustus&quot;, &quot;September&quot;, &quot;Oktober&quot;, &quot;November&quot;, &quot;Desember&quot;);
      var now = new Date();
      document.write(&quot;<i aria-hidden='true' class='fa fa-bell'/>&quot; + &quot; &quot; + dayName[now.getDay()] + &quot;,&quot; + &quot; &quot; + now.getDate() + &quot; &quot; + monName[now.getMonth()] + &quot;&quot;);
   </script>

3. Di dalam template ini sudah terdapat tombol reaksi dari Vicomi, silakan ikuti tutorial ini Cara Memasang Tombol Reaksi di Blogger dengan Vicomi. Anda hanya cukup mengganti kode tokennya saja.

4. Untuk mengganti username Disqus, silakan cari tulisan kabarisehat di editor template dan ganti dengan user name Disqus blog Anda.

5. Ganti semua link https://www.facebook.com/kabarsehatku/ dan tulisan Kabar Sehat di dalam widget fanpage di sidebar

<div class="fb-page" data-href="https://www.facebook.com/kabarsehatku/" data-tabs="timeline" data-height="250" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/kabarsehatku/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/kabarsehatku/">Kabar Sehat</a></blockquote></div>

6. Tambahkan kode di bawah ini di post halaman statis, untuk tutorialnya bisa di cek di halaman ini Cara Memasang Daftar Isi Ala Blog Kang Ismet

<style scoped="scoped" type="text/css">
/* Multi Recent Post */
.post-body *,.post-body *:after,.post-body *:before{box-sizing:initial;-webkit-box-sizing:initial;-moz-box-sizing:initial;}
.list-entries{background:#fdfdfd;margin:1.5% 1%;width:31.3%;float:left;font-size:80%;}
.list-entries ul,.list-entries li{margin:0;list-style:none}
#feed-list-container ul li{background:#fff;padding:15px;line-height:normal;border:1px solid rgba(0,0,0,0.08);border-top:0;transition:all .3s;}
#feed-list-container ul li:hover{background:#fafafa;}
#feed-list-container ul li:last-child{border-bottom:0;}
.list-entries .main-title{padding:0;overflow:hidden;}
.list-entries .main-title h4{position:relative;display:block;font:inherit;overflow:hidden;font-weight:700;padding:1em 1.5em;margin:0;line-height:normal;font-size:120%;border:1px solid rgba(0,0,0,0.08);box-shadow:inset 0 1px #f96d5e}
.list-entries .main-title h4:after{display:inline-block;content:"\f02c";font-family:fontAwesome;font-size:17.4px;font-style:normal;top:0;right:0;padding:1em 1.25em;position:absolute;font-weight:400;color:#999;transition:all .3s;}
.list-entries .main-title h4:hover:after{transform:rotate(360deg)}
.list-entries .title a{font-size:14px;text-decoration:none;line-height:.5em;color:#333;font-weight:700;transition:all .3s;}
.list-entries .title a:hover{color:#222;text-decoration:underline}
.list-entries img,.list-entries .fake-img{border:none;background:#f5f5f5;margin:0 1em 0 0;padding:0;float:left;width:72px!important;height:auto!important}
.list-entries .summary{overflow:hidden;color:#999}
.list-entries .more-link{border-bottom:none;}
.list-entries .more-link a{display:block;line-height:2em;height:2em;overflow:hidden;text-decoration:none;background-color:#f5f5f5;padding:1em 1.5em;position:relative;font-weight:400;color:#888;transition:initial}
.list-entries .more-link a:hover{background-color:#2f3542;color:#fff;}
.list-entries .more-link a:after{display:inline-block;content:"\f054";font-family:fontAwesome;font-size:16px;font-style:normal;background-color:#f0f0f0;color:#ccc;top:0;right:0;padding:1em 1.25em;position:absolute;font-weight:400}
.list-entries .more-link a:hover:after{background-color:#57606f;color:#fff;}
.widget .post-body ul, .widget .post-body ol {position:relative;}
#feed-list-container ul li:nth-child(1) img{width:100%!important;height:auto!important;float:none;margin:0 0 10px 0}
#feed-list-container ul li:nth-child(1) .title{position:absolute;bottom:10%;left:20px;right:20px;z-index:3}
#feed-list-container ul li:nth-child(1) .title a{display:block;font-size:1rem;line-height:normal;overflow:hidden;padding:0 10px 0 0;color:#fff}
#feed-list-container ul li:nth-child(1) .inner{position:relative;max-height:180px}
#feed-list-container ul li:nth-child(1) .inner:before{content:'';background:rgba(0,0,0,0.3);position:absolute;left:0;right:0;top:0;bottom:0;z-index:2;transition:all .3s;}
#feed-list-container ul li:nth-child(1):hover .inner:before{background:rgba(0,0,0,0.6)}
.inner{height:auto!important}
@media (max-width:768px){
.list-entries {width:100%;}
.list-entries{margin:2.5% 1%;}}
</style>
<div id="feed-list-container">
</div>
<div style="clear: both;">
</div>
<script type="text/javascript">
var multiFeed = {
    feedsUri: [
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        },
        {
            name: "Blog",
            url: "https://viralgoks.blogspot.com/",
            tag: "Blog"
        }
],
    numPost: 4,
    showThumbnail: true,
    showSummary: true,
    summaryLength: 0,
    titleLength: "auto",
    thumbSize: 270,
    containerId: "feed-list-container",
    readMore: {
        text: "Selengkapnya",
        endParam: "?max-results=8"
    }
};
</script>
<script src="https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/multi-feed.js" type="text/javascript"></script>

Tips Blogger Trik Blogger

Pengaturan tambahan untuk template Viral Go! Versi kabar Sehat

Nikami Kamis, 16 Mei 2019

Documentation Template Editan Masign Kepo Disqus Komentar . Template ini adalah Bongkaran Dari Template Masign Magz Premium yang di edit oleh admin Metaltailaco .
ok sekian info nya hehee...

Meta Seo

<link href='https://www.blogger.com/profile/Code-Profil-Blogger' rel='publisher'/>
<link href='https://www.blogger.com/profile/Code-Profil-Blogger' rel='author'/>
<link href='https://www.blogger.com/profile/Code-Profil-Blogger' rel='me'/>
<meta content='XXXXXXXXXX' name='google-site-verification'/>
<meta content='XXXXXXXXXX' name='msvalidate.01'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='MetalTailaco' name='Author'/>
<meta content='general' name='rating'/>
<meta content='ID' name='geo.country'/>

Meta Sosial

<meta content='YOURFBUSERID' property='fb:admins'/>
<meta content='YOURFBAPPSID' property='fb:app_id'/>
<meta content='@USERNAME' name='twitter:site'/>
<meta content='@USERNAME' name='twitter:creator'/>

Top Menu

<div class='btopmenu'>
<a class='waves-effect waves-light' href='/p/about.html' title='About Us'>About Us</a>
<a class='waves-effect waves-light' href='/p/contact.html' title='Contact Us'>Contact Us</a>
<a class='waves-effect waves-light' href='/p/sitemap.html' title='Sitemap'>Sitemap</a>
<a class='waves-effect waves-light' href='#' title='Privacy Policy'>Privacy Policy</a>
<a class='waves-effect waves-light' href='#' title='Disclaimer'>Disclaimer</a>
</div>

Nav Menu

<ul class='menutamvan' id='menutamvan'>
<li><a class='waves-effect waves-light' href='/search/label/Aplikasi Karaoke?&amp;max-results=8' itemprop='url' title='Software'><span itemprop='name'>Software</span></a></li>
<li><a class='waves-effect waves-light' href='/search/label/Games' itemprop='url' title='Games'><span itemprop='name'>Games</span></a></li>
<li class='clicksub'><a class='subsub waves-effect waves-light' href='javascript:;' itemprop='url' title='Movie'><span itemprop='name'>Movie&lt;/span></a>
<ul>
<li><a class='waves-effect' href='#' itemprop='url' title='Action'><span itemprop='name'>Action&lt;/span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Romance'><span itemprop='name'>Romance</span></a></li>
</ul>
</li>
<li class='clicksub'><a class='subsub waves-effect waves-light' href='javascript:;' itemprop='url' title='Artikel'><span itemprop='name'>Artikel</span></a>
<ul>
<li><a class='waves-effect' href='#' itemprop='url' title='Health'><span itemprop='name'>Health&lt;/span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Education'><span itemprop='name'>Education</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Tutorial'><span itemprop='name'>Tutorial&lt;/span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='News'><span itemprop='name'>News&lt;/span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Economy'><span itemprop='name'>Economy&lt;/span></a></li>
<li><a class='waves-effect' href='#tech' itemprop='url' title='Technology'><span itemprop='name'>Technology</span></a></li>
</ul>
</li>
<li class='subpost'><a class='munculpost' href='#' itemprop='url' title='Group'><span itemprop='name'>Komunitas</span></a>
<ul class='submenu'>
<li><a href='https://wiendhywiana.blogspot.com/search/label/Tips Blogger?&amp;max-results=10' target='_blank' title='Tips'><i class='fa fa-lightbulb-o '/> Tips  Trik</a></li>
<li><a href='https://stressthinking.blogspot.com/search/label/Software%20Karaoke?&amp;max-results=10' target='_blank' title='Software Karaoke'><i class='fa fa-microphone'/> Karaoke&lt;/a></li>
<li><a href='https://stressthinking.blogspot.com/search/label/List%20Style?&amp;max-results=10' target='_blank' title='Tech'><i class='fa fa-glass'/> New Update</a></li>
</ul>
</li>
<li class='subpost'><a class='munculpost' href='#' itemprop='url' title='Template'><span itemprop='name'>Template</span></a>
<ul class='submenu'>
<li><a href='https://metaltailaco.blogspot.com/search/label/List?&amp;max-results=10' target='_blank' title='Template'><i class='fa fa-laptop'/> Style List</a></li>
<li><a href='https://metaltailaco.blogspot.com/search/label/Grid?&amp;max-results=10' target='_blank' title='Template'><i class='fa fa-laptop'/>  Style Grid</a></li>
<li><a href='https://metaltailaco.blogspot.com/search/label/Amp?&amp;max-results=10' target='_blank' title='Template'><i class='fa fa-laptop'/> Style Amp</a></li>
<li><a href='https://metaltailaco.blogspot.com/search/label/Safelink?&amp;max-results=10' target='_blank' title='Template'><i class='fa fa-laptop'/> Style Safelink</a></li>
<li><a href='https://metaltailaco.blogspot.com/search/label/Donate?&amp;max-results=10' target='_blank' title='Template'><i class='fa fa-laptop'/> Style Donate</a></li>
</ul>
</li>
</ul>

Newsletter

<form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=Wiendhy&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Email address&quot;;}' onfocus='if (this.value == &quot;Email address&quot;) {this.value = &quot;&quot;;}' type='text' value='Email address'/>
<input name='uri' type='hidden' value='Wiendhy'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='submitfooter' type='submit' value='Subscribe'/>
</form>

Footer Menu

<div class='footer-menu'>
<h3>Our Site</h3>
<ul class='footer2 line'>
<li><a href='/p/contact-form_21.html' title='Contact Form'>Contact Form</a></li>
<li><a href='/p/disclaimer.html' title='Disclaimer'>Disclaimer</a></li>
<li><a href='/p/privacy-policy.html' title='Privacy Policy'>Privacy Policy</a></li>
<li><a href='/p/sitemap_21.html' title='Daftar Isi Blog'>Sitemap</a></li>
<li><a href='/p/tost.html' title='Terms of Service'>Terms of Service</a></li>
</ul>
</div>

Setiap yang saya tandai warna Merah ganti sesuai keinginan anda

Disqus Comment
Cari Dan Ganti dengan id disqus Anda : Metaltailaco

<script type='text/javascript'>
var disqus_shortname = &quot;metaltailaco&quot;;
!function(){var e=document.createElement(&quot;script&quot;);e.type=&quot;text/javascript&quot;,e.async=!0,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/blogger_index.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
</script>

Khusus Tampilan Sederhana
Notification : Cari code dibawah ini dan ganti kata yang saya tandai dengan kata keinginan anda

<div class='blanternotif'>
<div class='blantertitle'>Notification</div>
<div class='notiftext'>
This is just an example, you can fill it later with your own note.</div>
<a class='waves-effect waves-light close-sf' href='javascript:;' title='Done'>Done</a>
<a class='waves-effect icx close-sf' href='javascript:;'/>
</div>

This is just an example, you can fill it later with your own note.

Recent Post
Cari Dan Ganti dengan url blog Anda : https://metaltailaco.blogspot.com
Dan Ganti ini dengan Label yang anda inginkan : Grid


<script type='text/javascript'>
//<![CDATA[
// Recent Post Settings
var recentpost_url = "https://metaltailaco.blogspot.com";
var numPosts = 8;
var recentpost_label = "Grid";
// Recent Post
function recentPosts(e){if(document.getElementById("recent-posts")){for(var t,s,r=e.feed.entry,n="",a=document.getElementById("recent-posts"),l=0;l<numPosts;l++){for(var c=0;c<numPosts;c++)if("alternate"==r[l].link[c].rel){s=r[l].link[c].href;break}"media$thumbnail"in r[l]?u=r[l].media$thumbnail.url.replace(/.*?:\/\//g,"//").replace(/\/s[0-9]+\-c/g,"/s300"):u="https://1.bp.blogspot.com/-jHWwEwTEwQ4/WJJ4k71QSYI/AAAAAAAApVc/XO_OitR_VGQS_Wquq1pv1h1D-dgiejSuQCLcB/s90/nothumb_large.png";var t=r[l].title.$t;n+='<li class="recent-posts"><a href="'+s+'" title="'+t+'" target="_blank"><img src="'+u+'" alt="'+t+'"></a><div class="title_post"><a href="'+s+'" title="'+t+'" target="_blank">'+t+"</a></div></li>"}a.innerHTML=n}}var rcp=document.createElement("script");rcp.src=recentpost_url+"/feeds/posts/default/-/"+recentpost_label+"?orderby=published&alt=json-in-script&max-results="+numPosts+"&callback=recentPosts",document.getElementsByTagName("head")[0].appendChild(rcp);
// Recent Post Title
var titlerecentpost = document.getElementById("xtitlex");
titlerecentpost.innerHTML='<div class="recenthd"><svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-1 9H9V9h10v2zm-4 4H9v-2h6v2zm4-8H9V5h10v2z"/></svg><h2>'+recentpost_label+'</h2><a class="gorecent" href="'+recentpost_url+'/search/label/'+recentpost_label+'" title="Recent Post" target="_blank">View More</a></div>';
//]]>
</script>

Membuat Tombol Demo Download

<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="YOUR-LINK-HERE" target="_blank">DEMO</a></li>
<li><a class="download" href=" YOUR-LINK-HERE" target="_blank">DOWNLOAD</a></li>
</ul>
</div>
<div class="clear"></div>

DOWNLOAD TEMPLATE

Template Tips Blogger

Documentation Template Editan Masign Kepo Disqus Komentar

Nikami Minggu, 21 April 2019

Cara Membuat Featured Slider Post di Blogger - Tutorial cara membuat featured post di blogger. sudah banyak orang share tutorial tentang featured post .. dan sedikit yang masih bisa work .. karena hampir semua blog itu hanya copas .. jadi apabila 1 mati javascript semua mati ... nah untuk kesempatan kali ini saya akan membagikan featured post keren dengan bintang yang masih work dan sangan ringan .. untuk memasang nya pun tidak memberatkan loading suatu blogger ..
langsung saja ke tutorialnya

1. Masuk Ke Blogger
2. Template > Edit Html
3. Masukan css di bawah ini tepat diatas kode </head>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
.box-tag a{padding:2px 8px;background-color:#3cbd1b;color:#fff!important;font-size:11px;z-index:999;font-weight:400;margin-bottom:5px;text-transform:uppercase;text-shadow:0 1px 1px rgba(0,0,0,.2)}.recent-slider .carousel{position:relative;margin:30px 0 25px!important;padding:0;overflow:visible;height:auto;display:block;clear:both}.recent-slider .carousel h2{display:none}.main-carousel{overflow:hidden}.carousel-abdoutech{padding:0!important;position:relative;overflow:hidden;list-style:none}.carousel-thumb{width:100%;height:380px;position:relative;display:block}.carousel-abdoutech .box-image{width:100%;height:100%;position:relative;display:block}.carousel-abdoutech .box-image:after{display:block;position:absolute;bottom:0;width:100%;height:100%;z-index:1;background:url(https://4.bp.blogspot.com/--OzH85Gymqc/Wdim0oCVnaI/AAAAAAAAA48/89VTnKzv4HEVKS3tixaIiUbI3PPbjnOWgCLcBGAs/s1600/pattern.png) top right rgba(58,78,90,.4)}.carousel-content,.featured .post-panel{transition:all .35s;box-sizing:border-box}.boxes ul li:hover .box-image:after,.bx-first:hover .bf-thumb:after,.carousel-abdoutech:hover .box-image:after{opacity:.2}.carousel-content{position:absolute;bottom:0;background:rgba(0,0,0,.31);width:100%;z-index:2;-moz-transition:all .35s;-webkit-transition:all .35s;-o-transition:all .35s;padding:15px;text-align:right}.main-carousel .owl-dots,.owl-carousel .owl-item:hover .carousel-content{bottom:10px}.carousel-abdoutech .recent-title{margin:10px 0 3px;font-size:18px;font-weight:600}.carousel-abdoutech .recent-title a{color:#fff;display:inline-block;line-height:1.2em;text-shadow:0 .5px .5px rgba(34,34,34,.3)}.carousel-abdoutech .recent-date{color:#ccc}.carousel-tag a{padding:2px 8px;background-color:red;color:#fff!important;font-size:11px;z-index:999;font-weight:400;text-transform:uppercase;text-shadow:0 1px 1px rgba(0,0,0,.3)}.main-carousel .owl-next,.main-carousel .owl-prev{margin-top:0;font-size:25px;line-height:40px;position:absolute;top:170px;width:47px;height:47px;cursor:pointer;z-index:999}.main-carousel .owl-prev{right:0;background:url(https://3.bp.blogspot.com/-ADZMmpLRh0Q/WdimNULjiRI/AAAAAAAAA40/l12f8MdQUCEMYSNV95wHA_EbQ8HLu3WAQCLcBGAs/s1600/next.png) 100% 0 no-repeat}.main-carousel:hover .owl-prev{right:0}.main-carousel .owl-next{left:0;background:url(https://3.bp.blogspot.com/-ADZMmpLRh0Q/WdimNULjiRI/AAAAAAAAA40/l12f8MdQUCEMYSNV95wHA_EbQ8HLu3WAQCLcBGAs/s1600/next.png) no-repeat}.main-carousel:hover .owl-next{left:-1px}.recent-date{color:#bdbdbd;font-size:12px;font-weight:400}.featured-date:before,.recent-date:before{content:'\f017';font-family:fontawesome;margin-left:5px}.owl-carousel .animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0{opacity:1}100%{opacity:0}}@keyframes fadeOut{0{opacity:1}100%{opacity:0}}.owl-height{-webkit-transition:height .5s ease-in-out;-moz-transition:height .5s ease-in-out;-ms-transition:height .5s ease-in-out;-o-transition:height .5s ease-in-out;transition:height .5s ease-in-out}.owl-carousel{display:none;width:100%;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-controls .owl-dot,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel .owl-refresh .owl-item{display:none}.owl-carousel .owl-item{position:relative;min-height:1px;float:right;-webkit-backface-visibility:visible;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-dots,.owl-next,.owl-prev{position:absolute;text-align:center}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:left}.no-js .owl-carousel{display:block}.owl-next,.owl-prev{top:0;color:#1c1c1c;background-color:rgba(255,255,255,.8);font-family:FontAwesome;z-index:1;display:block;cursor:pointer;padding:0;overflow:hidden}.owl-prev{right:0}.owl-next{left:0}.owl-dots{bottom:1px;width:33.33%;right:0;left:0;margin:auto}.star_rating{position:absolute;top:0;left:0;z-index:2;font-size:14px;padding:5px 10px;background:rgba(35,40,45,.6)}li.carousel-abdoutech .star_rating .fa:nth-child(1){color:red}li.carousel-abdoutech .star_rating .fa:nth-child(2){color:#f50}li.carousel-abdoutech .star_rating .fa:nth-child(3){color:#fa0}li.carousel-abdoutech .star_rating .fa:nth-child(4){color:#3cbd1b}li.carousel-abdoutech .star_rating .fa:nth-child(5){color:#127adb}.carousel-abdoutech .box-image:after{display:block;position:absolute;bottom:0;width:100%;height:100%;z-index:1;background:url(https://4.bp.blogspot.com/--OzH85Gymqc/Wdim0oCVnaI/AAAAAAAAA48/89VTnKzv4HEVKS3tixaIiUbI3PPbjnOWgCLcBGAs/s1600/pattern.png) top right rgba(58,78,90,.4)}.carousel-abdoutech .box-image:after{content:'';opacity:.8;transition:all .35s;right:0;-moz-transition:all .35s;-webkit-transition:all .35s;-o-transition:all .35s}.carousel-abdoutech:hover .box-image:after{opacity:.2}
</style>
<link href='//raw.githack.com/arlinadsign/saflink/master/owl.carousel.css' rel='stylesheet'/>
<script data-cfasync='false' src='//raw.githack.com/arlinadsign/saflink/master/OwlCarousel.js' type='text/javascript'/>
</b:if>

4. Selanjutnya Simpan Kode Di bawah tepat di atas kode </body>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<script type='text/javascript'>
//<![CDATA[

var MONTH_FORMAT= ["January", "February", "March", "April", "May", "June",
  "July", "August", "September", "October", "November", "December"];

var NO_IMAGE = "http://3.bp.blogspot.com/-Yw8BIuvwoSQ/VsjkCIMoltI/AAAAAAAAC4c/s55PW6xEKn0/s1600-r/nth.png"; 
var CAROUSEL_NUM = 6; 
var node = document.createElement('script'); node.type = 'text/javascript'; node.async = true; node.src = 'https://rawgit.com/abdelalilebbihi/abdou_tech/master/gadget/slider_star1.js'; var runscript = document.getElementsByTagName('script')[0]; runscript.parentNode.insertBefore(node, runscript);
//]]>
</script>
</b:if>

5. Selanjutnya simpan kode di bawah ini bebas mau di mana saja .. tapi saya sarankan dibawah <body>

 <b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='recent-slider' id='recent-slider'>
<div class='container'>
<b:section class='box-sec' id='box-sec' showaddelement='yes'>
  <b:widget id='HTML655' locked='false' title='' type='HTML' version='1'>
    <b:widget-settings>
      <b:widget-setting name='content'><![CDATA[<span id="carousel" data-label="Tips Blogger"></span>]]></b:widget-setting>
    </b:widget-settings>
    <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'>
<data:title/></h2>
</b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
<!--b:include name='quickedit'/-->
</b:includable>
  </b:widget>
</b:section>
</div>
</div>
</b:if>

yang saya tandai warna merah itu diganti sesuai dengan ke inginan anda

Apabila Featured Post Tidak Tampil Silahkan Pergi ke Setelan (Setting) > Lainya > Ubah Izinkan Feed Blog Menjadi Penuh .. Lalu Simpan

DEMO

Sekian Tutorial Cara Membuat Featured Slider Post di Blogger Semoga Bermanfaat

Tips Blogger Trik Blogger

Cara Membuat Featured Slider Post di Blogger

Nikami Selasa, 02 April 2019

Cara membuat popular post seperti Jalantikus.com - pada kesempatan kali ini saya akan berbagi tutorial cara untuk membuat populer post di sidebar blog mirip dengan website ternama yaitu jalan tikus.
oke langsung aja

Ikuti tutorialnya dibawah ini!

1. silahkan masuk ke HTML editor di blog sobat masing-masing.
2. lalu letakan kode CSS dibawah ini, diatas kode </head>

<style type='text/css'>
/* Popular Post */
.PopularPosts ul{list-style:none;margin:0 auto;padding:0;}
.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img {margin:0;padding:0;list-style:none;border:none;background:none;outline:none;}
.PopularPosts ul li {margin:0 0 5px;padding:0;position:relative;line-height:1.4em!important;list-style:none;text-align:left!important;font-size:15px !important;box-shadow: 0 3px 5px 0 rgba(0,0,0,0.17);border-radius: 4px;border: 1px solid #eee;}
.PopularPosts ul li a:hover {color:#f80538!important}
.PopularPosts li a{color:#000 !important;font-weight:500 !important;list-style:none}
.PopularPosts .item-thumbnail {display: flex;align-items: center;justify-content: center;width:72px;height:66px;margin: 6px 20px 7px 3px;overflow:hidden;float:left;border-radius:4px;}
.PopularPosts ul li img {width:auto;height:72px;transition:all .3s ease-in-out;border-radius:4px;overflow:hidden;display:block}
.PopularPosts .item-snippet{display:none}
.PopularPosts .item-title {padding:0 0 5px}
.PopularPosts .widget-content ul li:before{color: #fff;counter-increment: count;content: counter(count);position: absolute;left:57px;text-align: center;top:20px;z-index: 51;transition: all .4s;height:25px;min-width:25px;font-size: 14px;line-height:25px;background:#f80538;font-weight:600;border-radius:99em;border:2px solid #fff;text-align: center;padding:0;overflow:hidden;}
.PopularPosts ul{counter-reset:count;}
@media screen and (max-width:414px){
.PopularPosts ul li {font-size:15px!important}

}
</style>

3. jika sudah ada kode CSS popular post di template sobat, tinggal replace saja dengan yang diatas.
4. save template!

nah, sekarang lihat hasilnya, popular post ini mirip dengan jalan tikus.

Demikian tutorial Cara Membuat Popularpost Seperti JalanTikus, semoga bermanfaat.

Tips Blogger Trik Blogger

Membuat Popularpost Seperti JalanTikus

Nikami Selasa, 02 April 2019