Jump to content

css for HOME only


Recommended Posts

Hi

 

I want to do a background image via css for the home page only. Can I insert css in the home text editor? If I do this, the css code disappears after saving the home site.

 

any idea?

 

best

felix

Link to comment
Share on other sites

ah, and theres another thing: the body of my shop has a width of 800px. but for the background image i want have a fullscreen image

 

so i have this css code:

 

background: url('../img/home.jpg') no-repeat center center fixed;

background-position:0 80px;

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;

background-size: cover;

 

but where to put it in???

Link to comment
Share on other sites

hi Marty,

 

I tried, but I want the backgound image only on the start page. can I do this??

 

Felix

Yes, you can do this. Just add something like the following to global.css.

 

body#index{
background:#000;
}

 

This will change ONLY the index page background to black. Of course, change it to the background you want to use.

 

Hope that helps!

 

Marty Shue

Link to comment
Share on other sites

oh great, it works, so awesome!!

 

can I use this way to add some css to specific CMS sites too? for instance to change the background color only of the page "legal notice" ??

 

really cool!

Link to comment
Share on other sites

oh great, it works, so awesome!!

 

Glad it worked for you!

 

can I use this way to add some css to specific CMS sites too? for instance to change the background color only of the page "legal notice" ??

 

really cool!

 

You could but it is a little more involved when talking about a specific CMS page. You can do the following but it will change the bg on all CMS pages.

 

body#cms{
background:#000;
}

 

Marty Shue

Link to comment
Share on other sites

ok I see. great so far. is it possible to involve CSS in the CMS -Editor directly?

 

and my last question to this topic: ;)

 

can I design several produkt pages with different design? for instance one design with product picture on left side and another with product picture on right side (and order button vice versa)? maybe theres a plugin for that? or does every product page has a unique tag?

 

thank you for all your help!!!!

Link to comment
Share on other sites

ok I see. great so far. is it possible to involve CSS in the CMS -Editor directly?

 

You can include inline styling but this is not a good practice. CSS should be left to your stylesheets.

 

and my last question to this topic: ;)

 

can I design several produkt pages with different design? for instance one design with product picture on left side and another with product picture on right side (and order button vice versa)? maybe theres a plugin for that? or does every product page has a unique tag?

 

thank you for all your help!!!!

I have never done this, nor have I seen it done. To my knowledge you cannot do it.

 

Marty Shue

Link to comment
Share on other sites

  • 7 months later...
  • 4 months later...

Marty,

 

I would like to do the same: change background colour on my index page only, however I have a DIV ID overlaying the body background.

 

 

#page {

 

 

background-color: #FFFFFF;

border-top-style: solid;

border-top-width: 0;

}

 

 

How can I add an index-only addition to the CSS #page ID?

 

Thanks so much man!

Link to comment
Share on other sites

in the header.tpl file (in your theme directory) add this:

 

{if $page_name=="index"}
   {literal}
   <style>
   #page {
   background-color: #FFFFFF;
   border-top-style: solid;
   border-top-width: 0;
   }
   </style>
   {/literal}
{/if}

  • Like 1
Link to comment
Share on other sites

in the header.tpl file (in your theme directory) add this:

 

{if $page_name=="index"}
{literal}
<style>
#page {
background-color: #FFFFFF;
border-top-style: solid;
border-top-width: 0;
}
</style>
{/literal}
{/if}

 

 

YOU ARE THE MAN! Thanks dude! :)

Link to comment
Share on other sites

  • 2 years later...
  • 1 year later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...