Using Blogger To Add Content

frameworker

Jun 19 2008, 11:18 PM

OK, so I'm building my site and want to add a blog element. Not having PHP and MySQL under my belt yet, I figure I'll use Blogger. Here's what I do:

I set up the account on Blogger and create the blog with my site as the location

I erase the blog's template code and copy and paste my site in its place

I copy and paste the essential Blogger tags and everything in between that makes the blog element workFunctionality is great. I can post on blogger, and it updates my site without having to go into the html for every addition.

Layout and look is a nightmare. My question is this: Does anyone know how to do away with Blogger's header that appears at the top of the screen? I can't seem to find the code that makes it appear so I can delete it. In the meantime, it's pushing elements of my site around in an unpleasant way.

I'm also open to "Blogger is a bad idea" posts, if that's the overwhelming sentiment. If there's a better way to do this without knowing server-side code and databases, I'm open to it.

Comment/Reply (w/o sign-up)

faulty.lee

Jun 20 2008, 03:45 AM

QUOTE(frameworker @ Jun 20 2008, 07:18 AM)

Layout and look is a nightmare. My question is this: Does anyone know how to do away with Blogger's header that appears at the top of the screen? I can't seem to find the code that makes it appear so I can delete it. In the meantime, it's pushing elements of my site around in an unpleasant way.

I added this code to my template code

CODE

function remove_nbar()
{
document.getElementById('navbar-iframe').style.display = "none";
}
<body onLoad='remove_nbar();'>

The bar will appear while the page is still loading, then disappear. I'ven't try to write in a better way to make it not even display at all.

You can find out about the element using firebug, an extension for firefox. It's really a useful tools. A must have tools for web developers.

Comment/Reply (w/o sign-up)

Snake

Jun 20 2008, 04:17 PM

I don't think you can copy Blogger's custom code and remove the top banner.

I think it's custom made software, and you probably have to host it on The Blogger Website

to use that custom made blog software.

You may be able to, but I think you would have to contact the Blogger staff.

If you want no top banner or anything, Try Wordpress.

~ Snake

Comment/Reply (w/o sign-up)

faulty.lee

Jun 20 2008, 06:15 PM

QUOTE(Snake @ Jun 21 2008, 12:17 AM)

I don't think you can copy Blogger's custom code and remove the top banner.

You can. I'm not changing the Blogger's Code. I'm just adding a bit of javascript to the original template, to detect and hide the element of the top blogger's bar.

Comment/Reply (w/o sign-up)

miCRoSCoPiC^eaRthLinG

Jun 20 2008, 07:12 PM

The above JS method will work 100%. I wonder though, if you pull-in your own CSS using a custom blogger template (those XML files) - and define the same CSS block there, will it override the blogger's navbar... or resorting to JS is the only way to go. My point is, your CSS will load AFTER the default Blogger's CSS. So in effect, it should be able to overcome the one of blogger. Any thoughts on this ?

Cheers,
m^e

Comment/Reply (w/o sign-up)

frameworker

Jun 20 2008, 10:01 PM

Success! Thank you, faulty.lee. I had to brush up a little on my JavaScript to figure out how to impliment it, but it worked. Here's what the code (abbreviated) looked like in the end:

CODE

<head>
 <script type="text/javascript">
     function remove_nbar()
{
     document.getElementById('navbar-iframe').style.display = "none";
}
 </script>
</head>
<body onLoad='remove_nbar();'>
Content
</body>

I would be interested to know if something similar is possible using CSS. Of course, it would be even better if the banner didn't pop up while loading at all. I didn't completely understand the explanation from miCRoSCoPiC, though.

Comment/Reply (w/o sign-up)

faulty.lee

Jun 21 2008, 03:47 AM

frameworker, you're welcome. What miCRoSCoPiC^eaRthLinG said is to apply attribute to the navbar in the template. Normally the user's template is loaded lastly after all the blogger's own content like the navbar. And since CSS is cascaded, which means that anything you set later will override whose set before hand, so by setting "display : none" for navbar in your own template, it would be able to hide it even while loading.

I just tested some code. This will works but might not pass XHTML validation.

CODE

You have to put it after the div for outter-wrapper, which is right after start of body tag. Blogger will put the navbar content in between. For the new style sheet to apply, it has to be after the navbar in order to override it.

CODE

It works on my site, at least now it won't show the navbar while loading.

Can anyone help with the proper style sheet coding for XHTML?

Comment/Reply (w/o sign-up)

faulty.lee

Jul 16 2008, 12:49 PM

Hi guys, I've updated the code to hide and show the Blogger's Navbar

CODE

EDIT: Funny, can't seems to have 2 CODE section. Please refer to the next reply

Comment/Reply (w/o sign-up)

xboxrulz

Jul 17 2008, 02:42 AM

Astahost has a plethora of hosted scripts if you don't want to tinker with PHP/MySQL code underneath. Wordpress, as others have suggested is a really good choice.

You should try it as well.

xboxrulz

Comment/Reply (w/o sign-up)

faulty.lee

Jul 17 2008, 05:03 AM

Then add these 2 links to your page

CODE

That's it. You can see the sample here and also the full tutorial on my blog
http://faultylee.blogspot.com/2008/07/blog...gation-bar.html

Comment/Reply (w/o sign-up)

Using Blogger To Add Content - Can I get rid of the header?

Using Blogger To Add Content - Can I get rid of the header?