Archive for the ‘HTML Tips’ Category

How To Add Icon (Favicon) for You Blog

If you noticed at your tab browser and there is a small icon at left-side of the browser, that’s called favicon. Just like this screenshot that snap my own blog. Maybe my icon is bad, but that is it.

If you using blogspot, your icon must be Blogspot icon because you are about using they hosting service. But you can customize that icon into your preferred icon. Just follow this instruction :

  • Login to your blogger
  • Enter “layout” menu, choose “edit HTML” menu.
  • Don’t forget to check “expand widget template” box
  • Search </head> code, simply by pressing CTRL and F and paste it.
  • If you found it, paste the codes below right after </head>

<link href=’http://youricon.jpg‘ rel=’shortcut icon’/>

  • Replace “youricon” with your image URL you already uploaded. Your image caan be in PNG of GIF format.
  • Have you done? Then, save your work and mission compelete.

Now your favicon has been added. Hope you will like your new favicon. Seeya.

Tips to Edit Blog HTML

If you have intention to edit your blog HTML, sometimes you must be encountered some problems, moreover if you are still beginner. No matter is that about difficulties to find certain code, unable to save your HTML, etc. This time, I want to teach you how to handle, at least to reduce your problems which you encountered.

There are some tips to edit your blogger HTML :

1. Backup your template
To backup your template is VERY important because if something undesired happens when you edit HTML, for example if you blog template broken, you can still revert it back. To backup your template is simple. In edit HTML menu, click “Download Full template”, then save the file. You can upload it at anytime you need.

2. Check in “Expand Widget Template” box
Sometimes it forgotten by you. If that box unchecked, probably you will not find the code you looking for. However this step isn’t necessary to do, depend on the tutorial. So, read the instruction carefully.

3. Tips to ease your search
To ease for code searching, copy the code you want to search, then press “Ctrl+F”, paste the code there. This is easier if you use Firefox as your browser.

4. When you face an error message
When you attempt to save your edited HTML then you get an error message, for example :
We were unable to save your template.
Please correct the error below and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure….bla bla bla….
Then you must understand that message, what’s wrong with it. Or check back the instruction and start from where you face error. Click “clear edit”.

Maybe that’s all. I’ll be right back with another blogging tips for you. Seeya.

Making “Snowfall” Effect to Your Blog

When the winter is coming, you will see the snowfall from your window. It’s beautiful, like the song “Nevicata” by Akiko shikata, I think. Now have you ever imagine if you see the snowfall on your blog? Really, you can make it by add some HTML code. It’s so simple. This is the tutorial :

  • Login to your blog first,
  • Go to Layout, click add gadget,
  • Chose HTML/javascript, paste code below :

<script src=”http://pamungkaz.googlepages.com/snow.js”
type=”text/javascript”>
/***********************************************
* Snow Effect without images-by Kurt Grigg at
http://www.btinternet.com/~kurt.grigg/javascript
* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/
* Please keep this notice intact
***********************************************/

</script>

Save this. Now let’s see your home blog from outside. You will see the snowfall. Yeaaaah…..the winter is coming :)

Shorten Your Post by “Read More”

Sometimes, your blog visitors fells that your blog post is TOO long when they open your blog homepage. You need to make it shorter without erasing your half part of post. There is no need to do that because I will teach you how to shorten it. Well, if you enter my blog at homepage, you’ll see “Read More” link below my post. This is used to hide my post in half in order to make it shorter. In fact, this make my blog appearance more simple.

Do you want to know how to make it? If you using blogger, then follow the tutorial below :

  • Login to your blog, enter to “layout” menu and choose “edit HTML
  • Before that, check “expand widget template
  • Search <data:post.body/> in your HTML (to quick-search it, simply press CTRL and F.
  • If you found it, 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>

  • Finished, and save your works.

Next, click “setting“, go to “format“, enter this code to template posting.

<span class=”fullpost”>
</span>

It will become default code in your post editor by clicking edit HTML. It will appear.
To make your post shorter, for every post you must insert this code in your post. Put <span class=”fullpost”> in the MIDDLE of post and </span> at the END of post when you post an article. Save and let’s see how can you make it. Good luck.

Incoming search terms for the article: