Tuesday, May 10, 2016

New Light Template Documentation

New Light Template Documentation

New Light is a Blogger template with Responsive layout and suited for all blog. It's design with simple color combination, clean and modern look, Fast, SEO Optimized, and has been built by using some of the most popular current design trends.

Installation


1. Log in ke Blogger dashboard dan buka Template > Edit HTML.
2. Silahkan backup template lama Anda jika Anda memutuskan untuk menggunakannya lagi. Untuk melakukan ini, klik pada "download template lengkap" link dan simpan template.
3. Kemudian, cari lokasi XML template yang baru saja Anda download dan tekan "Upload".

Customize Theme


Navigation

Silakan buka Blogger > Template > "Edit HTML"

Cari dan ganti semua kode ini # dengan link Anda.

<nav id='navigation-hype' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>
<div class='maxwrap'>
  <input type='checkbox'><i aria-hidden='true' class='fa fa-th-list'/> Menu</input>
<ul>
<li class='indie'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='name'><i class='fa fa-home'/> Home</span></a></li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Blog <i class='fa fa-caret-down fa-fw'/></span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>About</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Contact</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>CSS Minifier</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Disclaimer</span></a></li>
<li><a href='/404' itemprop='url'><span itemprop='name'>Error 404</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>HTML Converter</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Privacy Policy</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Sitemap</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Terms of Service</span></a></li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Profil Artis</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Tips Blogger</span></a></li>
<li class='ranpost'><a onclick='feelingLucky();' title='Random Post'>Random Post</a></li>
<li><a href='#search' title='Search Here'><i class='fa fa-search'/> Search</a></li>
<li><a href='#signup' title='Sign Up'>Sign Up</a></li>
</ul>
</div>
</nav>

Top Navigation

<div class='page_menu_wrapper'>
<div class='maxwrap'>
<nav class='page-menu' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
 <ul>
   <li><a href='#' itemprop='url' title='About'><i class='fa fa-user'/> <span itemprop='name'>About</span></a></li>
   <li><a href='#' itemprop='url' title='Contact'><i class='fa fa-envelope'/> <span itemprop='name'>Contact</span></a></li>
   <li><a href='#' itemprop='url' title='Privacy'><i class='fa fa-info-circle'/> <span itemprop='name'>Privacy</span></a></li>
   <li><a href='#' itemprop='url' title='Sitemap'><i class='fa fa-bars'/> <span itemprop='name'>Sitemap</span></a></li>
    </ul>  
    <div class='clear'/>
</nav>
<div class='sosial-atas'>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Facebook'><i class='fa fa-facebook fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Twitter'><i class='fa fa-twitter fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Google+'><i class='fa fa-google-plus fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Youtube Channel'><i class='fa fa-youtube-play fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Instagram'><i class='fa fa-instagram fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Linkedin'><i class='fa fa-linkedin fa-fw'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Contact Our Admin'><i class='fa fa-phone fa-fw'/> +1234567-891011</a>
  </li>
  <li class='menu-item'>
    <a href='https://www.blogger.com/follow-blog.g?blogID=6355813876215224659' rel='nofollow' target='_blank'><i class='fa fa-user fa-fw'/> Join with us</a>
  </li>
</div>
<div class='search-box'>
<form action='/search' id='searchform' method='get'>
<input id='search-form' name='q' placeholder='Search here and hit enter' type='text'/>
    <span class='search-button'><i class='fa fa-search'/></span>
</form>
</div>

SEO Meta Tag

Buka Blogger, Template, "Edit HTML"

Cari dan ganti semua tulisan xxxxx dengan keterangan blog Anda (Jika tidak diperlukan, hapus atau dibiarkan juga tidak apa-apa).

<meta content='xxxxx' name='keywords'/>
<link href='https://plus.google.com/xxxxx/posts' rel='publisher'/>
<link href='https://plus.google.com/xxxxx/about' rel='author'/>
<link href='https://plus.google.com/xxxxx' rel='me'/>
<meta content='xxxxx' name='google-site-verification'/>
<meta content='xxxxx' name='msvalidate.01'/>
<meta content='xxxxx' name='alexaVerifyID'/>
<meta content='xxxxx' name='Author'/>
<meta content='xxxxx' property='og:description'/>
<meta content='xxxxx' property='fb:app_id'/>
<meta content='xxxxx' property='fb:admins'/>
<meta content='xxxxx' name='twitter:site'/>
<meta content='xxxxx' name='twitter:creator'/>

Iklan di Postingan

Cari dan ganti tulisan ini

<!-- Kode Banner/Iklan Anda Di sini -->

dengan skrip kode iklan Anda :

Anda bisa memparse kode iklan disini HTML Converter.

&lt;div style=&quot;display:block;text-align:center;margin:20px auto;&quot;&gt;
<!-- Kode Banner/Iklan Anda Di sini -->
&lt;/div&gt;

Widget Sosial Media di Sidebar

Cari dan ganti semua link yang ditandai dengan link sosial media Anda.

<div class='sidebar_about_author'>
<div class='inner_wrapper'>
<div class='sosmedarl-img'>
<img alt='N Light' class='img-responsive' height='auto' src='https://4.bp.blogspot.com/-jvRiCg0BHgk/VyO7VHzwFDI/AAAAAAAADCw/XAWK-rsio24QMitPfGRJXRFoxFPMWc6eACLcB/s1600/Info%2BArlina.jpg' title='N Light' width='300'/>
<div class='aboutfloat-img'><span class='sosmedarl-float'><a href='https://www.blogger.com/follow-blog.g?blogID=6355813876215224659' rel='nofollow' target='_blank' title='Join Our Site'><i class='fa fa-user'/> Join Our Site</a></span></div>
</div>
</div>
<div class='sosmedarl-info'>
  <h4><span>N Light</span></h4>
<p>Berbagi Informasi Menarik</p>
</div>
<div class='sosmedarl-wrpicon'>
<ul class='extender'>
<li class='sosmedarl-icon fbl'><a href='#' target='_blank' title='Follow Our Facebook'><i class='fa fa-facebook fa-fw'/> Like</a></li>
<li class='sosmedarl-icon twitt'><a href='#' target='_blank' title='Follow Our Twitter'><i class='fa fa-twitter fa-fw'/> Follow</a></li>
<li class='sosmedarl-icon crcl'><a href='#' rel='nofollow' target='_blank' title='Follow Our Google+'><i class='fa fa-google-plus fa-fw'/> Circle</a></li>
</ul>
</div>
<form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=nlightpremium&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<div class='newsletter-ia'>
<input class='newsletter-input-sm' name='email' placeholder='Enter Your Email' type='text'/>
<button class='newsletter-button-sm' type='submit'/>
</div>
<input name='uri' type='hidden' value='nlightpremium'/>
</form>
</div>
</div>

Link di Footer

Cari dan ganti semua tanda # dengan link pilihan Anda.

<footer id='footer-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter' role='contentinfo'>
<div id='footme'>
<div class='footmekanan'>
<a href='#' title='About'>About</a> | 
<a href='#' title='Contact'>Contact</a> | 
<a href='#' title='Disclaimer'>Disclaimer</a> | 
<a href='#' title='Privacy Policy'>Privacy Policy</a> | 
<a href='#' title='Sitemap'>Sitemap</a>
<div class='clear'/>
<div class='footmekiri'>
<div class='medsosbawah'>
<a class='facebook' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<a class='twitter' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<a class='googleplus' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<a class='rssfeed' href='#' rel='nofollow' target='_blank'><i class='fa fa-rss'/></a>
</div>
</div>
</div>
</footer>

Page Navigation

Cari dan ganti angka 6 pada kode postperpage=6 dengan jumlah post yang ingin ditampilkan di tiap halaman.

var postperpage=6;var numshowpage=3;var upPageWord ='Prev';var downPageWord ='Next';var urlactivepage=location.href;var home_page="/";

Featured Posts

Untuk menghapus featured posts di homepage, silakan buka template editor kemudian cari dan hapus kode berikut ini.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div class='ct-wrapper' id='featured-posts-section'>
<div class='featured-post padding clearfix'>        
<script type='text/javaScript'>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/?max-results=&quot;+featured_numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=sliderposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>                                                                                                                                
</div>
</div>
</b:if>

Author Box di bawah postingan

<div class='authorboxwrap'>
<div class='authorboxfull'>
<div class='avatar-container'>
<a href=''>
<img class='author_avatar' expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' height='90' width='90'/>
</a>
</div>
<div class='author_description_container'>
<h4><a href='#' rel='author'><data:post.author/></a> <i class='fa fa-check-circle' style='color:rgb(17,143,249);font-size:14px;' title='Verified Author'/></h4>
<p>
<data:post.authorAboutMe/>       
</p>
<div class='social-links'>
<li><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a></li>
<li><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a></li>
<li><a class='external external-link' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a></li>
<div class='clear'/>
</div>
</div>
</div>
</div>
<div class='clear'/>

Shortcodes


Syntax Highlighting

Untuk menambah Syntax Highlighting di postingan, tambahkan kode <pre><code></code></pre> dan isi kode (HTML, CSS, JavaScript, jQuery) yang ingin ditambahkan didalamnya.

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

Youtube Responsive Video

Gunakan kode ini untuk embed youtube video responsive

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

Ganti kode yang ditandai dengan link video youtube.

Simak contoh youtube video responsive di bawah ini


Drop Caps

<span class="first-letter">Your First Letter here</span>

Your First Letter here Ea eam labores imperdiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerat, est habemus aliquyam legendos id. Eam no corpora maluisset definitiones, eam mucius malorum id. Quo ea idque commodo utroque, per ex eros etiam accumsan.

Button

<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>


Spoiler

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

Ea eam labores imperdiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerat, est habemus aliquyam legendos id. Eam no corpora maluisset definitiones, eam mucius malorum id. Quo ea idque commodo utroque, per ex eros etiam accumsan.

Membagi konten post menjadi dua kolom

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

Ea eam labores imperdiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerat, est habemus aliquyam legendos id. Eam no corpora maluisset definitiones, eam mucius malorum id. Quo ea idque commodo utroque, per ex eros etiam accumsan.

Membagi konten post menjadi tiga kolom

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

Ea eam labores imperdiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerat, est habemus aliquyam legendos id. Eam no corpora maluisset definitiones, eam mucius malorum id. Quo ea idque commodo utroque, per ex eros etiam accumsan.

Membagi konten post menjadi empat kolom

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

Ea eam labores imperdiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerat, est habemus aliquyam legendos id. Eam no corpora maluisset definitiones, eam mucius malorum id. Quo ea idque commodo utroque, per ex eros etiam accumsan.

Membuat tabel di postingan

<table cellpadding="0" cellspacing="0" style="text-align: left;">
    <tbody>
        <tr>
            <th>Table Header 1</th>
            <th>Table Header 2</th>
            <th>Table Header 3</th>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
    </tbody>
</table>

Table Header 1 Table Header 2 Table Header 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3
Division 1 Division 2 Division 3

Nonaktifkan tampilan khusus mobile


Nonaktifkan versi mobile pada template ini, silakan klik Template > Tombol Gear > Pilih Tidak.

Oke cukup sekian untuk dokumentasi template New Light, jika ada kesulitan lain jangan segan untuk bertanya lewat formulir kontak blog Arlina Design. Terima kasih.

Blog ini dibuat atas ketertarikan dan minat kami dengan website dan juga sebagai media sosial berbagi Info Menarik serta Hiburan lainnya.

This Is The Newest Post

58 comments

test test test mau dong template nya balas dong hangaout aQ

Elegan banget. Saya paling suka dibagian footer template blog nya. Ciamik abis, simple dan minimalis!

templatenya mantap (y). O ya mbak. bisa bagi tutorial cara membuat related post dibawah artikel nggak ya? saya sudah cari di google tetapi gagal karena scipt yang dihosting sudah pada expired.

heem, saya belum dpt update yang ini mbak

dimana ya link nya, sudah saya cari di sitemap blog nya mbak arlina belum ketemu. Judul dan kategorinya apa?

mbak widget subsrcribe nya share dong mbak bagus banget

saya belum dapat update yang ini mbak .. arrrrdi@gmail.com

Update yang terbaru di homepage kok tidak sama ya mbak?. tidak tampilan seperti gambar besar sama box subscribenya ini.

Mbak, saya ingin memesan template ini, gmn caranya ya? Lewat contact gak bisa soalnya,,

share template in gmail: nguyenminhtri.10032000@gmail.com

mbak templatenya kok ngak bisa didownload

Mantap Mbak Template nya....Makasih Mbak (y)

nah, ini nih yang ane cari.,.
Mantap gan,. :)

Pagi... Mengapa Widget "Artikel Terbaru" ini tidak ditampilkan, mbak?
https://kccsejong.blogspot.co.id/
mks..

mba mohon bantuanya di template versi premium artikel terbaru tidak tampil ???

updae pakai yang terbaru kodenya
sudah ada dipembahasan kok

update scriptnya , sudah ada dibahas sama kak arlina.

mbak, mau beli N Light Pro 6, tapi dimana ya ? soalnya lagi browsing template jatuhnya kesini

This comment has been removed by the author.

mbak, cara bikin sitemap seperti yang di template ini gimana ya?

masuk sini gan http://idntheme.com/

Komentar Anda adalah tanggapan pribadi, kami berhak menghapus komentar yang mengandung kata-kata pelecehan, intimidasi, dan SARA.
EmoticonEmoticon