using multiple styles for the site-title and description

  • I am working on a theme (started from _S framework) right now that utilizes a static front page and a set of dynamic pages. The static front page needs to show the site-title and site-description with a different size/style than the dynamic pages. at the moment I am using the following code to make the static page show up differently than the dynamic pages:

    .home h1.site-title a {
	color: #fff;
	font-size: normal;
}

    but the issue is that when I start styling the dynamic pages I am changing the static page at the same time. Can anyone point me in the right direction?

    on a side note the site-description and a few hidden elements are all that really needs to be different from the dynamic page so I would like to avoid a separate template for just that single static page if possible.

Viewing 1 replies (of 1 total)

  • You have the right idea. Using conditional CSS for the static page should override the dynamic pages.

    For example, what you’ve used

    .home h1.site-title a {
	color: #fff; <-- white
	font-size: normal;
}

    Should override

    h1.site-title a {
	color: #000; <-- black
	font-size: 30px;
}

    But, if you were to add something like a 1 px border around the site title on your dynamic pages

    h1.site-title a {
     border: 1px solid #000;
}

    it would display on your static page because there isn’t CSS telling it not to.

    In order to not have it display on your static page, you would need to tell it not to like this.

    .home h1.site-title a {
     border: none;
}

    This border is just an example, but if you tell it to show something on the dynamic page that is not included in the static page CSS, then it will show on the static.

    If this doesn’t help, link your site and let us know what you want to do, and I’ll take a look.

Viewing 1 replies (of 1 total)
  • The topic ‘using multiple styles for the site-title and description’ is closed to new replies.