Vertical Blogger Templates

2 columns, blogger templates, vertical templates

Blogger Designer : TeknoMobi

Original Designer : Free Css Templates

Features : 2 Columns, Adapted from Css/xHtml, Fixed width, Right sidebar, Fresh, Cool backround,

Categories : Neutral, Personel Pages

Licence : Released for free under a Creative Commons Attribution 2.5 License

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This theme has a two-column structure. Sidebar is located on the right side. General background of blue and white color is in tone. This theme optimized for adsense ads floating.

Configuration

Header Menü:

<li class='active'><a expr:href='data:blog.homepageUrl'>homepage</a></li>
<li><a href='#'>edit</a></li>
<li><a href='#'>edit</a></li>
<li><a href='#'>edit</a></li>
<li><a href='#'>edit</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>posts rss</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/comments/default&quot;'>comments rssS</a></li>

Note Paper Blogger Templates

note paper, notepaper templates, blogger templates

Blogger Designer : TeknoMobi

Original Designer : TemplateLite

Features : 3 columns, Adapted from Wordpress, Arts, Cool header, Elegant, Fixed width, Grunge, Right sidebar, Neutral

Categories : Three Columns, Neutral

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section



Configuration

Header Bacround:

Find the following image link in the theme code. Then, from inside the folder you downloaded the image file bg_header designed according to your own download site, then upload it to any picture. After you install the direct link to your picture against the following code replace the code.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXsWgnme7LbVlM79nZyR8C5UKLTzGOok84E2m0bGn_3Si3s94IaQmUXYBdwhA9xtkTRndbLANe-9GZIyoJAxs_OBnBiGJVUDJUoDoyWmNWiUP75gc5jqQ_xYqw4rUC9Ys_4xAp-KfnyRzt/s1600/bg_header1.jpg

Twitter Button Link:

Twitter link on the link below to change the theme codes Search.

http://www.twitter.com/bloggergalery

Rss Link Button:

Rss link on the link below to change the theme codes Search.

http://feeds.feedburner.com/bloggergallery

Garden Blogger Templates

garden templates, blogger templates, left sidebar, 2 columns

Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 2 Columns, Adapted from Css/xHtml, Left sidebar, Cool Header, Fresh, Art, Vector, Flowers

Categories : Vector, ArtWork

Licence : Creative Commons Attribution 3.0 United States License.

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This beautiful building has a two-column theme. Sidebar is located on the left side. Theme has been exploited in the design of vectoral picture. Green and white tones are dominant themes.

Configuration

Menu:

<ul>
<li><a class='current' expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='#'>Edit</a></li>
<li><a href='#' target='_parent'>Edit</a></li>
<li><a href='#' target='_blank'>Edit</a></li>
<li><a class='last' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>PostsRss</a></li>
</ul>

Specific Blogger Templates

specific, blogger templates, 2 columns

Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 2 Columns, Adapted from Css/xHtml, Right sidebar, Twitter widget, Red and White colour

Categories : Two Columns

Licence : Creative Commons Attribution 3.0 United States License.

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This theme has a two-column structure. Twitter a special theme on the right side of the header field is located in the section. After installing the theme I described how to configure below.

Configuration

Twitter Section:

http://twitter.com/your-id

Menu:

<ul>
<li><a class='current' expr:href='data:blog.homepageUrl'><span/>Homepage</a></li>
<li><a href='#' target='_parent'><span/>Edit</a></li>
<li><a href='#'><span/>Edit</a></li>
<li><a href='#'><span/>Edit</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'><span/>Posts RSS</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/comments/default&quot;'><span/>Comments RSS</a></li>
</ul>

DesignTeam Blogger Template

two columns blogger templates, blogger

Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 2 Columns, Adapted from Css/xHtml, Right sidebar, Dark, Cool Header, Dark backround

Categories : Two Columns

Licence : Creative Commons Attribution 3.0 United States License.

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This theme has a two-column structure. The broad theme of a blogger is writing area. Just below the header section of the theme has a particular area. In this special area and a small menu window contains information notes.

Configuration

Our Latest Projecst:

You can find the zip file of the unwritten background.

<div id='latest_project_content'>
<div class='h1'>Free CSS Template</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam feugiat mi lacus, sed accumsan neque. Donec condimentum molestie laoreet.</p>
<div class='rc_btn_01'><a href='#'>Read more</a></div>
</div>


Menu:

<li><a class='current' expr:href='data:blog.homepageUrl'><span/>Home</a></li>
<li><a href='#'><span/>Edit</a></li>
<li><a href='#'><span/>Edit</a></li>
<li><a href='#1' target='_parent'><span/>Edit</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'><span/>Posts RSS</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/comments/default&quot;'><span/>Comments RSS</a></li>

Fullsize Jquery Image Script Add to Blogger

blogger plugins, blogger script, blogger jquery plugin


Nice effect with the application and fullsize images in the popup window can display. Demo page at the bottom of the box that appears when you roll over the pictures when you click you will understand what I mean.
blogger jquery add,fullsize jquery, add to blogger, blogger pluginsblogger jquery add,fullsize jquery, add to blogger, blogger plugins



  1. Location - Edit Html Templates expand widgets is called section.
  2. Html template

    ]]></b:skin>

    following code immediately above and we are looking for add css code.

    .fullsize-icon {
    position: absolute;
    margin: 0;
    padding: 0;
    width: 30px;
    height: 30px;
    background: transparent url(http://i36.tinypic.com/2s17rmh.png) no-repeat left top;
    z-index: 950;
    cursor: url(http://sites.google.com/site/teknomobi/Home/fullsize.cur), auto;
    }

    .fullsize-loading, .fullsize-wrapper {
    position: absolute;
    margin: 0;
    padding: 0;
    z-index: 999;
    }

    .fullsize-loading {
    height: 51px;
    width: 51px;
    background: transparent url(http://i37.tinypic.com/30cpu6v.png) no-repeat left top;
    }

    .fullsize-loading-inner {
    height: 100%;
    width: 100%;
    background: transparent url(http://i34.tinypic.com/2poazx3.gif) no-repeat center center;
    }

    .fullsize-image {
    display: block;
    }

    .fullsize-title {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 5px 0;
    min-height: 14px;
    color: #fff;
    font-weight: bold;
    font-size: 11px;
    font-family: "Lucida Grande", sans-serif;
    text-shadow: 0 0 1px #000;
    background: transparent url(http://i36.tinypic.com/23uopqr.png) repeat-x left top;
    }

    .fullsize-title-text {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    }

    a.fullsize-close {
    position: absolute;
    display: block;
    margin: -15px 0 0 6px;
    width: 16px;
    height: 16px;
    text-decoration: none;
    z-index: 1000;
    background: transparent url(http://i38.tinypic.com/5xo5r9.png) no-repeat left top;
    }

    /* Safari 3.0 and Chrome rules here */
    @media screen and (-webkit-min-device-pixel-ratio:0) {
    a.fullsize-close {
    margin-top: -14px;
    }
    }

    a.fullsize-close:hover {
    background-position: right top;
    }

    .fullsize-close {
    cursor: pointer;
    }

    /* Shadows */

    .fullsize-sh-wrap {
    position: absolute;
    z-index: 980;
    }

    .fullsize-sh-top, .fullsize-sh-body, .fullsize-sh-bottom {
    width: 100%;
    }

    .fullsize-sh-top-l, .fullsize-sh-top-m, .fullsize-sh-top-r, .fullsize-sh-bottom-l, .fullsize-sh-bottom-m, .fullsize-sh-bottom-r {
    background-position: left top;
    background-repeat: none;
    background-color: transparent;
    height: 20px;
    }

    .fullsize-sh-top-l {
    float: left;
    width: 22px;
    background-image: url(http://i33.tinypic.com/57jvl.png);
    }

    .fullsize-sh-top-m {
    margin: 0 22px;
    background-image: url(http://i35.tinypic.com/del5wm.png);
    background-repeat: repeat-x;
    }

    .fullsize-sh-top-r {
    float: right;
    width: 22px;
    background-image: url(http://i35.tinypic.com/16hqefo.png);
    }

    .fullsize-sh-bottom-l {
    float: left;
    width: 22px;
    height: 24px;
    background-image: url(http://i33.tinypic.com/2qamnx0.png);
    }

    .fullsize-sh-bottom-m {
    margin: 0 22px;
    height: 24px;
    background-image: url(http://i38.tinypic.com/rbfpxl.png);
    background-repeat: repeat-x;
    background-position: left bottom;
    }

    .fullsize-sh-bottom-r {
    float: right;
    width: 22px;
    height: 24px;
    background-image: url(http://i37.tinypic.com/24etjmb.png);
    }

    .fullsize-sh-body {
    background-image: url(http://i36.tinypic.com/2yjvbdj.png);
    background-repeat: repeat-y;
    }

    .fullsize-sh-body-r {
    float: right;
    height: 100%;
    width: 11px;
    background-image: url(http://i36.tinypic.com/j8ku28.png);
    background-repeat: repeat-y;
    }

  3. Html template again

    </head>

    code immediately above the place the following code We are.

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
    <script src='http://sites.google.com/site/teknomobi/Home/jquery.fullsize.minified.txt' type='text/javascript'/>
    <script type='text/javascript'>jQuery(document).ready(function(){jQuery(&quot;img&quot;).fullsize([]);});
    </script>


    Now, the editing of the template is completed. We save the template.
  4. Add a picture we will use our post code is as follows.

    <div class="separator" style="clear: both; text-align: center;">
    <img border="0" src="Resim Linki" longdesc="Resim linki" tooltip="linkalert-tip" width="320" height="240" title='' />
    </div>


Value width of the image in the case where a small width, height value, center value shows the layout. You can change them according to your own. In addition, pictures are hosting your own blog. Normally formed from the code official remi install and get the address of the connection and give it the code by deleting the code phrases you can use the above instead.

Here you can download the necessary files in your account can host your own sites.google. Css code contained in its own fullsize.cur file upload and link to your account sitesgoogle change the link. Also in the same way jquery.fullsize.minified.txt file and upload it to your account sitesgoogle change hyperlinks. Application host application itself Fullsize jQuery problem can not be brought to sitesgoogle the host. The normal application directly jQuery api google speed having trouble because you do not pull over. To avoid future trouble at times in the bar would be useful in your own field

Creative Idea Blogger Template

3 columns, blogger, blogger themes

Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 3 Columns, Adapted from Css/xHtml, Right sidebar, Dark, Cool Header,

Categories : Three Columns

Licence : Creative Commons Attribution 3.0 United States License.

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This theme was designed for the original portfolio site. Blogger for users to organize as best I can and I made ready for normal use.

Configuration

Header Backround:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0XmYdjRdQ8U3WZAkw-YKvZbTWdUaY2rPywB2wUcuaT3kuM7GWEBn0MdhYYTc5217o49zElfhtyNdUXXEt2zAaMxFZ7bc9FrXbzSikiXcGKiB4S5jqRWUKclWM_X2zXoP558z8oZ5RBeAW/s1600/templatemo_header.jpg

Header Menu:

<li class='current'><a expr:href='data:blog.homepageUrl'><b>Home</b></a></li>
<li><a href='#' target='_blank'><b>Edit</b></a></li>
<li><a href='#' target='_blank'><b>Edit</b></a></li>
<li><a href='#' target='_blank'><b>Edit</b></a></li>
<li><a href='#'><b>About</b></a></li>
<li><a href='#'><b>Contact</b></a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'><b>Posts RSS</b></a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/comments/default&quot;'><b>Comments RSS</b></a></li>

Crossing Blogger Template

two columns, blogger, blogger templates, best blogger templates

Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 2 Columns, Adapted from Css/xHtml, Right sidebar, Dark, Elegant

Categories : Dark

Licence : Creative Commons Attribution 3.0 United States License.

Browser Compatibility : Firefox, Chrome, Safari, Opera, İnternet Explorer

Blogger Gallery Blogger Gallery

Please do not delete the link in the Footer section

This theme has a dark hue. I have customized this theme for some blogger. Blogger made some changes when you turn to the theme I had to. Unfortunately part of the theme heaer not regulated as a widget. To change the logo in the header section below the setup manual you can look.

Configuration

Header Logo:

The following image link in the theme css code to find and replace with link to your own logo.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC1yEUXMCI1tdty_TR3LmCITScioWj3Fh4HHVi62XLKwa7Boh0Jvl1Jo57CgX_m1GeoA6pcQ75Ij5sBB0OdPDfxrAr561XY32bmk2wWn7UTOq3q6UuoX9nQPdzXbrkk-YEZoagry4Rpa5J/s1600/templatemo_logo.jpg

At the bottom of the logo to change the slogan on the theme code and the text below Find Make the necessary changes.

Your new website template

Header Menu:

<div id='templatemo_menu'>
<div class='templatemo_menu_item'>
<div class='templatemo_menu_home'>
<a class='current' expr:href='data:blog.homepageUrl'>HOME</a>
</div>
</div>
<div class='templatemo_menu_item'>
<div class='templatemo_menu_content'>
<a href='mailto:'>Contact</a>
</div>
</div>

<div class='templatemo_menu_item'>
<div class='templatemo_menu_about'>
<a href='#'>Projects</a>
</div>
</div>

<div class='last'>
<div class='templatemo_menu_member'>
<a href='#'>About Us</a>
</div>
</div>

<div class='cleaner'/>

</div>