Sora Blog is an awesome new personal blogging templates with a nice and clean two column layout. It is sweet and simple and is perfect for writers, collectors, fashion, beauty, and just about any other form of blogging required. Sora Blog is equipped with various of widgets which will help you to publish your blog more professionally. To make it easy for you we have published this detailed documentation, so that you can setup your blog correctly.
You have made a good decision by choosing our template. You can check the live demo or download the template through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users.
You have made a good decision by choosing our template. You can check the live demo or download the template through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users.
Basic Setup
Main Menu/Dropdown/Multi Dropdown
Access your blog Layout > click Edit link on Top Menu widget.
A pop up will appear and in the content section you will see the below code.
A pop up will appear and in the content section you will see the below code.
<ul class='flexnav' data-breakpoint='800' id='menu-hercules'>Change # with your desired url and text with your menu label.
<li><a href='/'>Home<span/></span></a></li>
<li><a href='#'>Fashion</a>
<ul class='sub-menu'>
<li><a href='#'>Fashion</a></li>
<li><a href='#'>Fashion 1</a></li>
<li><a href='#'>Fashion 2</a></li>
<li><a href='#'>Fashion 3</a></li>
<li><a href='#'>Fashion 4</a></li>
</ul>
</li>
<li><a href='#'>SkinCare</a></li>
<li><a href='#'>Beauty</a>
<ul class='sub-menu'>
<li><a href=''>Beauty</a></li>
<li><a href='#'>Beauty1</a></li>
<li><a href='#'>Beauty2</a></li>
<li><a href='#'>Beauty3</a></li>
</ul>
</li>
<li><a href='#'>Diet</a></li>
<li><a href='#'>Health</a></li>
<li><a href='http://www.soratemplates.com/2014/09/sora-blog-green-blogger-templates.html'>Download This Template</a>
</li>
</ul>
Second Title/ Description
On Blogger Dashbord Click Template
Click Edit HTML
Scroll down and Find this Code :<div class='page-header'>
<section class='title-section'>
<b:if cond='data:blog.pageType != "error_page"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h2>Hi, We are <data:blog.title/> /</h2>
<h3>The place where we write some words</h3>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<h1>Blog</h1>
<h2>The place where we write some words</h2>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<span id='break' />
<b:else/>
<h1>CATEGORY > <span class='subtitle'><span id='break'/></span></h1>
</b:if>
</b:if>
</b:if>
</b:if>
</section>
</div>
Red code is for home page, Blue is for post and Green is for Static page.
On Blogger Dashbord Click Template
Click Edit HTML
Scroll down and Find this Code :
Click Edit HTML
Scroll down and Find this Code :
<div class='page-header'>
<section class='title-section'>
<b:if cond='data:blog.pageType != "error_page"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<h2>Hi, We are <data:blog.title/> /</h2>
<h3>The place where we write some words</h3>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<h1>Blog</h1>
<h2>The place where we write some words</h2>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<span id='break' />
<b:else/>
<h1>CATEGORY > <span class='subtitle'><span id='break'/></span></h1>
</b:if>
</b:if>
</b:if>
</b:if>
</section>
</div>
Red code is for home page, Blue is for post and Green is for Static page.
Testimonials
Access your blog Layout > click Edit link on Testimonials widget.
A pop up will appear and in the content section you will see the below code.<div class='owl-item'> <div> <div class='tweet_item'> <div class='tweet_content'> <div class='stream-item-header'> <strong class='fullname'>Hercules Design</strong> <a class='account-group' href='http://twitter.com/Hercules_group' target='_blank'><span class='username'> @Hercules_group</span></a> </div> <div class='tweet_txt'>@<a href='http://twitter.com/billykulpa' target='_blank'>billykulpa</a> Please contact us via info@<a href='http://twitter.com/hercules' target='_blank'>hercules</a>-design.com</div> <div class='clearfix'> <div class='twitter_intents'> <span><a class='reply-tweet' href='https://twitter.com/intent/tweet?in_reply_to=463781848884072448' onclick='window.open('https://twitter.com/intent/tweet?in_reply_to=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Reply</a></span>
<span><a class='retweet' href='https://twitter.com/intent/retweet?tweet_id=463781848884072448' onclick='window.open('https://twitter.com/intent/retweet?tweet_id=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Retweet</a></span>
<span><a class='favorite-tweet' href='https://twitter.com/intent/favorite?tweet_id=463781848884072448' onclick='window.open('https://twitter.com/intent/favorite?tweet_id=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Favorite</a></span>
</div> </div> <p class='timestamp'> <a href='https://twitter.com/Hercules_group/status/463781848884072448' target='_blank'> 06 May 2014 </a> </p> </div> </div> </div></div>
Red code is for text, Blue is for links.
Access your blog Layout > click Edit link on Testimonials widget.
A pop up will appear and in the content section you will see the below code.
A pop up will appear and in the content section you will see the below code.
<div class='owl-item'> <div> <div class='tweet_item'> <div class='tweet_content'> <div class='stream-item-header'> <strong class='fullname'>Hercules Design</strong> <a class='account-group' href='http://twitter.com/Hercules_group' target='_blank'><span class='username'> @Hercules_group</span></a> </div> <div class='tweet_txt'>@<a href='http://twitter.com/billykulpa' target='_blank'>billykulpa</a> Please contact us via info@<a href='http://twitter.com/hercules' target='_blank'>hercules</a>-design.com</div> <div class='clearfix'> <div class='twitter_intents'> <span><a class='reply-tweet' href='https://twitter.com/intent/tweet?in_reply_to=463781848884072448' onclick='window.open('https://twitter.com/intent/tweet?in_reply_to=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Reply</a></span>
<span><a class='retweet' href='https://twitter.com/intent/retweet?tweet_id=463781848884072448' onclick='window.open('https://twitter.com/intent/retweet?tweet_id=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Retweet</a></span>
<span><a class='favorite-tweet' href='https://twitter.com/intent/favorite?tweet_id=463781848884072448' onclick='window.open('https://twitter.com/intent/favorite?tweet_id=463781848884072448','Twitter','width=600,height=300,left='+(screen.availWidth/2-300)+',top='+(screen.availHeight/2-150)+''); return false;'>Favorite</a></span>
</div> </div> <p class='timestamp'> <a href='https://twitter.com/Hercules_group/status/463781848884072448' target='_blank'> 06 May 2014 </a> </p> </div> </div> </div></div>
Red code is for text, Blue is for links.
Footer text
Access your blog Layout > click Edit link on Text widget.
A pop up will appear and in the content section you will see the below code.<p>This blog is to provide you with daily outfit ideas and share my personal style. This is a super clean and elegant WordPress theme for every bloggers. Theme is perfect for sharing all sorts of media online. Photos, videos, quotes, links... etc.</p>
Replace it with your desired text.
Access your blog Layout > click Edit link on Text widget.
A pop up will appear and in the content section you will see the below code.
A pop up will appear and in the content section you will see the below code.
<p>This blog is to provide you with daily outfit ideas and share my personal style. This is a super clean and elegant WordPress theme for every bloggers. Theme is perfect for sharing all sorts of media online. Photos, videos, quotes, links... etc.</p>
Replace it with your desired text.
Social Buttons
Access your blog Layout > click Edit link on Social Network widget.
A pop up will appear and in the content section you will see the below code. <a class='fa fa-facebook icon-2x social_link social_link__facebook' data-original-title='facebook' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Facebook</span>
</a>
<a class='fa fa-twitter icon-2x social_link social_link__twitter' data-original-title='twitter' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Twitter</span>
</a>
<a class='fa fa-flickr icon-2x social_link social_link__flickr' data-original-title='flickr' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Flickr</span>
</a>
<a class='fa fa-linkedin icon-2x social_link social_link__linkedin' data-original-title='linkedin' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Linkedin</span>
</a>
<a class='fa fa-google-plus icon-2x social_link social_link__gplus' data-original-title='gplus' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Gplus</span>
</a>
<a class='fa fa-youtube icon-2x social_link social_link__youtube' data-original-title='youtube' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Youtube</span>
</a>
Change # with your desired social url.
Access your blog Layout > click Edit link on Social Network widget.
A pop up will appear and in the content section you will see the below code.
A pop up will appear and in the content section you will see the below code.
<a class='fa fa-facebook icon-2x social_link social_link__facebook' data-original-title='facebook' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Facebook</span>
</a>
<a class='fa fa-twitter icon-2x social_link social_link__twitter' data-original-title='twitter' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Twitter</span>
</a>
<a class='fa fa-flickr icon-2x social_link social_link__flickr' data-original-title='flickr' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Flickr</span>
</a>
<a class='fa fa-linkedin icon-2x social_link social_link__linkedin' data-original-title='linkedin' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Linkedin</span>
</a>
<a class='fa fa-google-plus icon-2x social_link social_link__gplus' data-original-title='gplus' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Gplus</span>
</a>
<a class='fa fa-youtube icon-2x social_link social_link__youtube' data-original-title='youtube' data-rel='tooltip' href='#' target='_blank'>
<span class='social_label'>Youtube</span>
</a>
Change # with your desired social url.
Footer Navigation
Access your blog Layout > click Edit link on Footer widget.
it automatically picks pages and page links but in case it doesn't pick, please see the above image to add one, you can also add external links(Links from somewhere else).
Access your blog Layout > click Edit link on Footer widget.
it automatically picks pages and page links but in case it doesn't pick, please see the above image to add one, you can also add external links(Links from somewhere else).
About me Sidebar
Access your blog Layout > click Edit link on Testimonials widget.
A pop up will appear and in the content section you will see the below code.<div class='flexslider no-bg ' id='flexslider_vsxuiixcgg'> <ul class='slides'> <li> <div class='testi-item'><span class='testi-info'>This blog is to provide you with daily outfit ideas and share my personal style.</span> </div> </li> <li> <div class='testi-item'><span class='testi-info'>Hi, my name is John. I'mstudent originally from Peru, living in New York.</span> </div> </li> </ul></div><div class='private-image'> <img alt='140x140' class='img-circle' src='http://www.johndoe.hercules-design.com/wp-content/uploads/2014/01/john.jpg' style='width: 120px; height: 120px;' /> <h3>John Doe</h3> <span>Founder of the website</span></div>
Red code is for text, Blue is for Image.
Access your blog Layout > click Edit link on Testimonials widget.
A pop up will appear and in the content section you will see the below code.
A pop up will appear and in the content section you will see the below code.
<div class='flexslider no-bg ' id='flexslider_vsxuiixcgg'> <ul class='slides'> <li> <div class='testi-item'><span class='testi-info'>This blog is to provide you with daily outfit ideas and share my personal style.</span> </div> </li> <li> <div class='testi-item'><span class='testi-info'>Hi, my name is John. I'mstudent originally from Peru, living in New York.</span> </div> </li> </ul></div><div class='private-image'> <img alt='140x140' class='img-circle' src='http://www.johndoe.hercules-design.com/wp-content/uploads/2014/01/john.jpg' style='width: 120px; height: 120px;' /> <h3>John Doe</h3> <span>Founder of the website</span></div>
Red code is for text, Blue is for Image.
Latest Post and Latest Comments
It works automatically with recent posts and recent comments, so you don't need to do anything but if any case it isn't working then follow the below link.
It works automatically with recent posts and recent comments, so you don't need to do anything but if any case it isn't working then follow the below link.
Facebook Page Plugin:
<center><div class="fb-padding"><div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.3&appId=1395743857335531";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/soratemplates" data-width="280" data-height="230" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"></div></div></div></center>
or you can follow this tutorial if above method won't work
<center><div class="fb-padding"><div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.3&appId=1395743857335531";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-page" data-href="https://www.facebook.com/soratemplates" data-width="280" data-height="230" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"></div></div></div></center>
Installation And Custom Services
We provide plenty of templates for free but if you want something unique for your blog then let us create a unique design for your blog, Just tell us your needs and we will convert your dream design into reality. We also Provide Blogger Template Installation Service. Our Installation service gives you a simple, quick and secure way of getting your template setup without hassle.
0 Comments