Editing the Front Static Page ONLY

HTML & CSS
1

Dear all,

I am new to wordpress html editing. i run a tumblr, where i have figured out the html patterns, but wordpress seems to confuse me, especially with the different php sections. so i come forth to ask here.

i have created a static home page. easy.

heres the couple of questions i have so i can go somewhere from here.

how to edit the homepage only. without effecting anything else in the site.
essentially. i would like to create a home page that is nothing but a full background image on the whole screen. and then just the navigation bar.
i am trying to figure out how to

  1. make a full screen background image

  2. if you go to my site now, you will see a full background image, but i used the background image upload in the appearance, therefore it is applied to all pages. i just want the full background image on the homepage. so again, editing that page without effecting anything else.

  3. how to edit the home page. as in, move the navigation bar around , i have tried in the style sheet in the
    #main, and i got it to go where i want it to, but it moves the navigation bar on every page again.

website is … athrill.co.uk

thank you very much

2

Hi,

Welcome to Sitepoint :slight_smile:

That Wordpress theme is adding a ‘home’ class to the body tag.
If you view source on a page it will have:


<body class="[B]home[/B] page page-id-12 page-template-default custom-background">

You can add custom styles in Wordpress in Appearance > Editor > Styles

If you are happy with how the background is showing now you can add these below, and remove it from where you currently added it to all pages.


.home {
    background: url("http://athrill.co.uk/wp-content/uploads/2012/03/hunta1.jpg") scroll center top no-repeat;
}

You can use the same class hook to move the menu if you want.


.home #main { ... }

For more serious changes to layout you may need to use a different template for the home page so you can have different HTML as well.

All the best,

3

thanks mark.

so bear with me here.
to pick up on some points.

i do all this in the stylesheet (style.css)?

i did the background like you said, and it work. except moved my navigation bar from a horizontal list to a vertical list. i havent messed around with the css, but weird.
also, what do u mean about this template? is it a limiting one? would i have more luck customizing my page using css with something else?

4

this is where im at

.home {
    background: url("http://athrill.co.uk/wp-content/uploads/2012/03/hunta1.jpg") scroll center top no-repeat;
}

.home#top {
	height: 85px;
	padding-left: 100px;
	padding-top:317px;
}
#top {
	height: 85px;
	padding-left: 100px;
	padding-top:117px;
}

when i was messing around moving the header and nav. bar under it, i change the padding top, and that moved in down. so i included the .home#top and
changed the value. except the location of the header and nav. bar is the same on every page. by the understanding i have, the .home should change the home page to be different…

*to avoid confusion, when i said #main, i meant #top. thats whats been moving the nav and logo around.

5

thanks again mark.

wonderin if anyone offers one on one help with wordpress. through email or chat.
this site is for a client, and i didnt know what i was getting myself into. **** is harder than it looks.

if anyone is nice to chat with me and offer me some help, id appreciate it. ill be back on the this wonderful site on a daily while working on this, so…

thanks

6

Well I know a bit about wordpress, however what would you want help with? If you post a thread we can help with any issues (as you found out) :).