HOW TO EDIT DEFAULT TEMPLATE OF BLOGGER

How to Edit Blogger Template Defaults subject of our times ini.Setelah complete blog setup early stage then the next thing to do is what your current template ? Is your template which is inherited from the blogger was satisfactory or not ? If your choice is not satisfactory, then there are several ways that you can do to edit the default template on your blog Blogger .

You can just download a template from various sources on the internet or order ready-made template that has many on offer , or one of them that I will inform you of the following . That is how to edit the default template from blogger or the other language must be modified template.Why should it be modified? Because the original template to create our own making will be difficult for the layman Sagat HTML language , this can only be done by the master only.

By way of editing your template friends one can maintain , remove or add new elements to the template that you want to give the impression of a unique look . To edit the standard templates blogspot is easy and simple how it works . Login to your blogger account , on your blog dassboard select template < > Edit HTML , will appear html code in it . Thus began the process of editing the template will your blog .

1 . The first step you should do is edit the main page by removing posting articles so that later on the main page / home page that appears only posting title only.
a. How it works you get to the settings template < > Edit HTML
b . Then find data='post'name='post/> <b:include code , then you delete the code and enter the following code :

<b:if cond='data:blog.homepageUrl !=data;blog.url'>
<b:if cond='data:blog.pageType !="item",'>
<a expr:href='data:post.url'>
< div style = " padding : 6px 0 6px 5px ; marginbottom :
2px ; background: eeeeee ; color: # 000000 ; >
<img alt='> >> ' border = '0 ' src = ' https://1h5.googleusercontent.com/-
HP5Xyc1Rqic/TXMMAKm1g5I/AAAAAAAAAQk/wrCGFu9jzmg/s1600/sidebaricon .
Png ' / >
<data:post.title/> < / div > < / a>
<b:else/>
<b:include data='post' name='post'/>
< / b : if>
<b:else/>
<b:include data='post' name='post'/>
< / b : if> 

Then save the template , check the results via preview template.If it is successful please continue to the next step.

2.Adding column widget at the top / bottom of the posting.

Still in the edit HTML page , look for the code ] ] > < / b : skin> , then enter the following code to copy and paste the above code way ] ] > < / b : skin>

/ * - under the posts - * /
# underpost h2 {
font-size : 13px {
font - weight: bold ;
color: # B8002E ;
border-bottom : 2px solid # 000000 ;
padding-left : 5px ;
}
# underpost {
Width ; 560px ;
}
# underleft {
Width: 270px ;/ * width of left column * /
float: left ;
margin ; 5px ;
}
# underrigth {
Width: 270px ; / * width of the right column * /
Float: right ;
Margin : 5px ;
}
Consider this code [ Width ; 560px ; ] , is a code of the post column width . Fit to width in your blog template . And to look for or know the width / column width searching posts like this code :
# main-wrapper { widht : 560px ;

If the width / column width posts like the above example , then the width of the two. Because a portion will be made of two columns left and right . Leave the value for the margin and padding to give the distance between gadgets . Thus the column width for the left and right sized 270px.
Once done then look for the code as shown below:
<div id='main-wrapper'> <b:section class='main id='main' showaddelement='no'> < b : widget id = ' blog1 ' locked = ' true ' title = ' blog posts ' type = ' Blog ' / > < / b : section> < / div >
If you have found the code, to add two pairs of columns in the above post under the code just below the code above .

<div id='underpost'>
<b:section class='underleft id='underleft'/>
<b:section class='underright id='underright'/>
< / div >

          And if you want to add two columns above post you just reverse the post just how it works . If you put it down to under the code and if you're going to stay on top of the post you put on the following code :
<div id='main-wrapper'>
Then save the template .

3.Furthermore, if you want to add 2 or 4 or more columns on the footer widgets are useful to make the blog homepage look like the model blogs Magazine.
Stride, look for the code <div id = "lower-wrapper '>, then place the following code just below the code <div id =" lower-wrapper'>

<div id='footer-column-divide'> <div id='footer1' style='width: 25%; float:left;Margin:0; text-align:left;'> < b: section class = ' footer - column ' id = ' co11'Preferred = ' yes ' style = ' float: left ; ' / > < / div > < div d = ' footer2 ' style = ' width: 25 % ; float ; left; Margin : 0 ; text-align ; left; ' > <b:section class='footer-column' id=co12'Preferred='yes' style='float:left;'/> < / div > < div id = ' footer3 ' style = ' width ; 25 % ; float: right ; margin : 0 ; text-align : left ; " > < b: section class = ' footer - column ' id = ' co13'Preferred = ' yes ' style = ' float : right ; ' / > < / div > <div id='footer4' style='width: 25%; text-align: float: right;Margin:0; left;'> < b: section class = ' footer - column ' id = ' co14'Preferred = ' yes ' style = ' float: right ; ' / > < / div > <div style='clear:both;'/> < / div >

The code above is an example of making the top 4 columns in the footer . If you want to just above 3 columns footer please just enter the code as much as 3 rows only and so on.

div id = ' footer1 ' style = ' width: 25 % ; float: left ; margin : 0 ; text-align : left ; " > < b: section class = ' footer - column ' id = ' co11'Preferred = ' yes ' style = ' float: left ; ' / > < / div > 

If all you have entered the code Correctly then save the template and see hasilnya.Cek on page elements will be no columns to display the widget. Add widgets that you think is best and use thumbnail display images to enhance the appearance of your blog . Suppose you want to display the latest article with a pretty thumbnail view. Please follow the steps: Elements of the page Add a widget HTML / Javascript please enter the code below into a widget:

<script type='text/javascript'> numposts var = 3 ; showpostthumbnails var = true ; var
displaymore = false ; displayseparator var = false ; showcommentnum var = false ; var
showpostdate = false ; showpostsummary var = false ; NUMCHARS var = 10 ; < / script >
<script type="text/javascript" src="/feeds/posts/default/-/your label?orderby=update&alt=jsonin- script&callback=labelthumbs"> < / script >

Or if you want to display only the selected article with the label you please replace posts (your label) with your label. Done already how to edit the default template of blogger. Good luck and helpful.

Judul: HOW TO EDIT DEFAULT TEMPLATE OF BLOGGER ; Ditulis oleh Unknown ; Rating Blog: 5 dari 5

Posted in: Tips blog