Vcol Blogger Template Doc and Code Snippets

This is documentation for vcol business blogger template from weblogtemplates. Vcol is a business blogger template with some cool features.

Changing color codes in template

It is also easy to adjust width of template.

Code snippet for nav bar

<div class='collapse navbar-collapse' id='bs-example-navbar-collapse-1'>
<ul class='nav navbar-nav'>
<li>
<a href='#'>
                About
</a>
</li>
<li>
<a href='#'>
                Contact US
</a>
</li>
<li>
<a href='#'>
                Tech
</a>
</li>
<li>
<a href='#'>
                Games
</a>
</li>
<li class='dropdown'>
<a class='dropdown-toggle navbar-default-border-right' data-hover='dropdown' href='#'>
                Drop down 
<span class='caret'/>
</a>
<ul class='dropdown-menu'>
<li>
<a href='#'>
                    Action
</a>
</li>
<li>
<a href='#'>
                    Another action
</a>
</li>
<li>
<a href='#'>
                    Something else here
</a>
</li>
<li>
<a href='#'>
                    Separated link
</a>
</li>
<li class='dropdown-submenu'>
<a href='#' tabindex='-1'>
                    Hover me for more options
</a>
<ul class='dropdown-menu'>
<li>
<a href='#' tabindex='-1'>
                        Second level
</a>
</li>
<li class='dropdown-submenu'>
<a href='#'>
                        Even More..
</a>
<ul class='dropdown-menu'>
<li>
<a href='#'>
                            3rd level
</a>
</li>
<li>
<a href='#'>
                            3rd level
</a>
</li>
</ul>
</li>
<li>
<a href='#'>
                        Second level
</a>
</li>
<li>
<a href='#'>
                        Second level
</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>

Recent posts widget

Code for html widget. Replace Featured with your own label.

<div class="small-recent-posts">
<script>
widgetrc(
'Featured','3','singlecolumnsmallthumb'
);
</script>
</div>

This code if need to showcase recent posts.

<div class="small-recent-posts">
<script>
widgetrc(
'','3','singlecolumnsmallthumb'
);
</script>
</div>

Email Subscribe widget code

<div class="email-subscribe" id="email-subscribe">
<h4 class="title">Get this stuff<br /> <span>in your MAIL</span></h4>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=weblogtemplates', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" _lpchecked="1">
<input class="email-field" type="text" value="" placeholder="Enter your email here" name="email" />
<input type="hidden" value="weblogtemplates" name="uri" /><input type="hidden" name="loc" value="en_US" />
<input class="submit" name="submit" type="submit" value="Sign Up Now" />
</form>
<div class="clear"></div>
</div>

Replace weblogtemplates with yours blogs feedburner handle.

Change read more text

var rmorepost = "Read more";

Find this code and replace text.

Related post settings codes

//related posts settings
var defaultnoimage = "http://1.bp.blogspot.com/-nhrIA7_1ei0/UkHKoMI2UTI/AAAAAAAAA28/a9-8_0KXPTI/s1600/no-thumb.jpeg";
var maxresults = 3;
var relatedpoststitle = " Related Posts";
var norelatedpoststitle = " No related posts"

maxresults stands for number of results and defaultnoimage for default image if there is no image in post.