Wordpress / PHP Help

[Rathji]

The non-profit organization I work for has a Wordpress site we would like to add another page to, and as a result need to create a template for the page. I have copied an existing page template started using it but there are some things I can't change - like the page specific banner.

The PHP for the page template and resulting html for the page seem to indicate that the text inside the parenthesis below is what is generating the URL for the banner.

url(<?php bloginfo('template_directory'); ?>/banners/<?php $key="page_banner"; echo get_post_meta(18, $key, true); ?>)

My question is this: Is there some place within Wordpress that I need to be changing something so that this points to the correct files etc, or should I be looking at altering the php (or css) files?

[MickMcGeough]

- bloginfo('template_directory') echoes the current theme's root directory (usually something like "{webroot}/wp-content/themes/{theme_name}")
- you should have a directory called "banners" there.
- each post that uses this template should have a custom field called "page_banner". The value of this field should be the filename of the image you want (just the name, not the path).

ETA: You shouldn't need to add a new template to add a new page, unless none of the layouts of the existing templates does what you need. Basic sites shouldn't need more than a few templates.

[Rathji]

Yeah the ones we have don't do what we need. More correctly, the name of the particular page is embedded in an image on the banner, so we need to change that at minimum. The rest of the layout I have convinced them to accept an existing layout so that is why I only really care about the banner.

So I managed to get the new banner showing, by adding in the page_banner custom field but it is not positioned correctly. Is there any reason CSS wouldn't apply to a new template? I didnt change anything within the template file I am using right now except the template name at the top and if I try and use an existing template, it forces me to use the banner for that template, and not the banner I have in the custom field.

[MickMcGeough]

Originally Posted by Rathji

Is there any reason CSS wouldn't apply to a new template?

Yup, plenty of them. Nothing I can help with without seeing a lot more code though.

Chances are the css was set up to use an image of a certain size. Do the dimensions of your new banner match the old banners exactly?

[Rathji]

Yes - they do match exactly. I am just using one of the original banners to test it right now while I was for the graphics to be designed.

In playing around, I have determined that the correct banner (as in the one that is indicated on the page_banner custom field) only shows up if I am using the default template. With any other template, the banner for that template overwrites the page_banner and if I use the template I duplicated the banner for the original template shows up as well.

My thinking is that somewhere in the php or wordpress is something that has linked the template and the banner, but I can't see anything that does that.

Sent you a PM as well, Mick

[MickMcGeough]

Is this site public now? If I could see a live example of a working banner and a broken banner I can probably tell you pretty quick what the problem is.

[Rathji]

link to a site - now gone

The Reports page is the one I have added. Right now I have just renamed one of the other banners and added it, along with the default theme.

[MickMcGeough]

Originally Posted by Rathji

www.unlockingpotential.ca

The Reports page is the one I have added. Right now I have just renamed one of the other banners and added it, along with the default theme.

Ok - the problem is background image positioning. Your "page_banner" div background is set to "top center" everywhere but on the reports page, where it's set to "top left".

The thing I found weird was that this style is being applied inline as opposed to via a CSS class.

Take a look at what generates the following line on your reports template:

<div id="page_banner" style="background: transparent url(http://unlockingpotential.ca/wp-content/themes/up/banners/reports-banner.jpg) no-repeat top left;">

That line needs to read:

<div id="page_banner" style="background: transparent url(http://unlockingpotential.ca/wp-content/themes/up/banners/reports-banner.jpg) no-repeat top center;">

[Rathji]

Thanks a lot.

I figure out that the default template that I copied was different in a few ways to any other template that was used. In the case of the banner, it was a div that wasn't used elsewhere that had the left align tag. Was a simple fix for the banner.

Once I figured that out, everything else was pretty much related to the templates not being the same and wasn't much of a problem to fix. Now I am just waiting on the graphics.