Hi Ciaran. I'm starting to plug in a Slideshow and other images now for my new website in Habitat, impactmusic4kids.org. The white space above the title takes a lot of room, which I'd rather use to display more of the slideshow image on the home page, and the product options on the shopping cart pages.
Is there a way to reduce the white space on top of the header, so that (going down the page from the top,) there's just a few pixels of white space at the very top, then the title, then the slideshow, then the content? I'm hoping to use a slideshow of 1100x600 (or x500, x550 - something like that - I'll finalize as the white space on top gets adjusted.)
PS - I've released my first 2 websites now, that you helped me with previously (in Renovate and Grafik, respectively.) People always comment on how beautiful and inspiring the design is. Thanks again for your beautiful templates, which are the foundation and core of the design elements of all my sites now!
- Carrie Wrigley
-
- Commercial Templates
- Saturday, 23 August 2014
- Subscribe via email
Carrie, in your Extensions -> Template manager for J51 Habitat go to the Logo option and look for these settings (check attachment to this post).
I currently have my install of Habitat set to 0 and 0, but you should see a value of 48 or so for one of the options, which is what you are looking for (X Position / Y Position)
I currently have my install of Habitat set to 0 and 0, but you should see a value of 48 or so for one of the options, which is what you are looking for (X Position / Y Position)
- more than a month ago
- Commercial Templates
- # 1
Hi Carrie
Along with Chrisps suggestion you can also add the following to the Custom CSS field of your templates parameters which reduce the height of the logo area of your template. By default this is 130px, the following will reduce this height to 70px (edit to taste).
Ciarán
Along with Chrisps suggestion you can also add the following to the Custom CSS field of your templates parameters which reduce the height of the logo area of your template. By default this is 130px, the following will reduce this height to 70px (edit to taste).
#container_header {
height: 70px;
}
Ciarán
- more than a month ago
- Commercial Templates
- # 2
K, we're inching closer to a solution here...
Chris's suggestion, to change the X and Y position numbers in the logo option both to 0, seemed to make no difference. I even tried wildly inappropriate numbers on each of these axes, like 150. Still, no change in the placement of the logo. So ... I wonder if perhaps Chris is using a logo image, and that these numbers possibly relate only to the placement of such an image? Whereas I am just using a TEXT logo, whose placement seems entirely unaffected by the X and Y position numbers. What I need is to be able to move my text logo up to the top of the page.
Ciaran's suggestion, adding in the CSS code, definitely removed the extra whitespace, moving the menu bar up on the page. However, since the text logo remained in the same position as before, the CSS change merely put the menu bar right OVER the the text logo. I'd like the whitespace and menu bar to be exactly where Ciaran's CSS fix put it - but for the text logo to appear above that menu bar, at the very top of the page. Is there perhaps another CSS fix, specific to the text logo, that could accomplish this?
(For now, I just reset everything to the defaults, so all the elements remain visible until we figure out this other little piece of how to move the text logo up on the page.) Thanks.
Chris's suggestion, to change the X and Y position numbers in the logo option both to 0, seemed to make no difference. I even tried wildly inappropriate numbers on each of these axes, like 150. Still, no change in the placement of the logo. So ... I wonder if perhaps Chris is using a logo image, and that these numbers possibly relate only to the placement of such an image? Whereas I am just using a TEXT logo, whose placement seems entirely unaffected by the X and Y position numbers. What I need is to be able to move my text logo up to the top of the page.
Ciaran's suggestion, adding in the CSS code, definitely removed the extra whitespace, moving the menu bar up on the page. However, since the text logo remained in the same position as before, the CSS change merely put the menu bar right OVER the the text logo. I'd like the whitespace and menu bar to be exactly where Ciaran's CSS fix put it - but for the text logo to appear above that menu bar, at the very top of the page. Is there perhaps another CSS fix, specific to the text logo, that could accomplish this?
(For now, I just reset everything to the defaults, so all the elements remain visible until we figure out this other little piece of how to move the text logo up on the page.) Thanks.
- more than a month ago
- Commercial Templates
- # 3
Hi Carrie
Yes that would explain it. For the moment the X and Y fields are only relevent when using an image based logo. To change the vertical position of your text based logo you can add the following to the Custom CSS field of your templates parameters..
You can edit the above to your own taste. Note you can also use negative figures if needed ( -10px ).
Ciarán
Yes that would explain it. For the moment the X and Y fields are only relevent when using an image based logo. To change the vertical position of your text based logo you can add the following to the Custom CSS field of your templates parameters..
h1.logo-text a {
top: 10px;
}
You can edit the above to your own taste. Note you can also use negative figures if needed ( -10px ).
Ciarán
- more than a month ago
- Commercial Templates
- # 4
Yes, these CSS fixes solved the issue. I ended up using 80px (rather than 70) on the menu height; and 0 px (rather than 10) on the logo height. The result was absolutely perfect. (see impactmusic4kids.com) Thanks again for your awesome help, Ciaran!
And Chris - thanks for your info on the x and y position. If I ever need to plug in an image logo, now I know how to position it, thanks to you and Ciaran.
These templates and this Forum are truly awesome! So happy. That's one more site pretty much good to go now.
And Chris - thanks for your info on the x and y position. If I ever need to plug in an image logo, now I know how to position it, thanks to you and Ciaran.
These templates and this Forum are truly awesome! So happy. That's one more site pretty much good to go now.
- more than a month ago
- Commercial Templates
- # 5
- Page :
- 1
There are no replies made for this post yet.
Be one of the first to reply to this post!
Be one of the first to reply to this post!
Please login to post a reply
You will need to be logged in to be able to post a reply. Login using the form on the right or register an account if you are new here. Register Here »