Remove text in header?
Hey,
Just wondering how I might go about removing the text which is always on a custom header image? Like the title of the page is always written on top of the image?
How can I remove it?
Thanks!
Remove text in header?
Forum
» Help / Themes
» Remove text in header?
Summary:
Removing text in site header image
You can remove the title from all pages by adding the following CSS to your custom theme:
#page-title {
display: none;
}
Rob
Rob Elliott - Strathpeffer, Scotland - member of the Wikidot first line support team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development
community groups, villages, charities, business and government.
And by "page-title", Rob really means "header":
#header h1, #header h2 { display: none; }
λ James Kanjo
Blog | Wikidot Expert | λ and Proud
Web Developer | HTML | CSS | JavaScript
No I don't James, I wrote what I meant. He asked about or at least referred to the page title, and on his pages I can see why he might want to remove it as it duplicates what he has used as a page title further down each page.
Edit1: deleted
Edit2: I've just looked at his pages in Firebug and both are having the same effect.
Rob
Rob Elliott - Strathpeffer, Scotland - member of the Wikidot first line support team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development
community groups, villages, charities, business and government.
Having fun with those edits? XD
Look, I don't think s/he's using Firefox. I'm using Safari 3, and certainly the Site Header text displays over the image (not the reverse). In Firefox, no header text is displayed over the header image.
If he wanted to hide the page title of his home page alone, he could just edit the page and clear the page-title text.
removing the text which is always on a custom header image
I interpreted this as the site header text.
λ James Kanjo
Blog | Wikidot Expert | λ and Proud
Web Developer | HTML | CSS | JavaScript
Being a Firefox user and rarely using other browsers I always forget how differently some things can be rendered on those browsers.
Rob
Rob Elliott - Strathpeffer, Scotland - member of the Wikidot first line support team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development
community groups, villages, charities, business and government.
Thankyou very much Strathview and James!!
I actually did just want to remove the text over the header image, but now i know how to remove the title text i think i'll do that too:D
Thanks a lot guys!
Is there any way to accomplish this on a per-page basis? I'd like to remove the title of the page from a few certain pages and would rather not remove them from all of the pages.
You can accomplish that by applying the custom css only to pages belonging to a given category.
I'm customising the Fresh Theme & I'm struggling to get the site title out of the header. I want to use a custom logo and so this gets assigned to #header h1. The problem is that #header has a background image also. The modified css is below. One workaround is to change the site title to "." via site admin & then set the font colour close to the backgound image used in the #container wrap. There must be a better solution; seems a bit of a hack.
@import url(http://themes.wdfiles.com/local--code/green-fresh); #header { height: 200px; padding-right: 8px; background: url(http://gguk.wikidot.com/local--files/css2/shadow-right.png) no-repeat right 171px; } #header h1 { float: left; padding: 142px 0 0 393px; background: url(http://gguk.wikidot.com/local--files/css2/gg_logo_trans_393x176.png) no-repeat left bottom; } #container-wrap { background: url(http://gguk.wikidot.com/local--files/css2/body-bg.png) repeat-x top; } #container { width: 65%; min-width: 600px; margin: 0 auto; padding-left: 8px; background: url(http://gguk.wikidot.com/local--files/css2/shadow-left.png) no-repeat 0 171px; position: relative; } #search-top-box{ display:none; } #page-title{ display:none; }
Try this:
#header h1 a {
display: none;
}
Rob Elliott - Strathpeffer, Scotland - member of the Wikidot first line support team.
Strathview ~ Wikidot-based wikis, websites & intranets and online database development
community groups, villages, charities, business and government.
Or try this:
#header h1 a span {
display: none;
}
#header h2 span {
display: none;
}
I used code like in the block below on a site to make an image swap for the header graphic. It also still links to the start page. My images are 311px x 140 px. This totally hides the #header h1 and #header h2 text. If you don't want the image swap effect, just remove the #header h1 a:hover {…} section. (Note: real links removed to protect the innocent)
/* header */ #header { position: relative; z-index: 30; height: 140px; width: auto; margin-left: 0; margin-right: 0; margin-bottom: 2em; } #header h1 { margin: 0; padding: 0; } #header h2 { margin: 0; padding: 0; height: 0px; } #header h1 { float: left; width: 311px; height: 140px; max-height: 140px; z-index: 40; padding: 0; margin: 0; } #header h1 a { display: block; width: 311px; height: 140px; padding: 0; background-image: url(http://mywikidotsite.wikidot.com/local--files/start/mylogo1.jpg); background-repeat: no-repeat; } #header h1 a:hover { display: block; margin: 0; padding:0; background-image: url(http://mywikidotsite.wikidot.com/local--files/start/mylogo2.jpg); width: 311px; height: 140px; } #header h1 a span { display: none; } #header h2 span { display: none; }
-Ed
/forum/t-144395/remove-text-in-header#post-
