Archived

This topic is now archived and is closed to further replies.

  • 0

Add Background To Call Out Section


Question

Posted · Report post

I am trying to add a background image to the call out section and continue using the standard button. I do not want to have the entire image be the button. How can I go about doing this?

Share this post


Link to post
Share on other sites

9 answers to this question

Posted · Report post

Like i said before, I can't see the style.css

Share this post


Link to post
Share on other sites

Posted · Report post

Are you trying to look at the style.css and edit it?

Share this post


Link to post
Share on other sites

Posted · Report post

You’ll need to use Custom CSS (in Site Options > Custom Code > Custom CSS). CSS that changes the style of a page element consists of two parts: the selector and the attribute.

Selector: Used to select the page element you want to change (in this case, the page element you want to change is your callout section).

Attribute: Property that determines what kind of change you want (you’re changing the background image, so the attribute you want to use is background-image).

To find the selector for the callout section, you'll need to use Firebug (or Chrome Development tools). To learn how to use Firebug for CSS customizations, please read and follow these instructions: http://www.pagelines.com/wiki/Custom_CSS.

For help with the background-image attribute, please see these instructions: http://w3schools.com/css/css_background.asp

Share this post


Link to post
Share on other sites

Posted · Report post

Can you be more specific?

.call-out {

background-image:url('img_tree.png');

background-repeat:no-repeat;

}

Is this what your talking about?

Share this post


Link to post
Share on other sites

Posted · Report post

Yes, but if the selector (in this case, .call-out) doesn't work, you'll need to adjust it (and it needs to be more specific so it would be like #page .callout)

background-image:url('img_tree.png');[/CODE]

^ In this line, you need to use the FULL image URL (http://domain.com/directory/filename.fileextension)

For further reference: http://www.cssbasics.com/chapter_12_css_backgrounds.html

Share this post


Link to post
Share on other sites

Posted · Report post

Are you using Firebug to inspect the callout section for the correct selector?

Share this post


Link to post
Share on other sites

Posted · Report post

Firebug doesn't work on pagelines like it did on standard themes. I can't even look at style.CSS Files

Share this post


Link to post
Share on other sites

Posted · Report post

I'm not so sure. I use Firebug every day on PL based sites. What are you finding that it's doing or not doing?

Share this post


Link to post
Share on other sites