Cari Artikel

Monday, May 2, 2011

Tutorial in creating blog in Blogspot

1. What is Blog?

Blog is short for "Web log", which is a a web application containing note or writing that are usually called "post" and displaying on the web pages. The posts are often displayed orderly based on the age or based on the time when the writing is written and published, so when you view a blog, you will first find the latest posts, top to bottom of the web page and the first to the last page, if the blog has had more than one web page.

For the first time, blog was created as the online private notes, but along with its development and popularity, blog has various types of contents or writings such as tutorial (e.g. this blog), sharing, business, etc. In general, blogs seem not to have the difference with the sites on the Internet. 

The blog platform or used to be called blog machine has been created in such a way by blog designers or developers in order to be user friendly, so the knowledge of HTML, PHP, CSS, etc that was a must to create a web application, now with blog, everything is so easy as 1, 2, 3.

2. How to create blog in blogspot

One of the free blog providers that is quite popular today is blogspot or blogger, where you have to register through and you get the domain name as sub domain of blogspot, e.g.
Why should you create blog in, not in other free blog providers? Actually, there is no “should”, but has more advantages than other providers do. One of the advantages is the easiness in operating so that is good for the beginners. Other advantages are the freedom in editing and replacing the templates to make the best display, custom domain which means that you can replace the domain with your own but with the blogspot hosting, e.g. can be changed into, but still in the same hosting, i.e. the free blogspot hosting. 

It should be emphasized from the beginning that the Internet is highly dynamic, so it is very possible that this practical guide to create blog in blogspot will not be relevant anymore as changes occurring, whether to the platform, coding, or anything else that you see right now in
To reduce something unneeded to write, below is how to create blog in 

Creating Email

One of the conditions required in creating blog is to have an active email address. If you do not have an email, please register at gmail. Since Blogger is one of Google services, when you want to register at Blogger, you had better use Google Email or gmail. If you need a simple guide to create an email, please use Google search engine to search for the best guide. 

Sign up for a blog at blogger  

  1. Please visit
  2. After registration page open, go to the right bottom of the page where you can change the language to your own to make you easier to understand the instructions, but in this tutorial, I use English for more global targeting. Please login by using your username and password of your gmail (your email account is allowed to use for login to blogger). 

  1. Click "CREATE A BLOG" button
  2. Enter your Blog Title in the field next to "Blog Title", and your expected blog address in the field next to “Blog address (URL). Need to remember that when you enter your expected blog address, you have to be sure of it as you cannot replace it in the future, except you use Custom Domain facility. Check for the availability. If your expected blog address is not available, replace with your new one and so on until you get it. Then type the character you see next to "Word verification", below blog address point and click CONTINUE for the next steps.

  1. Choose a starter template, meaning that you can replace this template in the future and then click CONTINUE

  1. You will see "Your Blog has been created!" meaning that now you have a blog and you are ready to start Blogging, by clicking "START BLOGGING". 

  1. You will soon be in the post editor, where you can write anything as you may have thought about before. (it is recommended to directly write for your first post to avoid "Blogger Anti-Spam Robot" that can result in your blog locked. For instance, you can write a very short entry if you have not prepared an entry: "Hello World!", and anything else you want. Click "PREVIEW" button to view how your post will be displayed, then click "PUBLISH POST" if you want your entry to be published.
  2. Click "View Post" to see your blog. Below is the example of the blog display created
  3. Done
For the first phase, your blog is ready and accessible for public. For next discussions about blogging in blogger are to come.

You Might As Well Jump!

It's time to announce another Blogger Birthday feature! Many users have been asking for an easy way to implement "Read more" links on their blog's index page. In fact, for years bloggers have been implementing "Read more" jump breaks themselves by manually editing their HTML --- a process that was complicated and error prone.

Today we are excited to announce our latest birthday present: Jump Breaks.

With Jump Breaks you can show just a snippet of your post on your blog's index page. Blogger will insert a "Read more" link to the full post page where your readers can keep reading.

There are a couple of ways to insert a "Read more" jump to your posts. If you use the new post editor (available on Blogger in Draft, or by enabling it via the Settings tab), you'll notice the "Insert jump break" icon in the editor's toolbar. Click this icon and the "jump break" will be inserted into your blog post at your cursor's position.

If you don't use the new post editor, you can still insert a jump break in Edit HTML mode by adding <!-- more --> where you want to position the jump break.
Want to change the "Read more" text to something more your style? No problem. You can edit the "Read more" text by clicking Layout and then Edit the Blog Posts widget.

One more note, the Jump Break feature does not change how your post appears in your feed. You can configure post feed options by going to Settings | Basic | Site Feed, and editing Allow Blog Feeds.

: Users that have customized their Blog Posts widget or otherwise have highly customized templates: You may need to edit your HTML to enable Jump Breaks. First, back up your template, then follow the instructions at the bottom of this help article.

This is one of many features announced as part of Blogger's 10th birthday. Happy Birthday!

How to Add Post Titles to Read More Links in Blogger

Blogger's Jump-Link (Read More) feature enables us to display summaries of our blog posts on the home page (and all non-item pages).

We can configure the text displayed for the Jump Link (which links to the post's item page) by editing the Blog Posts gadget in Design>Page Elements. However, I've also found it useful to add the title of the post beside the Jump-Link text to clarify the title of the post to which it links.

If you're reading this post on the iskandarX Society home page, you'll see an example of this in action a few lines below.

This is a very easy customization and the modified Jump-Link will inherit any current style you've applied to this section. Here's how to add this featre in a single, simple step.

Go to Design>Edit HTML in your Blogger dashboard and check the Expand widget templates box. Using your browser's search function (usually CTRL or CMD + F), locate the following section of code:

    <b:if cond='data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>

Replace this with the following:

    <b:if cond='data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/> <data:post.title /></a>

Preview the change you've just made - if all is well, you should now see the title of your post displayed beside the text you've chosen for your Jump-Link. You can then proceed to Save your template and enjoy this quick and easy tweak to your Blogger template.

I hope you find this post useful for customizing your own Blogger-based sites. Please feel free to leave your comments and opinions below.
Related Posts Plugin for WordPress, Blogger...