http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo Support Forum - Topic: Change the header to custom banner with logo! en-US Wed, 19 Jun 2013 17:31:38 +0000 http://bbpress.org/?v=1.0.2 q http://www.kriesi.at/support/search.php http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90779 Wed, 09 Jan 2013 10:46:44 +0000 Dude 90779@http://www.kriesi.at/support/ <p>Hey! </p> <p> Yes exactly :) </p> <p> Best regards,<br /> Peter </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90704 Tue, 08 Jan 2013 22:54:00 +0000 autoplius 90704@http://www.kriesi.at/support/ <p>Hello again,</p> <p>Amazing, so i just need to add this right into custom.css which is found in my Abudance theme folder??</p> <p>Regards</p> <p>Autoplius :) </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90679 Tue, 08 Jan 2013 22:04:49 +0000 Devin 90679@http://www.kriesi.at/support/ <p>You can just remove the background-attachment declaration so that the image isn't fixed. Also add background-color:transparent to the #header css so that the background color is overwritten.</p> <p>So:<br /> <pre><code>#header { background-image: url(&quot;http://www.autoplius.dk/wp-content/uploads/2013/01/Autoplius_2.png&quot;); background-repeat: no-repeat; background-position: center top; background-color: transparent; } #top .logo { visibility: hidden; } #top #header .container { height: 158px; } #top .logo { visibility: hidden; } #header #searchform { top: 38px; } #top .social_bookmarks { top: 46px; }</code></pre> <p>That would be your new total custom.css. Then just keep adding/editing the css as needed to get the layout finished and pixel perfect as you want it.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90634 Tue, 08 Jan 2013 19:06:46 +0000 autoplius 90634@http://www.kriesi.at/support/ <p>+</p> <p>4) If I use scroll up and down in my page, my banner hides under front page. <a href="http://www.autoplius.dk" rel="nofollow">http://www.autoplius.dk</a> </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90625 Tue, 08 Jan 2013 18:04:12 +0000 autoplius 90625@http://www.kriesi.at/support/ <p><a href="http://imageshack.us/photo/my-images/59/screenshotfrom201301081.png/"><img src="http://img59.imageshack.us/img59/4863/screenshotfrom201301081.png"></a></p> <p>Thank you, for helping me it works ;) But, i need a couple things more.</p> <p>1) I need social buttons back on this.<br /> 2)Search tabel back.<br /> 3)Grey areas in sides should be not visible so i can have a texture background. I think it will see much better without these grey areas in sides.</p> <p>Regards, Autoplius! P.s your support is really impressing! </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90616 Tue, 08 Jan 2013 17:00:32 +0000 Devin 90616@http://www.kriesi.at/support/ <p>You need to make the banner image taller. Otherwise nothing is visible that I can see unless you mean the sub menu which you can remove by adding the following to your Quick CSS or custom.css file:<br /> <pre><code>.sub_menu { display: none; }</code></pre> <p>Additionally, you could shrink the header container a bit by modifying the css to be:<br /> <pre><code>#top #header .container { visibility: hidden; height: 157px; }</code></pre> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90607 Tue, 08 Jan 2013 16:38:30 +0000 autoplius 90607@http://www.kriesi.at/support/ <p>Hello,</p> <p>Could you take a look <a href="http://www.autoplius.dk" rel="nofollow">http://www.autoplius.dk</a> hmm it doesnt really fit in.. original header is stil visible.</p> <p>Regards, autoplius </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90575 Tue, 08 Jan 2013 15:12:49 +0000 Devin 90575@http://www.kriesi.at/support/ <p>Hi Autoplius,</p> <p>I think the easiest route would be to first hide the main header background. Then, add a background image to the header and position it. Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:<br /> <pre><code>#header .container { visibility: hidden; } #header { background-image: url(&quot;http://www.yoursite.com/yourimageurl.png&quot;); background-repeat: no-repeat; background-position: center top; background-attachment: fixed; }</code></pre> <p>Reference: <a href="http://www.w3schools.com/cssref/pr_background-image.asp" rel="nofollow">http://www.w3schools.com/cssref/pr_background-image.asp</a> and <a href="http://www.w3schools.com/cssref/pr_background-position.asp" rel="nofollow">http://www.w3schools.com/cssref/pr_background-position.asp</a></p> <p>Then you just change the url to that of your banner and position it as needed.</p> <p>Regards,</p> <p>Devin </p> http://www.kriesi.at/support/topic/change-the-header-to-custom-banner-with-logo#post-90509 Tue, 08 Jan 2013 09:42:48 +0000 autoplius 90509@http://www.kriesi.at/support/ <p>Hey,</p> <p>I will change a header so i can use my custom logo/banner. It should look like that <a href="http://imageshack.us/photo/my-images/707/autoplius2.jpg/"><img src="http://img707.imageshack.us/img707/7295/autoplius2.jpg"></a></p> <p>So how do i instert that?</p> <p>Best Regards Autoplius </p>