Iklan Atas Posting

N Light Template Documentation


N Light Blog Theme #Mostlytheme
New Light is a Blogger template with Responsive layout and suitable for all blogs. It's design with a simple color combination, clean and modern look, Fast, SEO Optimized, and has been built by using some of the most popular current design trends.
N Light Template Installation
1. Log in to the Blogger dashboard and open Template> Edit HTML.
2. Please backup your old template if you decide to use it again. To do this, click on the "download full template" link and save the template.
3. Then, find the location of the XML template that you just downloaded and press "Upload". 
Customize Theme Navigation
Please open Blogger> Template> "Edit HTML" 
Search and Replace all these codes # with your link.
<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'>Homepage</span></a></li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Blog <i class='fa fa-angle-down fa-fw'/></span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>About</span></a></li>
<li><a href='/p/contact-form.html' 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='#' 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='/p/sitemap.html' itemprop='url'><span itemprop='name'>Sitemap</span></a></li>
<li><a href='/p/static-page.html' itemprop='url'><span itemprop='name'>Static Page</span></a></li>
  <li><a href='/err404' itemprop='url'><span itemprop='name'>404 Page Not Found</span></a></li>
</ul>
</li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Menu <i class='fa fa-angle-down fa-fw'/></span></a>
<ul>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 1</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 2</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 3</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 4</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 5</span></a></li>
<li><a href='#' itemprop='url'><span itemprop='name'>Menu 6</span></a></li>
</ul>
</li>
<li><a href='#' itemprop='url'><span itemprop='name'>Komputer</span></a></li>
<li class='ranpost'><a onclick='feelingLuckyundefined);' title='Random Post'>Random Post</a></li>
</ul>
</div>
</nav>
Top Navigation
<nav class='page-menu' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'>
 <ul>
   <li><a href='#' itemprop='url' title='About'><span itemprop='name'>About</span></a></li>
   <li><a href='#' itemprop='url' title='Contact'><span itemprop='name'>Contact</span></a></li>
   <li><a href='#' itemprop='url' title='Privacy'><span itemprop='name'>Privacy</span></a></li>
   <li><a href='#' itemprop='url' title='Sitemap'><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'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Twitter'><i class='fa fa-twitter'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Google+'><i class='fa fa-google-plus'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Youtube Channel'><i class='fa fa-youtube-play'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Instagram'><i class='fa fa-instagram'/></a>
  </li>
  <li class='menu-item'>
    <a href='#' rel='nofollow' target='_blank' title='Follow Our Linkedin'><i class='fa fa-linkedin'/></a>
  </li>
</div>
Mobile Navigation
<a class='mobzMenu ripple' href='javascript:;'><i class='fa fa-bars'/></a>
<div class='mobzspot'/>
<nav class='dropmedown' itemprop='mainEntity' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>
<div class='wrapper'>
<div class='profilemenu'>
<img alt='Admin' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiGl2rLCi5Ijb9GPXpjcIp5YKAvpzDUhPvdJEdI33aGRkHsJC5wyQycuciY6leVgjc_Oegf0L4v20q9QHWuhmV9_fSPd9vMAPHNDzKzt10ZAvchJctuALnTz7gKR66mEQGXfFcfd686fk/s1600/noimage.png' title='Admin'/>
<h3>Nama Admin</h3>
<a class='ripple' href='javascript:;' id='info2'><i class='fa fa-caret-down'/></a>
<p>emailanda@gmail.com</p>
<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>
</div>
<ul class='nav nlp-menu'>
<li><a class='waves-effect' expr:title='data:blog.title' href='/' itemprop='url'><span itemprop='name'><i class='fa fa-home'/> Home</span></a></li>
<li class='sub-menu'>
<a class='dropdown waves-effect' href='javascript:;' title='Ranking'><i class='fa fa-trophy'/> Ranking</a>
<ul class='sub'>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Players</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Groups</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url'><span itemprop='name'>Company</span></a></li>
</ul>
</li>
<li><a class='waves-effect' href='#' itemprop='url' title='News'><span itemprop='name'><i class='fa fa-newspaper-o'/> News</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Inbox'><span itemprop='name'><i class='fa fa-inbox'/> Inbox</span></a></li>
<h2>Submenu</h2>
<li><a class='waves-effect' href='#' itemprop='url' title='Settings'><span itemprop='name'><i class='fa fa-gear'/> Settings</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='My File'><span itemprop='name'><i class='fa fa-file'/> My File</span></a></li>
<li><a class='waves-effect' href='#' itemprop='url' title='Upload'><span itemprop='name'><i class='fa fa-cloud-upload'/> Upload</span></a></li>
</ul>
</div>
</nav>
SEO Meta Tags
Open Blogger, Template, "Edit HTML"
Search and replace all posts xxxxx with the description of your blog (If not needed, delete or leave it also does nothing).
<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'/>
Ads in Post 
Search and replace this article
<!-- Ads Code Paste -->
with your ad code script:
You can parse the ad code Here HTML Converter
&lt;div style=&quot;display:block;text-align:center;margin:20px auto;&quot;&gt;
<!-- Ads Code Paste -->
&lt;/div&gt;
Footer links
Search and replace all tags # with the link of your choice.
<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
Find and replace the number 6 in the code postperpage=6with the number of posts you want displayed on each page.
var postperpage=6;var numshowpage=3;var upPageWord ='Prev';var downPageWord ='Next';var urlactivepage=location.href;var home_page="/";
Featured Posts
To delete featured posts on the homepage, please open the template editor then search for and delete the following code.
<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.writeundefined&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>
To replace the feed post with a certain label, please replace this code
/feeds/posts/default/?max-results
With this code (Replace NAME_LABEL with the label name of your choice)
/feeds/posts/default/-/NAMA_LABEL?max-results
Author Box under the post
<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:rgbundefined17,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 To add Syntax Highlighting to posts, add code
and fill in the code (HTML, CSS, JavaScript, jQuery) that you want to add to it.
<pre><code>
---HTML CODE ADD--
</code></pre>
Youtube Responsive
Video Use this code to embed YouTube responsive video
<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/RfTkVF-wG1M">
</div>
</div>
</div>
Change the code marked with the youtube video link. Check out the example of YouTube responsive video below
Drop Caps
<span class="first-letter">Your First Letter here</span>
Your First Letter here Ea eam labores imperiet, apeirian democritum ei nam, doming neglegentur ad vis. Ne malorum ceteros feugait quo, ius ea liber offendit placerate, est habemus aliquyam legendos id. Eam no corpora shameisset 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>
Spoilers
<div id="flippy"><button>Spoiler</button></div>
<div id="flippanel">
--- Text Ad  ---
</div>
--- Text Ad ---
Make a table in the post
<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>
Disable mobile-only display Disable the mobile version of this template, please click Template> Gear Button> Select No. Okay that's all for documentation for the New Light template, if there are other difficulties don't hesitate to ask via the mostly theme blog contact form . thanks

    



0 Response to "N Light Template Documentation"

Post a Comment

Article Top Ads

Central Ads Article 1

Middle Ads Article 2

Article Bottom Ads