Geeklog Forums

Hello.. How do I remove the blue strip from the front page and add my own logo. I tried to replace the logo on front by overwriting it but it did not work.

Please advise. My site is www.webanddesign.net

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

in style.css, remove background:url(images/header-bg.png) #1A3955; from the header-logobg-container-inner rule.

Your browser may have cached the previous version of the image - try a forced reload.

bye, Dirk

Thanks for both of your responses...

1. I will try the forced upload of the logo next.

2. I went to the style sheet.. I found two different places where #1A3955 was listed... I'm afraid to remove either. Could you be a little more specific here. And.. where to remove it.. Before the { or after the . or...? Still learning. Thank you for your patience... Thank you.


.block-title,blocktitle {
background:transparent;
color:#1A3955;
font:bold smaller Tahoma,verdana,helvetica,arial,sans-serif;
padding-top:13px
}
.block-title-left {
background:transparent;
color:#1A3955;
font:bold smaller Tahoma,verdana,helvetica,arial,sans-serif
}
or here...


.footerblock {
background:#1A3955;
border-top:1px solid #CCCCCC;

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

Actually, in looking at this, I see the one on the bottom is a "footerblock"...

Duh for me.. Sorry....

I still need to understand "where" to remove the header.. please advise if you will and again.. thank you in advance.

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

Machinari was talking about this bit:

The url(images/header-bg.png) links to the image that is used as a background in the header, the #1A3955 just sets a background color in case the image can not be loaded.

HTH

bye, Dirk

Report on Success Rate:

1. I successfully removed the background"url(images/header-bg.png) and so I feel some success.. BUT...

2. Now the logo resized and I guess I want to know is there any way to avoid the resizing or change some sizing numbers to allow the larger logo?

3. How do I extend the blue on the logo to go across the page..

4. Again... a thank you and "thanks for the patience" notice is in order.

thanks... Again, the site is www.webanddesign.net.(funny I should be developing a site with such a name since I'm learning myself!).Ha
N

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

do you want it to look like this?

Wow! YES! What to do?????

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

**replace the width and height values of the logo image tag in header.thtml with these: width="438" height="120"

**remove the transparency from your logo image

**take a small portion of your logo's blue textured background and edit (seamless tile) it to function as a background image for the entire row... 32x32 is big enough. Place that image in your theme's image folder. Ensure that the name you use for the image is reflected in the next step..

**find where you removed the bg image earlier and edit the rule to look like this (replace "yourNewBGimage.gif" with the name of your edited bg image):

I think that should be it--off the top of my head

Off the Top Of your Head! The life! I'll be glad when I can visualize it like that..

Meanwhile, I did find some success and thank you...
The logo extends across the top of the site.. yeah!

I could not find the transparent to remove it.. Where would that be and I think I'll be set to go..

Again, thank you!

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

It seems that you've edited your logo since last I looked. Its transparency seems to have shifted. hmmm... That all takes place in your image editing software.

may I make a suggestion? don't use a logo. just take the picture from your logo and leave it in the header, then use real text to display the large "web and design .net" perhaps in an <H1> tag--all of that overtop of your new background image. This way, you may change your background image anytime without having to worry about the logo's background matching.

hope that helps

-Thank you for checking on the site again... Yes, I had to change the logo as the first one had a thin black line around it and the right .gif looked funny because it looked as if there was a black line in the center of the top where they connected. I took the black line off of the logo and it must have changed the dynamics. The good thing of that is that I have learned so much in doing all of this...



-Editing Software-(I work on a mac and use appleworks software to edit gifs, etc. I need to find my photoshop software and install it...It does so much better.. In time...).

-Your Suggestion:
I like your suggestion but again, it will put me in a learning mode. If you have the patience to help me do that...I would certainly work towards being a good student.For example... I don't know where to leave the logo in the header...I surmise it would be a .gif in the images section? I'm also thinking that I would put the behind the word header? on the style sheet?

-Where would I type in Web and Design.net? I would like to be able to change the background. It would give the site change from time to time...

-OTHER QUESTION Related to logos......What if I had a logo that had a pattern for example of houses... {house, house, house, house for example}. Would I create a .gif with "one" house and put it in the images folder to load on the "right side" of the header? And would it multiply the houses OR just be "one" house as in the gif? (Hope that made sense...I was just wondering)....If I'm going off the deepend here just say so....I'll settle down....

-Now back to the original concern...I want to learn how to do this and am willing.. Again, I can't thank you enough... Please advise if I'm right with the above thoughts on how to complete this idea correctly.

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.

First: about your "house" image--notice the word "repeat" in the following CSS rule:that one word is what will make whatever image you use on that line "repeat" along the x and y axis of your alotted space. So yes, one house will repeat itself until the space is filled. just replace the image in the above rule with your house image.

Second: to do what I suggested in my earlier post, you'll have to edit your header.thtml a bit. The bad side to this is that these changes are not carried over if you use more than one theme (unless you edit the header.thtml of all your themes).

The changes i suggest are pretty straight forward and I almost have to do them for you in order to teach you how to do them. so you'll just have to get along with my brief instructions:

* crop your logo to the small square image of the webpages.
* adjust the dimensions in the image tag to reflect the dimensions of the new image size.
* edit/remove the width="50%" height="78" from both the image containing cell and the next cell.
* change the width of the image's containing cell to be slightly larger than the image it contains--probably 110 or 120 is good enough because i figure your new image should be about 100 pixels or so.
* create a new table cell after the cell that contains the image, but before the cell containing the site slogan. So now you have a table with 3 cells.
* here are the contents of your middle (new) table cell:feel free to remove the style definitions and add them to your style sheet--not that it really makes a difference here.

...and I suggest using your photoshop software in order to create a background image that will appear seamless when "repeating."

Hope that helps. enjoy.

Thank you much....This is the weekend so I am going to photograph Willie Nelson and Bob Dylan. Then I have a short trip to take.. When I return I'm going to stop the (easy life) and get down to attempting your suggestions.

Again... thank you very much. I 'm sure you've not only helped me but many more who have read these threads.

More when I return... Take care and again thank you.
Bloom Where You're Planted.

---

Send Me To The Royal Wedding-http://www.royaltys.com - to enter my site.