Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 368
  • Last Modified:

add background image to specific page

I need to add a full background image to a specific page on my wordpress site.  Below is the css code for inner which controls that.  what would I add to my css file for a specific page though?
#inner {
	background: #FFFFFF;
	width: 920px;
	margin: 20px auto 20px;
	padding: 20px;
	overflow: hidden;
	border: 0px solid #665029;
	border-radius: 6px;
	-moz-border-radius: 6px;	
	-webkit-border-radius: 6px;	
	-webkit-background-clip: padding-box;
	-webkit-background-origin: padding-box;
	-moz-box-shadow: 3px 3px 4px #665029;
	-webkit-box-shadow: 3px 3px 4px #665029;
	box-shadow: 3px 3px 4px #665029;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#665029')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#665029');
	}

Open in new window

0
COwebmaster
Asked:
COwebmaster
5 Solutions
 
Jason C. LevineNo oneCommented:
Simplest (but perhaps not the most elegant) way to do it would be:

1) Create a custom page template
2) Add a new CSS declaration for the different background and use it in the new page template.
3) Edit the page in WordPress, change the template.
0
 
jeremyjared74Commented:
If you have your template files set-up correctly, WordPress will give each page/post it's own id. You can use this for styling individual posts. For this to work, you will need the following code:

<body <?php body_class(); ?>>

Open in new window


This would be in the header.php file, and should replace the <body> tag if that's what is currently being used. You could then use view source to get the id of the page and use it to add a bg image.
0
 
COwebmasterAuthor Commented:
what are the steps to setting up a template page, then adding in that code?
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
jeremyjared74Commented:
You can set up the other template, but it's really not necessary unless you have other layout changes to make. The whole purpose of the body class that has been added by the WordPress Core developers was to allow users or theme designers the ability to do things such as customizing the layout per page.

If you're set on using the custom template, here's  the instruction from the codex page:
Creating Your Own Page Templates

The files defining each Page Template are found in your Themes directory. To create a new Custom Page Template for a Page you must create a file. Let's call our first Page Template for our Page snarfer.php. At the top of the snarfer.php file, put the following:

<?php
/*
Template Name: Snarfer
*/
?>

The above code defines this snarfer.php file as the "Snarfer" Template. Naturally, "Snarfer" may be replaced with most any text to change the name of the Page Template. This Template Name will appear in the Theme Editor as the link to edit this file.

The file may be named almost anything with a .php extension (see reserved Theme filenames for filenames you should not use; these are special file names WordPress reserves for specific purposes).

What follows the above five lines of code is up to you. The rest of the code you write will control how Pages that use the Snarfer Page Template will display.

See Template Tags for a description of the various WordPress Template functions you can use for this purpose. You may find it more convenient to copy some other Template (perhaps page.php or index.php) to snarfer.php and then add the above five lines of code to the beginning of the file. That way, you will only have to alter the HTML and PHP code, instead of creating it all from scratch.

Once you have created the Page Template and placed it in your Theme's directory, it will be available as a choice when you create or edit a Page. (Note: when creating or editing a Page, the Page Template option does not appear unless there is at least one template defined in the above manner.)

LINK:
http://codex.wordpress.org/Pages#Creating_Your_Own_Page_Templates
0
 
Jason C. LevineNo oneCommented:
I'll be the first to agree that setting up a template is the brute force method...
0
 
Alicia St RoseOwner & Principle Developer/DesignerCommented:
What theme are you using? Can you give us a Url to the site? There may already be a class in the body tag you can use. I make child themes from Theme Hybrid and the developer has loaded all sorts of classes to the body tag including the page ID.
View source and see if you have several classes in your body tag. If not use Jeremyjared74's solution.
Simpler that creating a whole page template.
0
 
gwkgCommented:
view the source of your page and check the body tag for a specific class that is unique to your page.

You should be able to find something you can use like

body.page-id-25 {

}
0

Featured Post

Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

Tackle projects and never again get stuck behind a technical roadblock.
Join Now