Callout customizations

5 posts in this topic

How can I have the entire Callout area moved to the right, like this: ?


And shouldn't there be a box in Page Settings for adding a class to Callout section, or some other way to style just one Callout instead of all of them, like with a text-align:right; or something?


Thank you.

Share this post

Link to post
Share on other sites

Hi Cliff,


You can always prefix any CSS with .page-id-XX (where XX represents the page ID number assigned by WordPress).


Finding the correct element in Firebug or Chrome's Inspection Tool should result in the ability to apply a padding-left or margin-left.   I'm doubtful that float:left will work as it would probably cause a conflict with the button.


To answer your query about a box for a Callout Section, such a class would be applied to the whole Callout, which is a pre-styled section with a particular layout. As it wouldn't apply to any individual component of the Callout, there would be no impact on redesigning its layout.  This is why direct, custom CSS is a more effective, efficient and productive method of customization.

Share this post

Link to post
Share on other sites

A css class option should be added to the Callout customization options, like the Content Box Class option for ContentBox. One reason is because page-id- does not show up anywhere in View Source on the Blog Template page. If you have a way to move the text to align right, please share.

I tried

<span style="float:right;">blah</span>

within the Callout text option, but it didn't do what I wanted, and text-align:right; didn't do anything.


Also, more built-in styles would be cool too.

Thank you.

Share this post

Link to post
Share on other sites

I'll pass it along to the developers.

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

  • Similar Content

    • changing text colour
      By scifi
      Sorry simple question - but everything's so complicated.
      I need to change the colour of one word of text in a callout section. Could you help me.
    • Customizing Callout sections individually?
      By danmanders
      Hi all! I'm having an issue figuring out how to specify in the Custom CSS section that I'd like to make modifications to Callout sections individually, rather than site-wide. This code will hide the text and title on all of the Callouts:
      .callout_text {    display: none;  }   I've been trying to figure out how to only apply it to Callout clone #2, but can't get it right. I know it involves "clone_2", but I'm unable to find the relevant line with Firebug. Could someone please help? Thank you!
    • Create CSS for a custom pressed/hover Callout button
      By bauerhaus
      I have created a Callout (see the orange bar on the below website) and uploaded a custom "Start Now" button. Is there anyway I can also add a hover button? I want it so when you mouse over the button, the button looks pressed. I have the .png file, I'm just not sure how to reference it and where.
      I worked recently on a website design for a Drupal website and the developer taught me how to save a "Sprite" image for buttons. Would that work in Wordpress and the Pagelines Framework? Can you point me to the CSS that I would create to make the hover button happen?
      Website is:
    • How create a link for Callout Header?
      By devaldivia
      Hi all,
      I would like to make my callout header into a link.  How would I do this?
      I'm on Pagelines Framework version 2.3.8.
      Thank you!
    • Background of Highlight, Masthead,Callout and Hero unit Sections
      By Leonardo da Vinci
      Hi Guys,
      May I ask you to how can but ( image or color ) background to Highlight, Masthead,Callout and Hero unit sections.
      Thanks a lot