Jump to:

3435 Posts in 1026 Topics by 866 members

Template Questions

SilverStripe Forums » Template Questions » Headers of various widths

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 760 Views
  • ThereBeDragonsHere
    Avatar
    Community Member
    8 Posts

    Headers of various widths Link to this post

    Hi all,

    I was wondering how I would go about creating headers of different widths for different pages of my site. I was thinking that my home page would have a tall header, but all the subsequent pages would have narrower headers, but I'm not sure how to program this. I have been attempting to do a google search for such a thing, but I guess I just can't type in the right keywords or something to find what I'm looking for. I know that it's possible because I've seen it on other people's pages, but even after sneaking a peek into their page sources I still don't know how to do it.

    Does this require writing two layout.css's or two Page.ss's? Or is there a way to get the files to know when they are on a main page and when they are not? Thanks.

  • Willr
    Avatar
    Forum Moderator
    5490 Posts

    Re: Headers of various widths Link to this post

    Not sure how different you want to make it but you could simply use the current template file but apply a id or class to the body tag which will allow you to style different pages with different css values.

    For example edit your body tag in Page.ss to something like <body class="page-$URLSegment"> then you can style headers using #header {] but if you want different styles on the homepage you can use .page-home #header to select simply the header of the homepage.

    760 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.