Blog Tutorial for Newbie
Blogger Tutorial | Wordpress Tutorial | Free Blogger Template | Free Wordpress Template
Showing posts with label Blogger. Show all posts

How to hide the blogger navbar

Actually remove the navbar blogger (Navigation Bar) is an act that violates the TOS Blogger. But if you still want to do that, i tell you how to do :)

Use CSS script below :

/* CSS to hid navigation bar */
#navbar {
height:10px;
visibility:hidden;
display:none;
}


In edit HTML page, put the CSS script above after <b:skin><![CDATA[/* code and save template. DONE :D

source : http://www.o-om.com/2008/03/cara-menghilangkan-navbar-blogger.html
Read On 0 comments

Making Recent Comments via Feed

Now we learn shows the recent Comments in the sidebar using RSS FEED. Thats very easy. The steps is :

Login to blogger dashboard Layout -> Page Element -> Add a Page Element -> Feed

1. Using default blogger Feed
http://blogname.blogspot.com/feeds/comments/default

2. Using Feedburner Feed
http://feeds.feedburner.com/NamaFeedComment

Do not forget to change the RED color with a name / name of the feed you post :)

source : http://www.o-om.com/2008/03/membuat-recent-comment-via-feed.html


Read On 0 comments

Making Recent Post via Feed

Now we learn shows the recent blog post in the sidebar using RSS FEED. How very easily. The steps is :

Login to blogger dashboard Layout -> Page Element -> Add a Page Element -> Feed

1. Using default blogger Feed
http://blogname.blogspot.com/feeds/post/default

2. Using Feedburner Feed
http://feeds.feedburner.com/FeedPostName

Do not forget to change the RED color with a name / name of the feed you post :)

source : http://www.o-om.com/2008/03/membuat-recent-post-via-feed.html


Read On 1 comments

Install icon smile (emoticon) in Blogger

Blogger user know ths smile icon is used in many wordpress user or other blog user, where there is any code text icon and then the smile will change the code with a visual icon smile. Unfortunately for the blogger does not support this icon smile. Do not lose heart. Many roads lead to Rome :D, all have the solution.

Try to see the example in this blog, there is every writing the text refers to the code would smile changed visually. For example, I have to use them smile icon :) and laugh :D and embarrassed when im shy :$ smile icon will appear on all the text in the blog at any location (NB: not in the shoutbox, links and images), the most profitable this icon smile emoticon can provide information in visitor commenting :o .

Follow the steps :

1. Login to your blogger dashboard, go to the menu template > edit HTML > Expand Widget Templates and find this code :
]]></b:skin>

2. Place the javascript code below, right under code ]]></b:skin>

<script src='http://louislim2.googlepages.com/addSmiley.js ' type='text/javascript'/>

3. Save and see the result :)

Standard code smile that can be used

:) or :-)
:D or :-D
:$ or :-$
:( or :-(
:p or :-p
;) or ;-)
:k or :-k
:@ or :-@
:# or :-#
:x or :-x
:o or :-o

Source : http://www.o-om.com/2007/11/pasang-icon-smile-emotion-di-blogger.html
Read On 4 comments

Large Letter in front of Sentence

Making a big letter in the initial sentence may be characteristics, such as an example see the beginning of the sentence marked with the letter "M" in this article. Looks different now! if you want your article looks like it you can try to make it.

1. Login to Dashboard ==> LayOut ==> Edit HTML
2. Find this code =
.post-body {
.....
}

3. place the code below, right below that code, is not among them
.post bt {
float:left;
font-size:100px;
line-height:80px;
padding-top:1px;
padding-right:5px;
}


How to Use :

be sure to give this code of letters that will be enlarged size like this = <bt>M</bt>

Happy Blogging :)

source : http://www.o-om.com/2008/04/huruf-besar-di-awal-kalimat.html
Read On 0 comments

Read More for Blogger

Often we find that blogs have read more facilities, namely to hide some post do not appear all in the frontpage. At the bloggers, read more facilities are not available, so you need to add your own. Here's the step :

1. Login to Dashboard and click menu Layout ==> Edit HTML

2. Mark
Expand Widget Template

3. Find this code : <p><data:post.body/></p>

4. and replace with this code :

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

<p><data:post.body/></p>

<a expr:href='data:post.url'>Read More...</a>
</b:if>

You can change words in the RED color to word what you like

5. Save template

6. Go to menu Settings --> Formatting

7. Copy code below to the Post Template form

<span class="fullpost">

</span>

and Save Settings

8. Done

How to Use :

put the first paragraf / intro here

<span class="fullpost">

put the rest of the post here

</span>

Read On 0 comments

How to make Random Image Header

Random image header in the bloggers we can actually change automatically every time the page on the Refresh or Reload. Objectives of the tutorial is still time to make it appear more stylish colors and have a distinctive color. In addition to creating a blog is more useful life also remove the tedium of visitors when visiting our blog, that blog does not monoton we need to add this header Random image.

Want to know how to make it?

Login to Dashboard -> open Template -> Edit HTML

Find this code = <b:skin><![CDATA[

Then copy the code below, paste the code under the code above, and then store and see the results.

</script>
<script type='text/javascript'>
var gambar= new Array()
gambar[0]="http://url-picture1"
gambar[1]="http://
url-picture2"
var acak=Math.floor( 2 *Math.acak());
document.write("<style>");
document.write("#header {");
document.write(' background:url("' + gambar[acak] + '") no-repeat top left ;');
document.write(" }");
document.write("</style>");
</script>


Red = point where the URL address where you saved the image
Green = number of image, start from zero (0)
Blue
= number of random images

source : http://www.o-om.com/2007/12/cara-buat-random-image-header-pada.html
Read On 0 comments

How to install a Random Post

For the new bloggers who want to make more visitors more in our blog, install Random Post for more options which are presented.

First :

login to Dashboard -> open Template -> Edit HTML -> dont forget to backup the template first :)

Then copy the code below and paste right over the tag </head>


<script type="text/javascript">
//<![CDATA[
var _yourBlogUrl = "http://editing-blog.blogspot.com";

function randomPost() {
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=getTotalPostsCallback&start-index=1&max-results=1";
script.setAttribute("src", theUrl);
document.documentElement.firstChild.appendChild(script);
};
function getTotalPostsCallback(json) {
var totalResults = json.feed.openSearch$totalResults.$t;
if (totalResults > 0) {
getRandomPostNumber(totalResults);
}
};
function getRandomPostNumber(totalResults) {
var randomNumber = Math.floor((Math.random() * totalResults) + 1);
getRandomUrl(randomNumber);
};
function getRandomUrl(randomNumber) {
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=getTheUrlCallback&start-index=" + randomNumber + "&max-results=1";
script.setAttribute("src", theUrl);
document.documentElement.firstChild.appendChild(script);
};
function getTheUrlCallback(json) {
var theUrl = json.feed.entry[0].link[0].href;
window.location.href = theUrl;
}
//]]>
</script>


Do not forget to change the color red with your blog URL, then do not forget saved.

Second :

Then add a page Element -> HTML / Javascript

<a href="javascript:randomPost();">View Random Post</a>

Do not forget to save and see the results :)

source : http://www.o-om.com/2007/12/cara-pasang-random-post-menampilkan.html
Read On 0 comments

Recent Comment via Feed

I have previously described how to create Recent Comment with Javascript in HERE. So, now I will explain how to create Recent Comment via Feed. You may be confused to choose. Of course both have advantages and disadvantages. Recent Comment clear via JavaScript have advantages in the view while Recent Comment Feed with the view is more simple but the problem with the loading of the feed will be faster.

First login to Dashboard. Click Layout -> Page Element -> Add a Page Element -> Feed then in the Add Url input yout Feed address. Thers a 2 option feed can be use :

1. Use Blogger Feed

http://blogname.blogspot.com/feeds/comments/default

2. Feed with FeedBurner

http://feeds.feedburner.com/FeedCommentName

Dont forget to change the RED text with your blog name / comment feed name :)

source : http://www.o-om.com/2008/03/membuat-recent-comment-via-feed.html

Read On 0 comments

Recent Post via Feed

I have previously described how to create Recent Post with Javascript in HERE. So, now I will explain how to create Recent Post Via Feed. You may be confused to choose. Of course both have advantages and disadvantages. Recent clear that post via JavaScript have advantages in the view while Recent Post Feed with the view is more simple but the problem with the loading of the feed will be faster.

How to use it ?

First login to Dashboard. Click Layout -> Page Element -> Add a Page Element -> Feed then in the Add Url input yout Feed address. Thers a 2 option feed can be use :

1. Use Blogger Default Feed

http://blogname.blogspot.com/feeds/post/default

2. Feed with FeedBurner

http://feeds.feedburner.com/FeedPostName

Dont forget to change the RED text with your blog name / feed name :)

source : http://www.o-om.com/2008/03/membuat-recent-post-via-feed.html
Read On 0 comments

Auto Hide Navbar Blogger

Eliminate Blogger NavBar (Navigation Bar) is one of the bloggers TOS violations, the solution is we can use the Auto hide navbar Blogger. How the Auto hide, when the visitors lead the mouse to the top of the original navbar will also appear as if the visitors lead the mouse to the bottom (not in the area navbar), then automatically navbar will be rid of.

How to Install :

In the EDIT HTML pages (on dashboard blogger) search the body { code and then place this code to the above body { code

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

Source : http://www.o-om.com/2008/03/auto-hide-pada-navbar-blogger.html
Read On 0 comments

Recent Comment on Blogger

Recent Comment is a short Comments from visitors are shown sequentially. To make Recent Comment we can use the source code below. How to Install it ?? just copy and paste the code on the page element blogger.

In the color RED : Change the address of your blog

<script style="text/javascript" src="http://www.geocities.com/oom_directory/recentcomments.txt"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 100;var standardstyling = true;</script><script src="http://editing-blog.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

When the lazy practice code above you can install directly to your blog, just click button below :

source : http://www.o-om.com/2008/03/recent-comment-di-blogger.html
Read On 0 comments

Recent Post in Blogger

Recent Post is the short title of the latest postings that are displayed sequentially to facilitate visitors to see the order of the posts have been created. To create a recent post, we can use the source code below.

How to Install it ?? just copy and paste the code on the page element blogger.

In the color RED : Change the address of your blog

<script style="text/javascript" src="http://www.geocities.com/oom_directory/recentpost.txt"></script><script style="text/javascript">var numposts = 5;var showpostdate = true;var showpostsummary = true;var numchars = 100;var standardstyling = true;</script><script src="http://editing-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>

When the lazy practice code above you can install directly to your blog, just click button below :

Source : http://www.o-om.com/2008/03/recent-post-di-blogger.html
Read On 0 comments

How to create a Favicon

Favicon icon is located in the address bar or tab bar in the Web browser, how to create a favicon is easy to make you want to follow these steps:
  1. Create an image size 32x32 with formats gif, jpg, png, and bmp (select one)
  2. Then open http://tools.dynamicdrive.com/favicon/
  3. In the browse button select the image that was created
  4. then click "create icon"
  5. click on the "download favicon" save picture
  6. save the icon in the address online storage can be in www.geocities.com or pages.google.com
  7. the last step open the entrance to the bloggers and edit the HTML

  8. search code <head> and paste the code below under the <head> code :

    <link rel="shortcut icon" href="/favicon.ico">

    Note: Replace the red color with the name of the url address of the place saved icon

    Example :
    <link href='http://www.geocities.com/oom_directory/favicon.ico' rel='shortcut icon'/>

  9. Save, and then see the results.
Source : http://www.o-om.com/2007/10/cara-buat-favicon.html
Read On 0 comments

How to install bookmark button in each Post

In this issue we use the services addthis.com widget to bookmark it. The steps include bookmarks code is :
  1. Browse http://www.addthis.com/ and registration first (if you not registered)
  2. Choose "Get the code for your widget!"
  3. Setting options :
  4. Which kind of widget? : --> Bookmarking Widget
    Which widget? : --> (Select the appropriate button taste)
    Where? Where do you want to put the widget? : --> On a Blog
    Blogging Platform : --> Blogger
  5. Choose "Get Your Free Button"
  6. Choose "Blog Button (New or Older Blogger)"
Then how to install the bookmark code on a blog is :
  1. Login to http://blogger.com and click the Template menu -> Edit Html -> Templates ExPand Widget
  2. Find the code below : (Before you edit the code should do the Template Backup first)
  3. <b:if cond='data:post.showBacklinks'> <a class='comment-link' expr:href='data:post.url + "#links"'><data:top.backlinkLabel/></a> </b:if> </b:if></span></p>

    or can also under this code :

    <!-- quickedit pencil --> <b:include data='post' name='postQuickEdit'/> </span></p>

  4. Then copy-paste the code below the bookmarks code above. (Do not forget to save.) Okay :D

Note :
Some of the template is slightly different, so should not be placed on the code that I mentioned above. You can try to paste the code that I mention the location, please try in several different locations, find the location if appropriate.

Source : http://www.o-om.com/2007/10/cara-memasang-bookmark-pada-setiap.html

Happy Blogging :)
Read On 0 comments

Privacy Policy

editing-blog.blogspot.com (editing-blog) Privacy Statement

Please read this statement regarding our blogs. If you have questions please ask us via email at zabazabazu [at] gmail [dot] com.

Email Addresses
You may choose to add your email address to our contact list via the subscribe forms on our websites. We agree that we will never share your email with any third party and that we will remove your email at your request or you cant unsubscribe. We don’t currently send advertising via email, but in the future our email may contain advertisements and we may send dedicated email messages from our advertisers without revealing your email addresses to them. If you have any problem removing your email address please contact us via our contact form.

Ownership of Information
editing-blog.blogspot.com is the sole owner of any information collected on our websites.

Cookies
Currently we assign cookies to our readers in order to save their preferences. This data is not shared with any third party. Accessing our websites is not dependent on accepting cookies and all major browsers allow you to disable cookies if you wish.

Third Party Cookies
Many of our advertisers use cookies in order to determine the number of times you have seen an advertisement. This is done to limit the number times you are shown the same advertisement. editing-blog.blogspot.com does not have access to this data.

Traffic Reports
Our industry-standard traffic reporting records IP addresses, Internet service provider information, referrer strings, browser types and the date and time pages are loaded. We use this information in the aggregate only to provide traffic statistics to advertisers and to figure out which features and editorials are most popular.

Legal proceedings
We will make every effort to preserve user privacy but editing-blog.blogspot.com may need to disclose information when required by law.

Links
editing-blog.blogspot.com weblog frequently link to other websites or blogs. We are not responsible for the content or business practices of these websites. When you leave our websites we encourage you to read the destination site’s privacy policy. This privacy statement applies solely to information collected by editing-blog.blogspot.com.

Notification of Changes
When editing-blog.blogspot.com makes changes to this privacy policy we will post those changes here.

Contact Information
If you have any questions regarding our privacy policy, please contact us via email at zabazabazu [at] gmail [dot] com.
Read On 0 comments
CO.CC:Free Domain Free Web Hosting with Website Builder
Earn money from your website/blog by, selling text links, banner ads - Advertisers can, buy links, from your blog for SEO. Get paid through PayPal PJN July Promo

Your Foot Print


ShoutMix chat widget

Recent Posts

Labels

Contributors