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>

SandStone Blogger Template

sandstone, sandstone blogger, blogger templates, css templates

Blogger Designer : TeknoMobi

Original Designer : Freecsstemplates

Features : 2 Columns, Adapted from Css/xHtml, Dark, Fixed width, Left sidebar

Categories : Two Columns, Dark

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 is two-column structure is located on the left sidebar section. There are sections on the right side is writing. Theme designed in hues not tired eyes.

Configuration

Header Bottom Banner:

<div id='splash'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_-sthdjWfWCMUwKFqOiC-qR3g-WOJSKotUmCN8_c6zdRdB6h-F-rZcGECTbWk_hvVRt6by2rMJy-9CY8dFH5s22fK6qY_J1C29o5P_Qrn43dzMqadG43tg5C8BKKt6m24yb1Wg5AdN5l2/s1600/img01.jpg'/></div>

Grunge Blogger Template

blogger templates, 2 columns, grunge blogger templates


Blogger Designer : TeknoMobi

Original Designer : TemplateMo

Features : 2 Columns, Adapted from Css/xHtml, Right sidebar, Rounded corners, Grunge, Footer columns

Categories : Grunge, 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 was designed for the original portfolio site. I made some changes on the Blogger as I made ready for use.

Configuration

Contact Us:

Find the following section of the theme code and make the necessary changes.

<h1>Contact Us</h1>
<p>Morbi ac faucibus odio. Aliquam erat volutpat. Curabitur id varius tortor. Cras elementum sollicitudin lectus. Integer ante diam, consectetur a mattis nec, interdum id est. Duis sodales pulvinar ante sed luctus. Integer libero erat, porta eget commodo eget, semper id neque. Quisque eu fermentum dui.
</p>