Jump to content
Sign in to follow this  
cocogreen

Title image change Eco pro

Recommended Posts

cocogreen

How do I swap the title page image on Eco Pro from the green band to something of my choosing. But make it go all the way across the page with no White space either left or right. Thanks a lot

Share this post


Link to post
Share on other sites
kastelic

Here is the CSS currently applied to make that band:

	#spotlight, #footer {
	background: #679810 url(../images/eco-bg-spotlight-rpt.jpg) repeat-x center top;
	}
	

So, you could either put in your own CSS targeting #spotlight and using your own image, or you could overwrite that image with your own image. Course, that will change the footer too.

Share this post


Link to post
Share on other sites
cocogreen

Is there a method of showing different pictures for different pages; rather than simply replacing one image with another. For examlpe if I had one page called Fruit; I would want a picture of fruit; and another page flowers; I would want a picture of flowers; but in the same layout as the Highlight Page. Thanks very much

Share this post


Link to post
Share on other sites
cocogreen

Any ideas anyone? Previous suggestion works accross whole theme but not for individual pages. Thanks

Share this post


Link to post
Share on other sites
kastelic

Sure, just prepend the rule with the page id, which can be found by viewing the source and looking at the opening body tag. example:

	.page-id-123 #spotlight{
	background: #679810 url(IMAGE-ONE-URL) repeat-x center top;
	}
	.page-id-456 #spotlight{
	background: #679810 url(IMAGE-TWO-URL) repeat-x center top;
	}
	.home #spotlight{
	background: #679810 url(IMAGE-THREE-URL) repeat-x center top;
	}
	

Share this post


Link to post
Share on other sites
cocogreen

kastelic, your a legend, thanks buddy

Share this post


Link to post
Share on other sites
Rob

Shall I close this topic for you?


Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
cocogreen

It works but, if you take a look at the page i am testing it on the image is cut just to the center. I would like the image (which is 2000px width) to appear over the green repeated image at the left and right; as well as the center. http://www.cocogreen.co.uk/home/products-2/custom-products Any advise would be very much appreciated. Thanks Cocogreen

Share this post


Link to post
Share on other sites
kastelic
Sorry for the delay, change it to this: .page-id-123 #spotlight .effect{

Share this post


Link to post
Share on other sites
cocogreen
Hey Kastelic, thanks for getting back to me with this; however I tried the following; and it does not work; it has reverted back to the original image. Where you have Spotlight I have put Highlight, as this is for Eco Pro. .page-id-216 #highlight .effect { background: #679810 url(http://www.cocogreen.co.uk/wp-admin/eco/images/coco-peat.jpg) repeat-x center top; } Again any further help would be appreciated

Share this post


Link to post
Share on other sites

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

Sign in to follow this  

×