Extra Background Images

This particular option can be found by logging into your site's admin area and going to:
"ProPhoto" > "Customize" "Advanced" > "Extra background images"

If you ever want to upload a background image to a very specific area of your ProPhoto blog, and the built-in options aren’t specific enough for you, then you’ll be pleased to know that you can upload a custom background image to any CSS class that exists in the ProPhoto theme.

Uploading custom background images requires that you know how to identify the CSS selectors that correspond to specific areas of your blog. This is most easily done by using your browser’s developer tools, but you need to know what you are looking for. Customizations in this area were intended for designers who are familiar with CSS, but all are welcome to try their hand.

The actual process is fairly straightforward.

  1. Go to “ProPhoto” > “Customize” > “Advanced” > “Extra background images”
  2. Upload your custom background image
  3. Select your scrolling, tiling, and positioning options just like other background upload areas in ProPhoto. Click here for a tutorial that review some of the general background image options.
  4. Enter the CSS selectors, separated by commas, where you want to apply this specific background image.  This is probably the trickiest part since it requires that you understand how to analyze and understand CSS classes and ids in ProPhoto.  If you are wanting to do something this custom, we assume you know how to do this, or can learn how.

Most common use

  • You want to upload a custom background image for specific WordPress “pages” (not posts) to replace your main blog background

This would require that you locate the page IDs for those pages. To get the page ID number (the “XX”), edit your post or page in WordPress. When you’re editing it, you’ll find the ID number in your browser address bar after the part that says “&post=” as seen here:page id number

ProPhoto 5 has three outer background images (“ProPhoto” > “Customize” > “Background”)  that could be applying on a given page.  If you want to override one of them specifically you need to use the right CSS in combination with the right page id.  Here is what the CSS selectors would look like for outer background images 1, 2, and 3, respectively.

  • Site Outer bg #1 – body.page-id-xx
  • Site outer bg #2 – body.page-id-xx:before
  • Site outer bg #3 – body.page-id-xx #inner-body

In the CSS selector box type in multiple page IDs in this manner:
body.page-id-6395, body.page-id-6494

Click here for CSS selectors for common ProPhoto pages

This particular option can be found by logging into your site's admin area and going to:
"ProPhoto 4" > "Customize" "Advanced" > "Extra background images"

If you ever want to upload a background image to a very specific area of your ProPhoto blog, and the built-in options aren’t specific enough for you, then you’ll be pleased to know that you can upload a custom background image to any CSS class that exists in the ProPhoto theme.

Uploading custom background images requires that you know how to identify the CSS selectors that correspond to specific areas of your blog. This is most easily done by using your browser’s developer tools, but you need to know what you are looking for. Customizations in this area were intended for designers who are familiar with CSS, but all are welcome to try their hand.

The actual process is fairly straightforward.

  1. Go to “ProPhoto” > “Customize” > “Advanced” > “Extra background images”
  2. Upload your custom background image
  3. Select your scrolling, tiling, and positioning options just like other background upload areas in ProPhoto. Click here for a tutorial that review some of the general background image options.
  4. Enter the CSS selectors, separated by commas, where you want to apply this specific background image.  This is probably the trickiest part since it requires that you understand how to analyze and understand CSS classes and ids in ProPhoto.  If you are wanting to do something this custom, we assume you know how to do this, or can learn how.

Most common use

  • You want to upload a custom background image for specific WordPress “pages” (not posts) to replace your main blog background

This would require that you locate the page IDs for those pages. To get the page ID number (the “XX”), edit your post or page in WordPress. When you’re editing it, you’ll find the ID number in your browser address bar after the part that says “&post=” as seen here:page id number
ProPhoto 4 has two outer background images (“ProPhoto” > “Customize” > “Background”)  that could be applying on a given page.  If you want to override one of them specifically you need to use the right CSS in combination with the right page id.  Here is what the CSS selectors would look like for outer background images 1 and 2, respectively.

If you’ve searched the tutorials and can't find what you need, please contact us. We’re here to help. Contact Us