Jump to content
Sign in to follow this  
phollist

WHP3 Feature Page More Button

Recommended Posts

phollist

On each of the Feature Pages there is a "More" button just below the Feature Title and Text. In the Set-Up for each Feature Page, there is a place to specify the link for each "More" button by entering a full URL. Where do I go to change the word "More" on the "More" button to some other word or phrase? Your expertise has been very helpful in the past and is deeply appreciated.

Share this post


Link to post
Share on other sites
timlinson

What you're seeing is actually an image button (http://www.pagelines.com/demos/whitehousepro/wp-content/themes/whitehousepro3/images/morebutton.jpg). You can either change the morebutton.jpg image directly or link to another image with custom css: `.fcontent a.featurelink {` `? ? background: transparent url(PATH_TO_YOUR_IMAGE) no-repeat center top;` `}` or use `background:none` and change the text directly in the pro/template_feature.php file, which would require some more coding prowess.

Share this post


Link to post
Share on other sites
phollist

Thank you for your expertise and prompt reply. Unfortunately, I do not completely understand what you told me to do. Changing "the morebutton.jpg image directly" appears to be the easiest for me, but I do not know exactly how to do it. Am I to do something with http://www.pagelines.com/demos/whitehousepro/wp-content/themes/whitehousepro3/images/morebutton.jpg? I will be most grateful if you can go a bit further with your explanation.

Share this post


Link to post
Share on other sites
catrina

It would be easy to simply add the code Tim provided in Theme Options > Custom Code > CSS Rules box and then save the options. Change "PATH_TO_YOUR_IMAGE" to the direct URL for the image button you want, which can be uploaded through the Media Library.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
phollist

Thanks for the additional understanding and pointing to the place to enter the CSS code. I entered .fcontent a.featurelink { background: transparent url "http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png" no-repeat center top; } in Theme Options > Custom Code > CSS Rules. "More" still appeared in the Feature Boxes. I also tried parentesis and no punctuation marks at either end of the url. I added the image to the media library and copied the url into the CSS code. What have I done wrong with the HTML?

Share this post


Link to post
Share on other sites
catrina

Hm, try using this selector instead:

div.ftext a.featurelink
Instead of
.fcontent a.featurelink


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
timlinson

also make sure you're not putting it inside the body{} tag

Share this post


Link to post
Share on other sites
phollist

Thanks for your consideration and suggestions. The "More" button is still in the Feature Boxes. The following HTML was copied and pasted from Theme Options > Custom Code > Custom CSS > CSS Rules. This is precisely what is entered. div.ftext a.featurelink { background: transparent url "http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png" no-repeat center top; } With this HTML in the CSS Rules box, I pushed "Save Options" and viewed the Feature or Home page.

Share this post


Link to post
Share on other sites
timlinson

your background url is missing the parentheses: ` .fcontent a.featurelink { background: transparent url(http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png'>http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png) no-repeat center top; } ` if that still doesn't work, try adding !important to override: ` .fcontent a.featurelink { background: transparent url(http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png'>http://032b510.netsolhost.com/wp-content/uploads/2011/05/App-Store-Link-98-x-33.png) no-repeat center top !important; } `

Share this post


Link to post
Share on other sites
phollist

Thanks for the expert help. The !important override did the trick.

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  

×