Test Blinking Text

buy harry potter books
Is the text blinking in Internet Explorer, Firefox, Opera, Flock, Safari for Windows, Netscape and Avant web browsers?

UPDATE: Text was blinking in all web browsers tested.

Labels below post title above post content: Test

Got a funny request from a blogger who is using an old classic Blogger template to move the labels to above the post content just below the post title. Although since I migrated practically all my blogs over to the New Blogger templates, I have hardly looked at an old classic Blogger template and not exactly what may have changed since Blogger forced all bloggers to migrate over to New Blogger (formerly Blogger Beta) though one still have the choice of keeping or using the old classic Blogger template.

However, after the change, there are some features added to blogs using old classic templates including the ability to add Labels (more commonly known as categories). The difference is that you will not have the New Blogger easy drag and drop LAYOUT and you will not be able to add a Link List in the sidebar. There is a work around at Label List for old classic Blogger templates. However, I would not know if I will be able to find the code to display the labels at the bottom of blogs using old classic Blogger templates or not. I tried looking in Furniture Center which uses Final Sense old classic Blogger template they called "109 business blog 1". I tried looking but failed. Maybe when I have time, I will try a standard old classic Blogger template and see if I can edit the template to put the labels below the post Header.

I tried that with a blog Blogger Help Pages which uses Hackoshere 3 column New Blogger Minima template and found that I could do it. You can get instruction on how to do it at Labels below post title.

Testing Another way of hiding the navbar

Update: Refer to Simple adjustable way to hide Blogger Navbar for the latest.

I have previously published a post Hiding the navbar. As had been mentioned in the post, the navbar can be useful in that it enables a visitor to search the content of the blog, it enables you to easily get to the LAYOUT by clicking on "customize", and to make a new post by clicking on "New Post" when you are signed into Blogger. However, many educators who uses Blogger for their blogs for the students will like to see the navbar gone because of the presence of "Next Blog". One never knowns what kind of blog you will get to when you click that tab. The chances of getting to a blog containing sexually explicit content is not negligible. Blogger has made it mandatory for blogspot blogs to have the navbar, but many blogspot blogs have hidden the navbar and so far no action has been taken. So I think it is justified and OK for educators to hide the navbar.

I do remember reading something about the navbar being compulsory using Blogger to host their blogs, but not compulsory for those who host the blog on their own (web host). However, accoring to Kawaljit of Maybe it is OK to remove Blogger navbar, Google did a series of road show in some Indian cities to promote their Blogger platform. Ankit attended the event and asked for clarification on the navbar policy from the Google representatives at the roadshow. They called up their office in Bangalore office and confirmed that it's legal to hide the navbar.

I have tested the method described in the post linked above before I published, but a blogger complained it no longer worked. I tested it and found it to be true. Fortunately Rat has posted a similar but different way of hiding the blog at Hide navbar where it advocate putting the code

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

just before the closing style tag ]]</b:skin>

So what you need to do is to sign into Dashboard, clcik LAYOUT for the relevant blog, click the template tab and look for the clossing style tag

]]></b:skin>

If you have problem finding ]]></b:skin>, press ctrl+F and you shoud see . Type or copy-paste part or all of ]]></b:skin> into the "Find" box and click find. That part of the code in the template editor window will then be found and highlighted

Paste

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

just above that so that it become

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
]]>≶/b:skin>

Preview, and if satisfied, click "Save template"

I have tested it at this blog Blogging Ideas and have found it to work.

Important note: Before you make any changes to your template, always backup you template. Refer to Backing and changing template. It will also help to edit each Page Element one one one and save the content into a Notepad file so that you can put it back if you need to revert to your backup template (with the New Blogger, many Page Elements (widgets) will be deleted when you change template). However, if you use the Link List to make you "blogroll" you will not be able to save that Page Element this way. It will only be possible if you use the HTML/Javascript Page Elemtent to create the "blogroll". Also, if you want a template that don't have the navbar without you having to tinker with the template, use templates from New Blogger templates by Final Sense

phydeaux3 Label Cloud Hack

phydeaux3 has described a hack for converting the New Blogger standard Label List to a label cloud at Code for New Blogger Tag Cloud/Label Cloud. I have decided to test it and see if it works. I tried the hack for this blog Gizmos and Gadgets, and the test was successful. The only problem was that blog used Ramani's of Hackosphere New Blogger fixed width Neo template, and the color for the minimum number of labels was black, and it was hardly visible. I had to experiment with changing the colors until the label colors was nice and visible. I had to change what phydeaux3 set for the colors to

<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [255,255,255];
var minFontSize = 10;
var minColor = [191,240,255];
var lcShowCount = false;
</script>

to make the labels easily visible. You can see the Label Cloud at the bottom of the left sidebar of the blog Gizmos and Gadgets.

For the alteration, I used ColorPic to help me determine the RGB values to input into the maxColor and minColor.

Testing adding Digg vote button to every post

A blog reader commented in my post Another way of adding graphic to your blog Header indicating problem with implementing adding a Digg button to every posts as described in this site: Add Digg vote button on Blogger and asking for help. So I decided to test it out in one of my blogs Generating Revenue from your Website and did it successfully. Check it out for yourself.

The way to do this easily is to sign into your Dashboard, then for the selected blog, click LAYOUT, then click the EDIT HTML sub-tab. This will open the template editor window. Check the [ ] Expand template widget. When the template have been fully expanded, click your mouse inside the template editor window, press ctrl+A to highlight the whole template, right-click and select "copy" to copy the whole template into clipboard. Open Notepad, make sure the word wrap is off (in the Menu Bar, click "Format" then make sure the Word Wrap is turned off), paste the template into the empty Notepad. You need to find the tag

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

in the template
.
Again, click inside the Notepad and press ctrl+A to highlight all the codes, slide the verical scroll bar back to the top, in the Menu Bar, click EDIT then FIND and paste the above tag into the FIND field. Click FIND NEXT and that tag should then be highlighted in Notepad.

Replace the above tag with this codes (to facilitate this, you may want to intoduce some empty lines to separate the tag from the rest of the template).

<p>
<!-- DIGG -->
<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url = '<data:post.url/>';
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</div>
<data:post.body/>
</p>

Go back to the template editor (the whole template should still be highlighted if you have not done anything other than copying it into clipboard). Click the DELETE button. You should have an empty template editor window. Paste the content of the clipboard into the template editor window.

Preview, and if you see the Digg button in the Preview, save the template.

As always, before you make any changes to your template, always backup your template first.

This test is so successful, and having that Digg vote button in every posts of your blog is so useful, I will likely implement it into all my main blogs.

Update same day: The hack is so easy to implement I have impemented it for my major blogs. However, I am having second thoughts about it as anyone clicking on the Digg vote button gets taken away from the site (to Digg site). It doesn't open in a new window. I am going to experiment to see if I can get it to open in new window. Further update: 2 attempts succeed in displaying the Digg vote button, but clicking on it still lead to Digg site in the same window.

Testing Hackosphere peekaboo expandable post summary

There is an easy to implement expandable post summary at Expandable Post Summary for New Blogger. The advantage of this is, it is easy to implement. The disadvantage - there will be a "Read More" link at the bottom of a short post even if you have no further content beyound what is in the post summary. I partly overcome this by putting an END OF POST at the end of a short post.

If you are still not satisfied with this, you can try to implement Hackoshpere's expandable post summary with peekaboo view. It is a bit harder to implement, but it has been done for this blog: Anything Chinese. You will see the "Read More" link at the bottom of the long posts in the main page, but I purposely wrote a short post Why the emphasis on things Chinese?. If you visit the homepage now, you will see that the other posts have "Read More" links at the bottom of the post but not for Why the emphasis on things Chinese?. "Read More" links will only be seen in long posts in the homepage, but not in individual post pages.

As more articles are published in this blog Anything Chinese, the short post without "Read More" link will disappear from the homepage, and what I am trying to show will disappear, so to make a permanent record of the homepage as it is now, I will post screenshots of the homepage below, with the "Read More" links circled in red to show it more clearly. You will see in the screenshots there is no "Read More" (remarks in green) link in the short post with the title "Why the emphasis on things Chinese" (click on screenshots to enlarge).

Toggle Show/Hide navbar Hack

Derya commented in one of my posts, alerting me to a hack that will enable you to put a script in a Page Element which will display a text which when clicked upon will hide the navbar if it is displayed, and display the navbar if it is hacked. As I don't want to execute the hack in this blog, I tested it in the blog Computer and Internet Articles. The toggle switch (which is the text you see above) is placed at the bottom of the right sidebar, below my profile. Click on it and observe what happens to the navbar.

You can get Derya's hack here How to hide the navbar? if you are interested in the hack. It is very easy to implement. All you have to do is to get to the template editor, look for the <head> tag, then paste the script he has given. When I implemented the hack, I only made some small modification to the hack. I put a comment (part of a program that does nothing but document a program to make it easy to follow and understand). I put the comment
<!-- Show/Hide navbar begins --> followed by the script, then at the end of the script, I marked it with the comment
<!-- Show/Hide navbar ends -->

For easier understanding, I put the script below:

<head>

<!-- Show/Hide navbar begins -->
<script type="text/javascript">
var showHeader=false;
function ShowHideNav()
{
showHeader=!showHeader;
var nav=document.getElementById("navbar-iframe");
if (showHeader)
{
nav.style.visibility="visible";
nav.style.display="block";
}
else
{
nav.style.visibility="hidden";
nav.style.display="none";
}
}
</script>
<style type="text/css">
#navbar-iframe {
visibility: hidden;
display: none;
}
</style>
<!-- Show/Hide navbar ends -->

The part in black (<head>) is what is already in the template, and the part in red are what is added to the template.

You will then have to add this to a page element in a part of the blog that you choose:

<!-- Show/Hide navbar hack -->
<span style="cursor:pointer;" onclick="ShowHideNav();">
Show/Hide Navigation
</span>

New Blogger (formerly beta): How to hide the navbar

A reader of my blogs asked how to hide the navbar.
I tried this hack from Remove navbar. It says to look for <style type="text/css"> and </style"> and add in some codes in between them. I could't find the tag <style type="text/css">, so what I did was I added the whole code:

<style type="text/css">

#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}

</style>
<!-- End Hide Navbar -->


just after the <head> tag into this blog Digital Photography Articles and the navbar was successfully removed.

Actually, the navbar serve a useful function. It has a searchbar which allows one to search the blog, and it is not intrusive, just a narrow bar at the top of page. Anyway, if you really want to remove the navbar, but still want a searchbar to allow visitors to search your blog, you can sign up for AdSense and when you are approved, you can generate a sitesearch box for your blog like this blog Good Health Information.

You can apply to join the AdSense Program by clicking on the "Generate revenue from your site. Google AdSense" link at the top of the right sidebar. You can get more information about AdSense (how to generate a script for a sitesearch bar, for example) from this site Earning Online. If you have further questions, feel free to leave a comment, and I will try my best to answer.

Making links in a Blogger Beta link list open in new window

Note: Please see updates at bottom of post

Note: As always, whenever you make changes to the template, backup the current template PLUS the Page Elements first. Refer to Backup and edit New Blogger template or Backing up and changing New Blogger template. Remember also to edit your Page Elements one by one and save them into preferably the same folder as the one where you save the backup template. Some Page Elements may be deleted or become empty Page Elements if you reload the backup template.

In Blogger Beta, if you add a Link List, the links created open in the same folder by default.

Here is how you can make links open in new windows/tabs. Sign into Dashboard, for the relevant blog, click LAYOUT, then EDIT TEMPLATE. Check EXPAND WIDGET TEMPLATES. You will need to look for a block of code. I find the easiest way to find line of code in long template is to use the "Find" function in Notepad. (Note: See update 28 July 2007 at the bottom of the post)

After the template has been expanded, click inside the template window and press ctrl+A to highlight the whole template and then click ctrl+A to copy it into the clipboard (or click inside the template editor window, right-click and chose "copy"). Open a Notepad file, paste the expanded template into the Notepad.

Look for this block of codes:

<ul> <div id='link'> <b:loop values='data:links' var='link'> <li><a expr:href='data:link.target' ><data:link.name/></a></li> </b:loop> </div> </ul>

Look particularly for this code:
<li><a expr:href='data:link.target' ><data:link.name/>

If you have done as suggested, that is, paste the expanded template into Notepad, searching for that line of code will be much easier. Click EDIT in the menu bar at the top of Notepad and chose "Select all" to highlight the whole template. Click EDIT > FIND in the menu bar again and enter part or all of the code you want to look for into the "Find what" box. Notepad will find that and highlight it.

Replace it with
<li><a expr:href='data:link.target' target="new" ><data:link.name/> (in other words, add target="new" after expr:href='data:link.target'. Make sure there is a space between expr:href='data:link.target' and target="new" (see update below).

Click inside the edited template in Notepad, press ctrl+A to highlight the whole edited template, then press ctrl+C to copy into clipboard (or right-click inside the Notepad and chose "copy"). Go back to the template editor window. The original template should still be highlighted. Click the DELETE key. The template editor window should now be empty. Click inside the template editor window and press ctrl+V to paste what you have copied into clipboard (or right-click and select "paste").

Preview to ensure everything is OK. Save template and check that the links actually open in a new window. This has been done for this blog. Try clicking on the links in the link lists (Blogger Resources) and confirm that they actually open in a new window/tab.

Acknowledgement: This is a blog for testing. This post was in response to a reader who asked how to make Link List in New Blogger open in new window and if I remember correctly, was probably used to test the method given by Linklists don't open in a new window and new hacks and this post is probably adapted from his hack and made simpler for people to implement the hack.

UPDATE: 2 person commented of problems executing this hack. Read the comments. I retested it for this blog Good Health Information and confirmed the hack work. Check for yourself. The link list is titled "Blogger Resources" and is the second last in the right sidebar. Click on the links and confirm for yourself that they open in new windows/tabs. Just a note. Make sure that there is a space between
expr:href='data:link.target'
and
target="new".

Update 28 July 2007: Instead of using Notepad to help you locate some section of the template, you cab also press ctrk+F to get the section you find direct in the template editor window:

Update 10 August 2007: Many webmaster are of the opinion that making links open in new window/tab is a bad practice and may drive visitors away and it should be left to visitors whether they want link to open in the same or new window/tab. I have made previous survey and have found the majority of those who responded prefer links to open in new windows/tabs, which is also my preference as I find closing new windows/tabs easy to do. Further, not everyone is Internet savvy and most will not know how to make link open in new winddow/tab for a link configured to open in the same window. However, I like to keep my visitors and have no wish to discourage any from visiting again. I have this set up a Poll at the bottom of the left sidebar of Blogger Tips and Tricks. However, Polls are not working now. Blogger is aware of the problem and is trying to solve it. Hope they get it working soon. You may be interested in keeping track of that poll.

Label cloud for Blogger Beta

phydeaux3 has done a hack for label clouds for Blogger Beta. If you want to do it for your Beta blog, surf over to Code for Beta Blogger Label Cloud (close new window to get back to this page).

Update 28 February 2008: A reader commented that the link to phydeaux3 wasn't working. I tested that and it was OK. I also tested phydeaux3 hack for the label cloud and you can see the lable cloud in the right sidebar of this blog Computer and Internet Articles. If you have any further problems, leave a comment.

Also, Phydeaux3 has an update to fix the maximum of entries. If you are interested, have a look a Blogger Beta Label Cloud Update