2012

Cara Pasang Iklan Di Sebelah Kanan Atau Kiri Postingan Blogspot

cara pasang kode iklan dikanan atau dikiri postingan blog

1. Login ke Blogger
2. Siapkan Kode iklan yang ingin dipasang dikanan atau kiri postingan blog
3. Edit HTML ==> Backup template
4. Beri tanda Centang Expand Template Widget
5. Lalu cari kode <data:post.body/> (jika terdapat lebih dari satu kode seperti itu, pilih kode yang ke dua)
6. Copy pastekan kode berikut ini di atas kode <data:post.body/>, pilih salah satu untuk posisi kanan atau kiri postingan

A. Kode dibawah ini untuk menampilkan iklan di sebelah kiri postingan blog

<div style='float:left;margin-right:10px'>
Ganti dengan Kode iklan yang sudah di parse
</div>

B. Kode dibawah ini untuk menampilkan iklan di sebelah kanan postingan blog
<div style='float:right;margin-left:10px;'>
Ganti dengan Kode iklan yang sudah di parse
</div>

7. Save template dan lihat hasilnya.

Untuk memparse kode iklannya silahkan parse Disini
Cara ini bisa diterapkan untuk menampilkan iklan google adsense atau PPc lainnya.
Selamat mencoba.

The #main and .post are the titles of each containers. Each container codes must be contained within {...}. For the explanation below, we'll focus on the codes inside the post block, especially for the explanation on the margin and padding (the codes colored in red).

Margin - sets the distance between the border of the container to the border of a parent (larger) container outside it. There are 4 numbers defining the Margin property. The 1st number sets the top margin, the 2nd sets the right margin, the 3rd number sets the bottom margin, and the 4th number sets the left margin. It basically sets the whole margin in a clock-wise fashion starting from the top. In the case above, the parent container for the post container is the main container. See how the dashed border for the blue (post) container is placed inside the green (main) container following the post block's margin command (the codes in red). If the post's margins are all set to zero, then the post container would be exactly the same size as the main container. Think of the Margin as a command that moves its border away from a parent border. Another thing, Margin can have a negative value, which means that it moves toward the parent border and may overlap it (not away from it).
Padding - sets the distance between the border of the container to the border of a child (smaller) container inside it. In the case of the post container, the child container is the post-body. The 4 numbers defining the padding sets the padding in a clock-wise fashion also, just like the Margin property. See how the post's padding puts the post-body inside the post container, away from the dashed border. Unlike the Margin, think of the Padding as a command that moves a child border away from its border. Padding values cannot be negative.
Min-width and Max-width - sets the width of the container. Usually, it's enough to write it as width = 400px (for example), but it's becoming more of my habit to set the width as strict as possible, because I sometimes saw that if it's not written strictly, the container width might shrink and expand freely on some situations and in some different browsers. So by setting the width strictly, I made sure that it looks exactly like I want at all times in all browsers (basically getting rid of alignment bugs). If you look at my newer templates, I even set the width redundantly, say in Main-wrapper and then in Main containers eventhough they are pretty much the same. Doing it this way solves some alignment bugs that I saw (eventhough I don't really understand why it solves it by writing it redundantly).
Background - sets the background color of the container. It uses the hexadecimal code for colors. See here for all the color values. You can also set a background image that repeats itself to cover the whole container block. The way to do this is by pointing to the URL of an image. For details on how to do this, see W3Schools tutorials. You can also set the value to be $samplevariable, where the variable is the one that you define in Subsection 1 in CSS Styling Structure.
Color - sets the color of your text using the hexadecimal color code, or the variable defined earlier in Subsection 1.
Font - sets the font of your text. You can use the variables set in Subsection 1 also. See W3Schools tutorials for more details on setting the font properties.
Text-align - sets the alignment of your text. The 3 options are either left, center, or right.
Line-height - sets the distance, or height, between two text lines.

Here is a sample code for the 2 containers:

#main { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; min-width: 400px; max-width: 400px; background: $mainbgColor; color: #111111; font: $textFont; } .post { margin: 0px 20px 10px 0px; padding: 10px 20px 10px 2px; line-height: 1.5em; text-align: left; background: $postbgColor; }

Source

Elemen CSS Template Blogspot

Subsection 1 - Variable:This subsection contains the declaration (the introduction) of the font and color variables that appear in the Fonts and Colors tab in the Layout page. For example, the Text Color or the Text Font variables that you can choose and modify using the Fonts and Colors tab. In my templates, I've added a lot of variables (close to 40+) compared to some of the standard Blogger templates to make it easy for you to customize a lot of things on the template.

Subsection 2 - Global:
This part contains the code to control the general appearance and layout. If you look at the green bar above, you'll see the code "body {.....}". This means that every code that goes inside the {.....} will control the general properties (size, layout, & appearance) of the body of the template (everything that the computer screen covers). For example, it controls the width of your whole template and the background color or image. But it doesn't control the detailed properties of the whole template (that is done by all the other subsections). Or, if you do set the detailed properties inside the body container, say the Text Font, and then reset the same properties inside a smaller sub-container, the properties set in the body container will be overridden, or canceled.

Inside this subsection, you will also find other important large containers - the Outer-wrapper and the Content-wrapper - so this subsection is where you want to look for if you want to tweak those containers.

Subsection 3 - Header:This part controls the properties of everything inside your Header-wrapper container. The most common ones are the Blog Title and the Blog Description. In most of my templates, I've added an extra object in the Header-wrapper - the Linkbar (or the horizontal menubar). Typically, you can't add extra object in the Header because you can't use the Add Page Element tab. To add the Linkbar, I had to change the 3rd Section of the template code structure (which is the Data section). In my own blog (dzelque.blogspot.com), I added something else, which is the Google Search Bar. Ideally, you can add just about anything you want there, if you know how to deal with the 3rd Section. We'll get to this later.

Subsection 4 - Main:This part controls the properties (size, layout, and appearance) of everything that the Main-wrapper block contains - the Date Header, the Post, the Comment, the Feed Link, and any widgets that you drag into the Main section using the Add Page Element tab.

Subsection 5 - Sidebar:This part controls the properties of everything inside your Sidebar-wrapper - for example the Labels, Blog Archive, Adsense units, Link Lists, etc. But, it doesn't set how many sidebars you have or their locations on the blog (example Sidebar-Main-Sidebar or Main-Sidebar-Sidebar). That part is done in the Section 3 of the Blogger Template Code Structure - the Data Section.

Subsection 6 - Miscellaneous:This part controls the properties of additional elements in your blog that's not controlled by all the above subsections. These elements are the Profile (or the About Me block), the Blogquote, and the Code. It means if you want to, say, change the color of the quoted text or the font of your nickname in the About Me block, this is where you want to look for to tweak it.

Subsection 7 - Post-Footer:

In my Generic Template, this part controls the properties of 3 things:

The Post-Footer - the texts below your post body. This is the part that contains information about your post, or the texts that say "Posted by YourNickname, Labels: ....., 5 Comments, etc.
The Blog-Pager - the links at the bottom of your blog posts that say "Newer Posts, Home, or Older Posts".
The Feed-Link - the link that says "Subscribe to: Posts (Atom)".

Subsection 8 - Comment:This part controls all the properties of the Comments section in your blog.

Subsection 9 - Footer:This part controls all the properties in the Footer section. Generally, the Footer section contains some text explaining the ownership or copyright of a blog. In some other blogs, they also put extra stuff in the Footer section, like the Recent Posts or Popular Posts in 2 or more columns. Basically, you can just put about anything in the Footer as in the Sidebar.

Source

Body: the outer most block is the Body of your template (basically everything that the computer screen covers).
Outer-wrapper: this container covers your whole template (the body is more like the outside of your template). In general, you build a wrapper to place a multiple of smaller blocks inside it. The most common blocks inside this Outer-wrapper is the Header, Content, and Footer.
Header: this block is the top most part of your blog (the name is quite obvious). But inside the Header you will have other sub-blocks too - the Header Title block, the Header Description block, and others such as the Adsense banners, a menu bar, etc. So, to wrap all these sub-blocks inside one large container, the largest container in the Header section is usually a Header-wrapper that wraps everything inside.
Content: below the Header is the Content-wrapper - basically the most important container block of all. Immediately inside this wrapper are the Sidebar containers (1,2 or any number of sidebars) and the Main container (which contains your posts, comments, or some ads).
Footer: is the bottom most container of your template. As in the Header section, you'll also need a Footer-wrapper to contain other sub-blocks in the Footer section.
Main: the Main-wrapper is the outer most container in the Main section which goes inside the Content-wrapper. Inside this Main-wrapper are the Post block, Comment block, Date Header, and other widgets created from the Add Page Element option.
Sidebar: is the block that contains all your side widgets - About Me, Labels, Archive, Text, HTML, Adsense, etc. In a standard Blogger template, you will usually find only 1 sidebar - hence the 2-column template (Main and Sidebar). But it's actually easy to add multiple number of sidebars. The most common ones are 2 sidebars - or the 3-column template. You will see from these tutorial series that once you understand the template structure, it's actually easy to add and move the sidebars to the left or right of your Main container.
Blog Post: this block contains the important stuff - your Posts Titles, Post, Post Author, Labels, etc.

One other way to see this structure is from the hierarchical point of view. Starting from the largest container to its sub-containers, the structure looks like this:

Body

Outer-wrapper

Header-wrapper

Blog Title
Blog Description
Other widgets

Content-wrapper

Sidebar-wrapper (1,2,3...)
Main-wrapper

Date Header
Posts

Post Title
Post Content (or called Post Body)
Post Footer (Author, Labels, etc)

Comments
Feed Link
Other widgets (mostly ad units)

Footer-wrapper

Footer text (disclaimer, copyrights, etc)
Other widgets

Source

Facebook Like Box Valid Xhtml Blogspot

Facebook Like Box valid xtmhl ini berguna jika template sobat belum menggunakan HTML5 karena ada bagian attribut pada FB like box yang tidak valid xthml, tapi jika template sobat sudah menggunakan html5 rasanya sudah valid xhtml. berikut cara membuat facebook like box yang paling xhtml:

Klik disini dulu untuk mengambil kode script facebook like box:
Atau langung copy paste kode Facebook like box yang valid xhtml dibawah ini :

<div id="fb-root"></div>
<script type="text/javascript">
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js#xfbml=1';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<div id="FbCont">
<script type="text/javascript">
<![CDATA[//><!]]>
</script>
</div>

Keterangan : Ganti "Your Facebook Fan Pages" dengan Punya sobat.
Selesai.

Cara Buat Readmore Tanpa Javascript Di Blogspot

Mengurangi penggunaan javascript akan mengurangi beban loading blog pada browser, dan akan membantu meningkatkan pagespeed blog, bisa juga mengkompres fies javascript untuk memperkecil ukuran files javascript. tapi lebih baik tidak terlalu banyak menggunakan javascript pada blog terutama seperti blogspot.

Nah Readmore selama ini banyak menggunakan files javascript dan untuk membuat readmore blogspot tanpa javascript
bisa di ikutin tips dibawa ini:

1. Login ke blogger
2. pilih Edit HTML template
3. Beri tanda centang Expand Widget Templates
4. Lalu cari kode berikut <data:post.body/> dan ganti dengan kode dibawah ini :

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.thumbnailUrl'>
<a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' expr:src='data:post.thumbnailUrl'/></a>
<b:else/>
<a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOfIpSFaYeuEJcPOuh3mMS-2hI7hyphenhyphenRDkpXGjxSGvXQffLZGAwIpjNxE6TeBobjIEqR5kM00DG0HrL6y_V3IZqu3IFKjBrs8SY6IH1YQHV8CGZr7EJV1uuWhufvKtf3zaig9uEnw4InT1E/s1600/no-image.png'/></a>
</b:if>
<div class='post-snippet'><data:post.snippet/></div>
<div class='rm-button-wrap'>
<a class='button' expr:href='data:post.url'>Readmore</a>
</div>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
</b:if>
</b:if>

5. Simpan template.

Catatan:

1. Jika template sebelumnya sudah menggunakan Autoreadmore dengan javascript silakan cari kode berikut ini:

<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>

2. Lalu ganti semua kode diatas sehingga akan menjadi seperti ini :

    <b:if cond='data:post.thumbnailUrl'>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' expr:src='data:post.thumbnailUrl'/></a>
    <b:else/>
        <a expr:href='data:post.url'><img class='post-thumbnail' alt='thumbnail' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOfIpSFaYeuEJcPOuh3mMS-2hI7hyphenhyphenRDkpXGjxSGvXQffLZGAwIpjNxE6TeBobjIEqR5kM00DG0HrL6y_V3IZqu3IFKjBrs8SY6IH1YQHV8CGZr7EJV1uuWhufvKtf3zaig9uEnw4InT1E/s1600/no-image.png'/></a>
    </b:if>
    <div class='post-snippet'><data:post.snippet/></div>

3. Sedikit modifikasi readmore blogspot kamu dengan bantuan CSS.
Copy dan pastekan kode css dibwah dan letakkan sebelum kode ]]></b:skin>

    .post-thumbnail {
      width:100px;
      height:100px;
      float:left;
      margin:0px 10px 0px 0px;
      }/div>

Atur setting ukuran sesuai keingingan sobat

4. simpan dan lihat hasilnya.

Tambah 3 Kolom Pada Template Standar Blogspot

1. Login Blogger
2. Template ---> EDIT HTML ---> beri centang Expand Widget Templates
3. Cari </b:skin>
4..Pastekan kode berikut:

#footer-bottom {
width: 900px;background:transparent;
position: relative;display:inline;
clear:both;
margin:0 auto 0;
color:#EB1E1E;
float: left;
padding:10px;
height:498;
}
#left-bottom {
width: 33%;
float: left;display:inline;
margin:10px 5px 0 5px;
padding:5px
}
#center-bottom {
width: 33%;
float: left;
margin:10px 5px 0;
padding:5px
}
#right-bottom{
width: 33%;
float: left;display:inline;
margin:10px 5px 0;
padding:5px
}

6.Cari kode <div id='footer'> atau <div id='footer-wrapper'>

Pastekan kode berikut dibawahnya:

<div id='footer-bottom'>
<b:section class='footer-bottom' id='left-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='center-bottom' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='footer-bottom' id='right-bottom' preferred='yes' showaddelement='yes'>
</b:section>
</div>

Keterangan :
33% menandakan bahwa kolom tersebut akan berukuran 33% dari ukuran layar...
Hitungan % digunakan jika sobat malas menghitung ukuran layar blog anda.
Jika ingin 4 kolom maka harus 25%.

Remove Missing Title Rpc Relay From Webmaster Google

Simple to remove or delete error Missing Title Rpc Relay From Webmaster Google
Follow this step :

Login in blogger.com
Put This code below :

<b:if cond='data:blog.url == "http://yours.blogspot.com/rpc_relay.html"'>
<title>rpc relay path</title>
<meta content='NOINDEX, NOFOLLOW, NOARCHIVE' name='robots'/></b:if>

Save template, check out in Webmaster google again.

Note : Change in the "blue" text with your blog

Nomor Halaman Paling Cocok Untuk Semua Template Blogger

Postingan dengan banyak halaman pasti lebih mudah jika ditambah navigasi nomer halaman, apalagi blog telah memasang fungsi readmore, tapi terkadang setelah mencoba beberapa tips sering gagal dan nomer halaman tidak tampil, nah ini ada navigasi nomer halaman yang bisa digunakan untuk template blogspot dan pasti cocok dengan template blogger sobat.

1. login ke blogger.com --> Go to Design --> Edit HTML > Check mark Expand Widget Templates.
Cari code ini :

<b:includable id='mobile-index-post' var='post'>

2. Pastekan kode dibawah ini sebelum kode diatas :

<b:includable id='page-navi'>
<div class='pagenavi'>
<script type='text/javascript'>
var pageNaviConf = {
perPage: 7,
numPages: 5,
firstText: "First",
lastText: "Last",
nextText: "»",
prevText: "«"
}
</script>
<script src='http://nomer-halaman.googlecode.com/files/onlinetrick.js' type='text/javascript'/>
<div class='clear'/>
</div>
</b:includable>

3. Kemudian cari code ini pada template sobat :

<b:include name='nextprev'/>

4. Gantikan / replace dengan kode dibawah ini :

<b:if cond='data:blog.pageType == "index"'>
<b:include name='page-navi'/>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<b:include name='page-navi'/>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<b:include name='nextprev'/>
</b:if>
</b:if>

5. Untuk kode CSS. cari ]]></b:skin> kemudian copy kode scripts dibawah ini diatasnya

#blog-pager,.pagenavi {
clear:both;
text-align:center;
margin:30px auto 10px;
}

#blog-pager a,.pagenavi span,.pagenavi a {
text-decoration:none;
color:#fff;
background:#e06666;
-moz-border-radius:2px;
-khtml-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
-webkit-transition:all .3s ease-in;
-moz-transition:all .3s ease-in;
-o-transition:all .3s ease-in;
transition:all .3s ease-in;
margin:0 5px 0 0;
padding:2px 10px 3px;
}

#blog-pager a:visited,.pagenavi a:visited {
color:#fff;
}

#blog-pager-older-link,#blog-pager-newer-link {
float:none;
}

.pagenavi .pages,.pagenavi .current {
font-weight:700;
}

.pagenavi .pages {
color:#fff;
background:#e06666;
}

#blog-pager a:hover,.pagenavi a:hover,.pagenavi .current {
color:#fff;
text-decoration:none;
background:#000;
}

6. Save template.

Cara Mudah perbaiki "Missing required field "updated"

Warning "Missing required field "updated ini akan muncul setelah menjalankan Rich Snippets Testing Tool di Webamster google. ini disebabkan kita tidak memberi tanda centang pada blog posts yang menyangkut jam postingan, pada configure blog post pada layout template, ini juga sangat berpengaruh harus diperbaiki karena menyangkut verifikasi blog yang kita tulis selain verifikasi author link dan link profile google.

Untuk memperbaiki Warning "Missing required field "updated ada banyak cara, tapi saya menggunakan tehnik ini dan berhasil.

1. Login dengan account blogger sobat
2. Pilih edit HTML --> beri centeng "Expand Widget Templates" ---> backup jika perlu
3. Caro kode berikut :

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>

4. Copy pastekan pada notepad
5. Ganti kata 'published' dengan kata 'updated'
6. jadinya seperti dibawah ini :

<a class='updated' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='updated' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>

7. Copy pastekan kembali kedalam template sobat tepat dibawah kode ini :

<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>

8. Simpan template dan cek lagi di : http://www.google.com/webmasters/tools/richsnippets?
9. Selesai

Disable Loading Gear Dinamic Template

Buat sahabat blogger yang menggunakan tampilan Dynamic Views pada template blog nya terkadang ditanya atau bahkan kadang bertanya pada diri sendiri ketika mencoba mem views kan halaman blog nya yang menggunakan Dynamic templates, kok selalu ada gambar pembuka seperti loading gear sebelum menuju halaman blog.

Buat yang sudah tahu cara mematikan atau mendisable loading gear pada tampilan Template Dynamic rasanya tidak sulit tapi buat yang baru mencoba bisa mencoba trik berikut :

Untuk Sobat pengguna tampilan dashboard lama blogger / old Blogger interface:

1. Pilih Dashboard
2. Design
3. Template Designer
4. Advanced
5. Add CSS
6. Paste Code ini :

.ss,.blogger-gear{
display: none;
}

7. Apply to Blog.

Untuk pengguna tampilan dashboard Baru / new Blogger interface:

1. Dashboard
2. Template
3. Customize
4. Advanced
5. Add CSS
6. Pastekan code yang sama pada kolom yang tersedia

.ss,.blogger-gear{
display: none;
}

7. Apply to Blog.
Semoga bermanfaat.

Cara Menghapus Duplicate Titles And Duplicate Descriptions Blogspot

Remove Duplicate Titles

1. Login to your blogger account
2. Click Layout -> Edit HTML), click on "Expand Widget Templates".
3. Then find (CTRL+F) this code:

4. Replace the entire code with this new code:

<b:if cond='data:post.commentPagingRequired'>
<a expr:href='data:comment.url' title='comment permalink'> <data.comment.timestamp/> </a>
<b:else/>
<a expr:href='data:blog.url + "#" + data:comment.anchorName' title='comment permalink'> <data:comment.timestamp/> </a>
</b:if>

Remove Duplicate Descriptions

1. Login to your blogger account (Blogger-> dashboard -> Layout -> Edit HTML)

2. find (CTRL+F) the code for meta description tag, something like this:

3. Replace with this code :

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content="GENERAL_DESCRIPTION_HERE" name="description"/>
</b:if>

4. Now save the template.

How To Make Template Blogspot Valid With Validator.w3.org

Login with your blogger account first, follow this step :

Step 1
First time you must edit the DOCTYPE for get the better HTML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

change to:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Save template.

Step 2
To further expand the widget to find the hidden code that contain on the widget. Search this code and delete them, this code use for quick edit icon on widget.

<b:include data='post' name='postQuickEdit'/>

and

<b:include name='quickedit'/>

This code will added when we add new widget, so dont forget to check if you added new widget

Step 3
Be sure to always use the alt= code for each image and close the image with />

Step 4
Do not use the widget Archive using Hierarchy view, because it will show a lot of errors. Better to use the Model List, thereby reducing errors, but it will look more simple and elegant.

Step 5
Becarefully for using this step, couse small mistake can make some error on the blogs.

First time you can del this code for default injection code from blogger.

<b:include data='blog' name='all-head-content'/>

For change the injection by manualy follow this code and edit the bold content with your own, couse this is unique nothing same on each blog.

<meta content='true' name='MSSmartTagsPreventParsing'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link expr:href='data:blog.url' rel='canonical'/>
<link href='http://www.blogger.com/profile/YOURBLOGERID' rel='me'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link href='http://www.blogger.com/rsd.g?blogID=YOURBLOGID' rel='EditURI' title='RSD' type='application/rsd xml'/>
<link href='http://www.blogger.com/feeds/YOURBLOGID/posts/default' rel='service.post' title='BLOGTITLE - Atom' type='application/atom xml'/>
<link href='http://www.YOURBLOGURL.blogspot.com/feeds/posts/default' rel='alternate' title='BLOGTITLE - Atom' type='application/atom xml'/>

YOURBLOGERID: is your blogger profile ID show in numberic on your blogger profile URL.
YOURBLOGID: is your blog ID show when we edit our blog, check on the url identity with numberic.
BLOGTITLE: is your blog title.
YOURBLOGURL: is your blog url .com

Step 6
Check your CSS skin code, don’t use many dash (-) code to the CSS. its contain error for that code. Use max only two dash on your css for explain some code tag.

Step 7
This step will make big change on your blogger blog, this code will delete the navbar and also some inject code from blogger. Still on HTML Editor, place this code between </head> and <body> code :

Step 8
For page navigation that contain error url, we can hide that link. But that link is needed for good navigation. The error only on index pages, so we can hide the link only on index pages. Here the tricks, find this code

<b:include name='nextprev'/>

Replace with this code :

<b:if cond='data:blog.homepageUrl != data:blog.url'>

<b:include name='nextprev'/>
</b:if>

Closing
I think it is still a lot of code that needs to be correct and the most basic is the use of the code (&) that contain error code for not in the end with (;). In addition there are also errors in the comment box susunanya inappropriate. Although not all mevalidasi this blogger template, but at least we can minimize errors.

Do not forget to always perform validation checks on the page to find the remaining errors on our blog after doing the step-step above.

Visit : www.validator.w3.org

Hide Navigation Bar Blogspot

Navigation Bar is fasility of blogger.com. But many blogger want to hide this navbar because it will make their blog layout look better without a box (navbar) above it. The Question "is this break TOS (Term Of Service) of blogger.com?" I don't know, but so far is good, there are many blogger hide their navbar but no reaction from blogger.com. So? do you want to hide Your blog navbar? if you want here's the trick to hide blogger navbar:

1. Login to Blogger --> Layout --> Edit HTML.
2. Copy the code below and insert into your <head> tag.

#navbar-iframe {
display: none !important;
}

3. Example put like this

-----------------------------------------------
Blogger Template Style
Name: xxx
Designer: xxx
URL: http://palingkomplet.blogspot.com
Date: Januari 2012
----------------------------------------------- */

#navbar-iframe {
display: none !important;
}

/* Variable definitions
====================

4. Save your setting, and open your blog, You will have no navbar in your blog page

Enjoy

Cara Pasang Readmore Otomatis Blogspot

Adapun langkah-langkah Cara Pasang Readmore Otomatis di Blogspot adalah sebagai berikut:
1. Login ke Account Blogger Anda;
2. Masuk ke halaman Edit HTML, lalu diatas kode </head> letakkan script di bawah ini:

3. Cari dan ganti kode <data:post.body/> dengan semua kode dibawah ini:

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READMORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

4. Simpan/Save Template.

Catatan : Biasanya kode: <data:post.body/> berada di bawah kode: <div class='post-body'>, maka untuk memudahkan pencarian kode tersebut gunakan tombol Find seperti penjelasan di atas.

Cara Setting Blog Menjadi Dofollow

Nofollow artinya link yang anda masukkan pada saat anda memberikan komentar disebuah blog tidak akan ditelusuri lebih lanjut oleh mesin pencari dalam artian anda tidak akan mendapatkan backlink dari blog tersebut, sementara kita tahu bahwa backlink merupakan salah satu unsur penting dalam peningkatan page ranking.

Sedangkan Dofollow memiliki arti yang sebaliknya, dalam artian anda akan mendapatkan backlink dari komentar yang anda berikan pada sebuah blog, yah anggaplah sebagai hadiah dari sipemilik blog kepada anda karena sudah bersedia memberikan komentar yang berkualitas di blognya. Secara default setting komentar sebuah blog adalah nofollow, tapi anda dapat merubahnya menjadi dofollow.

Cara Setting Blog Menjadi Dofollow, sebagai berikut:

1. Login ke Blogger.com --> kemudian klik menu Rancangan/Layout masuk ke tab Edit HTML --> beri tanda contreng pada kotak disebelah tulisan Expand Widget Templates;

2 Cari kode HTML yang menyusun komentar di blog anda, kira-kira kodenya seperti ini:

3. Langkah selanjutnya hapus tulisan yang bercetak tebal sehingga kode HTML blog anda menjadi seperti di bawah ini:

4. Save Template

Untuk mengetahui apakah blog anda sudah Dofollow atau belum, Anda bisa melakukan pengecekan dengan cara klik kanan di halaman blog dan klik view page source. Jika anda masih menemukan tulisan rel='nofollow' berarti blog anda belum Dofollow.

Cara Menghapus Langgan: Entri (Atom)

1. Login ke Blogspot
2. Klik Rancangan/Design --> pilih Edit HTML, beri ih centang pada kotak Expand Template Widget dan gunakan tombol Find untuk memudahkan pencarian kode;
3. Cari kode di bawah ini:

<b:include data='feedLinks' name='feedLinksBody'/>

4. Delete semua kode di atas
5. Save Template

Cara Menghilangkan Tulisan Entri Lawas Pada Blogspot

1. login Dengan Account Blogger Anda -->Masuklah ke halaman Dasboard lalu klik Rancangan.
2. Kemudian klik pada Edit HTML.
3. Untuk berjaga-jaga jika terjadi kesalahan sebaiknya backup dulu template anda dengan mengklik Download Template Lengkap.
4.Kemudian centanglah Expand Template Widget.
5. Kemudian carilah kode: <b:includable id='status-message'>
6. Agar lebih mudah mencarinya tekan (Ctrl + F) pada keyboard lalu tekan Enter. Maka akan muncul kotak Find. Ketiklah kode yang akan dicari pada kotak tersebut lalu tekan Enter, maka secara otomatis akan muncul kode yang dicari dalam keadaan terseleksi dengan warna hijau.
7. Kemudian scroll sedikit ke bawah, maka akan tampak beberapa baris kode pengiringnya, sehingga lengkapnya akan terlihat seperti dibawah ini.

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

8. sekarang gantilah semua kode tersebut dengan kode di bawah ini. Agar lebih mudah anda bisa copy saja lalu paste kan tepat pada semua kode di atas.

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

9. Simpan template.

Template Html5 Paling Baik Untuk SEO

Sintaks HTML5 saat ini sedang dikembangkan sebagai revisi utama berikutnya dari HTML (HyperText Markup Language), bahasa markup inti dari World Wide Web. HTML5 adalah standar berikutnya diusulkan untuk HTML 4.01, XHTML 1.0 dan DOM Level 2 HTML.HTML5 juga mencakup Formulir Web 2.0, spesifikasi lain WHATWG. Selain menetapkan markup, HTML5 scripting menentukan application programming interfaces (API)yang ada Dokumen object model (DOM) antarmuka yang diperpanjang ada juga API baru, seperti:

#Unsur kanvas untuk menggambar model 2D
#Jangka waktu media pemutaran
#Offline penyimpanan database (aplikasi web offline)
#Dokumen untuk mengedit
#Drag-dan-drop
#Cross-dokumen pesan
#Browser sejarah manajemen
#Tipe MIME dan pendaftaran protokol penangan.
#Microdata

Seperti yang kita ketahui ada HTML ada juga css yang mendukung, CSS yang mendukung bahasa html 5 adalah CSS3 apabila sudah di terapkan bahasa tersebut kedalam web kita bisa menceknya di W3C yang akan berkata selamat anda sudah menerapkan HTML5 di dalam web anda yang berarti semua pharse dan sintaxs sudah valid dan tidak salah. Inti dari html 5 ini sebenarnya untuk membenarkan sintaxs <div> dan juga <span> yang di gunakan dalam semantik umum dan memperkenalkan unsur audio, video..Kesimpulannya halaman akan di bagi menjadi bagian yang terpisah seperti konten utama, menu, headers, footer dll.
oke.. biar ga bingung dibawah adalah unsur baru yang ada di html 5:

1.Sebuah tag baru <section>
Tag <section> baru dapat digunakan untuk mengidentifikasi bagian yang terpisah pada halaman, bab, buku. Keuntungannya adalah setiap bagian dapat memiliki HTML terpisah. Seperti dengan tag <article>, mesin pencari akan lebih memperhatikan isi bagian yang terpisah. Misalnya, jika kata-kata dari sebuah string pencarian ditemukan di satu bagian, ini menunjukkan relevansi yang lebih tinggi dibandingkan dengan kata-kata yang ditemukan di seluruh halaman atau dalam bagian yang terpisah.

2.tag baru <header>
Tag <header> baru (yang berbeda dari unsur kepala) merupakan rahmat bagi para ahli SEO karena memberikan banyak fleksibilitas. Tag <header> sangat mirip dengan tag <h1></h1>
tetapi perbedaannya adalah ini bisa mengandung banyak arti, seperti H1, H2, H3 elemen, seluruh paragraf teks,link yang kuat, dan jenis lain dari informasi yang relevan.

3. Sebuah tag baru <footer>
Tag <footer> mungkin tidak berguna sebagai <header>tetapi masih memungkinkan untuk memasukkan informasi penting di sana dan dapat digunakan untuk tujuan SEO juga. <header> dan tag <footer> dapat digunakan berkali-kali dalam satu halaman.yaitu sobat dapat memiliki header yang terpisah / footer untuk setiap bagian dan ini benar-benar memberikan banyak fleksibilitas.

4.Sebuah tag baru <nav>
Navigasi merupakan salah satu faktor penting untuk SEO dengan navigasi semua bisa mudah untuk penguna.Tag <nav> baru dapat digunakan untuk mengidentifikasi sebuah koleksi link ke halaman lain.

Kalau di kaitkan dengan pengaruh seo ini jelas mempunyai perbedaan karena mesin pencari akan lebih memperhatikan element baru seperti:

article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, mark, meter, nav, output, progress, rp, rt, ruby, section, source, summary, time, video

Itu adalah element baru yang akan di terapkan di dalam html 5 yang akan membuat web menjadi sederhana dan berkembang lebih baik.

sumber: http://seoconsult.co.uk

Cara Membuat Navigasi Breadcrumb Di Blogger

1. Login di blogger.com
2. Pilih menu Tata Letak (Layout) =>> Edit HTML
3. Beri tanda Centang bagian yang ada tulisan Expand Widget Templates.
4. Cari Kode Ini

<b:includable id='post' var='post'>

<div>
5. Kemudian letakkan kode dibawah ini tepat di bawah kode tersebut

    <em>Browse: <a expr:href='data:blog.homepageUrl'>Home</a> / <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> / </b:if>
    </b:loop>
    </b:if> / <a expr:href='data:post.link'><data:post.title/></a></em>

6. Simpan pengaturan template anda.

Catatan* Breadcrumb tersebut hanya akan terlihat di halaman artikel (post page) saja.

Selain cara di atas sobat bisa juga menggunakan cara lain dengan menambahkan sedikit kode CSS di template blogger sobat.

Cari kode ini :

]]></b:skin>

Pasang kode CSS berikut tepat di atas kode ]]></b:skin> tadi

    .breadcrumbs{
    padding:5px 5px 5px 0;
    margin:0;font-size:95%;
    line-height:1.4em;
    border-bottom:4px double #cadaef;
    }

Kemudian cari kode

<b:includable id='post' var='post'>

Setelah itu letakkan kode dibawah ini tepat di bawah kode diatas:

    <div class='breadcrumbs'>
    Browse: <a expr:href='data:blog.homepageUrl'>Home</a> / <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> / </b:if>
    </b:loop>
    </b:if> / <a expr:href='data:post.link'><data:post.title/></a>
    </div>

Simpan template.

How To Make Threaded Comments Blogspot

1. Login to blogger.com
2. Design --> Edit HTML --> (download a backup of your Template). Find this code snippet :

<b:include data='post' name='comments'/>

and replace with this code :

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>

Check in preview your blog.

If that too doesn’t work
1. Make sure that you have enabled Comment Feeds
2. Check and Use the Embedded Comment Form.

Enjoy

How To Make Good Tags Meta Post Title And Blog Title In Blogspot

1. Login in to blogger.com
2. Go to Layout --> edit HTML in your Blogger dashboard.
3. Search for this tag: <title><data:blog.pageTitle/></title>
4. Replace this tag with the following code:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

5. Save your template.

Adding Google+1 Button to Blogspot

1. Login with your blogger account
2. Go to Blogger Dashboard --> Design --> Edit HTML
and click on the button which says “Expand widget Templates”.
3. find </head> and immediately above that paste

5. Now find <data:post.body/> and immediately below that paste

6.Save the template.

Pasang Fungsi Scroll Labels Blogspot

1. Login to Blogger.com
2. Backup tempalte sebagai cadangan
2. Beri tanda centang Expand Widget Template
3. Cari kata Labels tepatnya seperti ini:

<b:widget id='Label1' locked='false' title='Label' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>

<div style='overflow:auto; width:ancho; height:100px;'>

4. Kode warna biru adalah kode yang harus kalian tambahkan
5. Kode yang berwarna merah menyatkan tinggi scroll ( bisa disesuaikan ) dengan template kamu.
6. Terakhir Simpan Template sobat.

Cara Buat Scroll Arsip ( Archive Scrolling ) Blogspot

Fungsi scroll pada arsip blog berguna untuk memperpendek barisan arsip yang panjang melebar kebawah jadi terkesan panjang kebawah, cara merubahnya cukup menambahkan kode kolom scroll.

Caranya begini :

1. Login Akun blogger
2. Masuk ke Edit html
3. Backup dan Simpan Dahulu template blog sobat
4. Beri tanda centang kotak Expand Template Widget
5. Carilah 'Arsip Blog'(dengan catatan sudah terpasang di blog sobat)
6. Cari kode <div id='ArchiveList'>
7. Lalu letakan kode dibawah ini diatasnya (kode No. 6)
<div style='overflow:auto; width:ancho; height:100px;'>
8. Jadinya seperti ini :

<b:widget id='BlogArchive2' locked='false' title='Arsip Blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>

<div style='overflow:auto; width:ancho; height:100px;'>

9. Save Template

Cara Disable Copy Paste Di Blogspot

Script ini sama fungsinya dengan script disable klik kanan mouse, tapi yang cara yang ini dengan memasukan kode script pada template blog sobat. fungsinya sama melindungi aksi copy paste orang pada konten blog kita, areal sortir tidak akan keluar apalagi klik kanan copy.

Tapi menurut saya yang namanya Tutorial buat apa di protect banget, apalagi tutorial blogger/blogspot.Biarlah mudah dicopy dan disharing temen biar bisa nambah traffic ke blog kita, untuk yang suka copy paste tanpa ngasih keterangan link sumber biarin deh, elmunya gak bakal nambah kok, kecuali konten blog sobat bener bener orisinil dan perlu perlakukan protect dari copy paste. Jika ingin tetep masang anti copy paste atau disable klik kanan copy buat blogspot begini caranya:

1. Log in dengan akun Blogger sobat
2. Go to Layout -> Edit HTML
3. Backup dulu template blog sobat
4. Klik “Expand Widget Templates”
5. Cari kode <head> pada template blog kalian :

Copy pastekan code dibawah ini sesudah kode diatas :

<script language='JavaScript1.2'>
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>

5. Kemudian Save.

Catatan :

Kelemahan cara ini masih bisa diakali lewat mematikan fungsi Enable pada browser, dan script ini tidak berfungsi karena menggunakan bahasa Javascript. semua kembali kepada manusianya klo sama sama belajar harusnya sama sama membantu ada etika sesama blogger tanah air.

Cara Mudah Pasang Disable Klik Kanan Mouse Di Blogspot

1. Login to blogger.com dengan akun sobat
2. Go to Layout --> Add a Gadget --> Select html/javascript
3. Copy pastekan kode dibawah ini :

4. kemudian SAVE.

Untuk Melihat Hasilnya coba klik kanan mouse di blog sobat. Akan Keluar Tulisan “Ijin Dulu Deh”, Nah tulisan diatas masih bisa sobat ganti dengan kata kata sobat sendiri, Selamat Mencoba.

Cara Merubah TiTle Blog Jadi Title Postingan

Coba browser Halaman Blog kamu misal http://palingkomplet.blogspot.com, Nah di address browser pasti tertulis Title/Judul blog sobat. Coba sobat blogger klik salah satu postingan blog sobat pasti sama yang terlihat pasti Tile atau judul blog sobat. Tapi jika yang tertera judul Postingan sobat itu tandanya sudah bener, karena antara judul blog dan Judul postingan harusnya berbeda.

Untuk yang masih memakai template standar bawaan blogger pasti seperti itu, tapi jika sobat memakai template blogger yang sudah editan pasti beda. tapi tidak soal sobat bisa kok menerapkannya sendiri, caranya mudah mengganti judul blog dengan judul postingan.
Ikutin ini :

   1. Login ke blogger.com dengan akun sobat.
   2. Pilih Tata Letak dan Edit HTML.
   3. Cari kode seperti ini ( biasanya berada di bawah kode <head>) :

4. Ganti kode diatas dengan kode dibawah ini :

          <b:if cond='data:blog.pageType == "index"'>
          <title><data:blog.title/></title>
          <b:else/>
          <title><data:blog.pageName/></title>
          </b:if>

Sobat blogger juga bisa menambahkan kode di belakang </title> Jika ingin menampilkan judul blog atau keyword dibelakang judul postingan
Seperti dibawah ini :

          <b:if cond='data:blog.pageType == "index"'>
          <title><data:blog.title/> | Judul blog sobat atau keyword </title>
          <b:else/>
          <title><data:blog.pageName/></title>
          </b:if>

5. Setelah selesai tinggal di Save.

Maksudnya begini untuk halaman utama titlenya akan tetap “Judul blog sobat”, Tapi setelah di klik salah satu postingan , maka judul blog akan berubah sesuai judul postingan yang tadi di klik tersebut..

Semoga bermanfaat

Cara Mudah Buang Tanda Tang Atau Obeng Di Blogspot

Buat blogger yang masih baru belajar ngeblog di blogger pasti pernah deh ngalami posting baru di blog dan waktu cek postingan baru terlihat ada tanda tang atau obeng di tiang wodget, itu artinya sobat sedang posisi login di blogger.com tapi jika sobat logout tanda ini tidak tampak di browser halaman URl Blogspot sobat.

Sobat tidak perlu kawatir tanda itu merupakan sebuah tool yang berfungsi untuk mengedit widget secara langsung pada halaman blog. Sehingga Anda tidak perlu lagi masuk ke menu Page Elements untuk melakukan pengeditan. Dengan demikian sobat akan bisa lebih mudah untuk mengedit blog sobat. Jadi jika kita masuk ke blog kita tanpa login ke blogger maka icon ini tidak akan muncul begitu juga pengunjung yang mengunjungi blog kita. Tapi jika sobat tidak menginginkannya bisa dihapus kok, begini caranya :

1. Login ke Blogger. Klik Design -> Edit HTML.
2. Lalu backup template blog sobat dahulu dengan cara klik pada Download Full Template
3. Jika sudah, beri centang pada "Expand Widgets Templates"
4. Tekan Ctrl+F untuk membuka kotak Find
5. Ketikkan kode <b:include name='quickedit'/> ke dalam kotak lalu klik Next
6. Jika sudah ketemu, hapus kode tersebut. Setiap kode <b:include name='quickedit'/> mewakili satu icon tang dan obeng jadi jika template Anda terdapat lebih dari satu icon tang dan obeng. Gunakan Ctrl+F untuk mencarinya.
7. Kalau sudah menghapus semuanya. Klik Save Template lalu klik View Blog untuk melihat hasilnya. Sekarang semua icon quick edit yang berbentuk tang dan obeng sudah tudak ada lagi. Jika masih ada, mungkin masih ada kode <b:include name='quickedit'/> yang belum terhapus. Coba cari kembali dengan cara diatas.

Keterangan :

Keuntungan menghapus code diatas ternyata mengurangi error validasi blog di www.validator.w3.org

Cara Hilangkan Navigasi Blogger

1. Login dengan akun blogger kamu.
2. Klik Rancangan Jika bahasa Yang digunakan Bahasa Indonesia.
3. Klik edit html.
4. Beri tanda centang pada Expand Template Widget.

Cari kode html seperti di bawah ini.

/* Variable definitions ====================

Setelah itu, masukan kode html berikut ini tepat di atas kode html di atas.

#navbar-iframe {
display: none !important; }

Klik simpan template dan selesai.

Contohnya adalah seperti berikut :

Blogger Template Style
Name:     Simple
Designer: Josh Peterson
URL:      www.noaesthetic.com
----------------------------------------------- */

#navbar-iframe {
display: none !important;
}

/* Variable definitions
   ====================
   <Variable name="keycolor" description="Main Color" type="color" default="#66bbdd" value="#882222"/>

Catatan :

1. Sebelum melakukan proses editing kode HTML pada template, sebaiknya download terlebih dahulu template blog kita sebagai langkah antisipasi jika terjadi kegagalan proses editing.

2. Gunakan tombol Crtl + F pada keyboard untuk mempermudah pencarian kode HTML template yang kita inginkan.

Remove "Showing Posts With Label All Posts" On Blogspot

1. Login to blogger
2.Go to Template --> Backup your Template ---> Edit html

Find this code

Replace with this code :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Save template.

Cara Mudah Posting Kode html Di Blogspot

1. Login to Blogger dashboard
2. Go to Design Section
3. Then select Edit HTML tab
4. Dont forget to backup your template
4. Find ]]></b:skin> tag ( ctrl F ) keyboard
5. Replace it with Bellow Code of section

.codeview {
margin : 15px 15px 15px 35px;
padding : 10px;
clear : both;
font-size:normal;
list-style-type : none;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie9dHr4m26C0Hs4jg_Hg3Zf6OZ1ll4Trx63A7o2hKcvYRz8jqf5HLEqJaz_-gcxAMXtl6j3gghvwaLm-RI4xbUS5dws-P2nq_bBuzSgPIzmPGt0htJZrDZvqzzhEAxpXMwiVjJS3i_gNM/s1600/codeicon.gif") no-repeat scroll bottom right #EFFBF5;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}
]]></b:skin>

Simpan Template kamu.

Tambahan :
Untuk Posting kode html pada postingan blog berikutnya, sobat tinggal memasukan kode html yang mau diposting diantara kode dibawah ini : yang bertulis kode html kamu yang berwarna merah.

</div>

Semoga bermanfaat.

Cara Memperbaiki Kotak Komentar Blogspot Yang Kadang Tidak Tampil

1. Login ke blogger dengan akun blogger kamu.
2. Buka menu Setting / Pengaturan>> Komentar,
3. Ganti "Penempatan Formulir Komentar" ke "bawah Post Embedded"
4. Klik "Simpan Pengaturan.

Kemudian bagian dari html dalam template kamu yang harus di berubah :
• Buka menu "Edit HTML" dalam "Layout" menu
• Setelah itu Anda centang kotak bertanda "Expand Template Widget"
• Cari kode seperti dibawah ini :

Biar lebih mudah tekan ctrl + f kemudian cari kode di atas. Tapi Anda harus hati-hati, ada lebih dari satu kode<p class='comment-footer'> ,Cari kode <p class='comment-footer'>

• Ganti kode diatas dengan ini:

• Simpan template Anda.

Silahkan cek salah satu artikel di blog Anda. Jika ada kotak komentar, berarti Anda telah berhasil. Jika masih gagal saya masih punya satu lagi. Karena setiap template yang berbeda maka anda jangan khawatir, cara-cara lain yang ditulis di atas masih ada cara lain, seperti dibawah ini :

<b:include data='post' name='comments' />

Setelah kode di atas ditemukan, tambahkan kode berikut tepat di bawah kode di atas:

<b:include data='post' name='comment-form'/>

Contoh seperti ini:

<b:include data='post' name='comments' />
<b:include data='post' name='comment-form'/>

Kemudian Simpan Template

How To Make Rss Feed Link Button To Each Blogger Labels

Step 1. Back up Your Template before applying this hack.
Step 2. Your Blog must have Labels widget.

- Login to Blogger and Go To Layout > Edit Html
- Check Expand Widgets.
- Now search for below code :

<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<span dir='ltr'/>
</li>
</b:loop>

And replace the above codes with below one :

<b:loop values='data:labels' var='label'>
<li>
<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'><img alt='Subscribe' src='http://www.feedburner.com/fb/images/pub/feed-icon16x16.png' style='vertical-align:middle;border:0'/></a>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<span dir='ltr'/>
</li>
</b:loop>

Save template

See Your Blog Labels widget

Hide Newer Posts and Older Posts Blogger

Find this code in your template:

    #blog-pager-newer-link {
    float: left;
    }

    #blog-pager-older-link {
    float: right;
    }

    #blog-pager {
    text-align: center;
    }

And replace with this code:

    #blog-pager-newer-link {
    display: none;
    }

    #blog-pager-older-link {
    display: none;
    }

    #blog-pager {
    display: none;
    }

This simple trics and you can return original state..enjoy

Easy Make Readmore For Blogger

1. Login to Blogger Dashboard
2. Go to Design Section
3. Select Edit HTML tab
4. Check Expand Widgets ( i.e Tick Expand Widgets check box )
5. Find the closing </head> tag
6. Replace it with bellow Code

You can change this :

summary_noimg = 400;    :Summary length if no image
summary_img = 300;    :Summary length if it has image
img_thumb_height = 100;    :Thumbnail image height
img_thumb_width = 120;    :Thumbnail image width

Now find this <data:post.body/> tag in your template and replace it with below code.

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if>
</b:if>

# Finally Save your template and check your blog

Remove Subcribe Post To Atom Blogger

1. Go to dashboard/ template/ edit HTML
2. Click the 'Expand Widgets Templates' box
3. Find:

<b:if cond='data:blog.pageType != "item"'> 
    <b:if cond='data:feedLinks'>
    <div class='blog-feeds'>
    <b:include data='feedLinks' name='feedLinksBody'/>
    </div>
    </b:if>

Remove this line:

<b:include data='feedLinks' name='feedLinksBody'/>

That should remove Posts (Atom).

Input Schema Feed Blogger To Webmaster Google

Buat sahabat blogger yang masih baru punya blog terkadang lupa memaksimalkan kerja blog di mata mesin pencarian google. Buat pengguna blogspot seperti saya terkadang lupa membuat dan mensubmit feed blog atau sitemaps blog ke webmaster google, ketahuan klo postingan sudah banyak tapi cuma terindek sedikit atau beberapa halaman. Untuk postingan yang di bawah 500 postingan terkadang gak masalah tapi untuk postingan diatas 500 bahkan diatas 1000 postingan kita perlu memasukan sitemap blog ke webmaster google, agar search engine google dapat dengan mudah mengindex artikel pada blog kita.

Begini cara submit feed blog atau sitemaps blog ke Webmaster Google

Login di webmastergoogle dengan akun google kamu atau klik Disini

Ini contoh url dari feed blogger atau blogspot:
http://palingkomplet.blogspot.com/feeds/posts/default

Tambahan aturan sebagai url sitemapnya seperti yang berwarna biru :
http://palingkomplet.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc

Atau bisa juga jenis feed atom.xml-nya,
http://palingkomplet.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=500

http://palingkomplet.com/atom.xml?redirect=false&start-index=1&max-results=1000

Atau bisa juga dengan cara ini memasukankode feed yang berwarna merah dibawah ini :

1. Untuk Blog dengan jumlah postingan 1-500 Sitemaps feeds blog nya seperti ini :

atom.xml?redirect=false&start-index=1&max-results=500

2. Jika postingan berkisar antara 500 - 1000 sitemaps feed nya seperti ini :

atom.xml?redirect=false&start-index=1&max-results=500

atom.xml?redirect=false&start-index=501&max-results=500

3. Blog yang memiliki postingan 1000-1500 arahan feeds nya seperti ini:

atom.xml?redirect=false&start-index=1&max-results=500

atom.xml?redirect=false&start-index=501&max-results=500

atom.xml?redirect=false&start-index=1001&max-results=500

Semoga berguna.

RSS Feeds

RSS Feed adalah informasi sindikasi yang dikirim melalui teknologi feed dari situs web untuk pengguna Internet. Pengguna dapat berlangganan feed dari berbagai situs web, dan kemudian informasi baru dari situs-situs yang dikirim langsung kepada mereka melalui aplikasi pembaca RSS.

Hal ini mirip dengan menerima e-mail. Aplikasi pembaca RSS bertindak seperti "kotak masuk" untuk RSS feed. Daripada harus memeriksa beberapa situs Web untuk update, informasi baru terletak di satu tempat yang nyaman. Penggunaan RSS feed telah meningkat sebagai blogging telah menjadi lebih populer.