Archived

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

  • 0

Resolved CiviCRM


Question

Posted · Report post

Hi all,

Help please! I am not trained in CSS or PHP, but I am a quick learner and good at figuring things out-- just a heads up about my skill level . I really need help so I hope I can express the problem well enough (you've already helped me several times recently, so thanks in advance for your patience!). Here is my issue:

I have a plugin called CiviCRM. This plugin is designed to be a "constituent relationship management" system with a database at the back end, so it has front facing forms and pages for donations, events, fund raising campaigns, etc. All data captured flows through to the self-hosted database (same host as WP install) that can be mined for all kinds of useful reports. It's very cool but not well-developed yet for WP-- it was originally developed for Drupal and only recently available as a WP plugin.

Problem: The content from CiviCRM is all messed up (I have "fixed" at least one CiviCRM page using the custom CSS area in the Pagelines dash, but I can't create new styling for every page I create, take a look: http://www.lifechallengesemi.org/donations, my regular site global styling looks like this: http://www.lifechallengesemi.org/about). What I really need is a new template so I can place the CiviCRM content on a page with a plain white background, no header, no footer, no other sections. Ideally, I would be able to assign a special template set up for CiviCRM just like any other template. Is that possible? Can I create a special "plain vanilla" page template to hold CiviCRM content? How do I do this?

BTW: CiviCRM pages are created by dropping in short code for the content. You just click the CiviCRM icon located above the editing window (next to the "add media" icon), select the appropriate content that you already created in CiviCRM from a drop-down menu (donation form, CiviCRM event page, registration page, new member page, etc.) and the content is added via short code to the page. Just like many other plugins work.

Thank you!

Share this post


Link to post
Share on other sites

17 answers to this question

Posted · Report post

Ideally, I would be able to assign a special template set up for CiviCRM just like any other template. Is that possible? Can I create a special "plain vanilla" page template to hold CiviCRM content? How do I do this?

Yes, you can use a different template (Template 1, Template 2, or Template 3) and set that up in Drag & Drop by deactivating the sections you don't want in the page template areas. You can add CiviCRM to a page that uses that template.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks Catrina!

Can I add certain styling to just that template? Can I do it like this in the Custom CSS area: #template 1 .body {background-color:#ffffff;}or how? I really need the background removed and I need other styling to be overridden in the template. The problem is that I have set background colors, etc. in the site options, globally. Can I override those for just one template?

Share this post


Link to post
Share on other sites

Posted · Report post

Or, maybe it should be like this:


body.template-id-3 #page .content, #footer .content { 

  background:#fff;

}

Share this post


Link to post
Share on other sites

Posted · Report post

If you'd like to change the background color for just that one page, you can use the PageLines Meta Settings in the page editor for that page (below the HTML/Text Editor).

Share this post


Link to post
Share on other sites

Posted · Report post

Hmm, I only see Page Content Layout, Page Section Control and Page Background Image settings in the Meta Settings, no body background color settings. Am I missing something? I have globally set background colors in the color control section. I need to override those and I'd like to do it for one page template, if possible, but I'd be satisfied to do it page by page.

Share this post


Link to post
Share on other sites

Posted · Report post

I know I can do it like this in the custom code editor:


body.page-id-3521 #page .content, #footer .content {

  background:#fff;

}

But that's just for the page. I need to do it for a template. Can I specify a template somehow in the css custom code?

Share this post


Link to post
Share on other sites

Posted · Report post

I'm looking at the Color Control section and I see that I can specify "body background" and "content background" (optional). These are global settings. It is the "content background" that needs to change.

Share this post


Link to post
Share on other sites

Posted · Report post

Ah, yes, true. To change content background, you will need to use Custom CSS and include the page ID in the body selector to select that one page you want to change.

Share this post


Link to post
Share on other sites

Posted · Report post

Ok. Don't mean to be a pest, but I know I can set it for one page (see my post above), but can I set it for a template or a range of page types? Is there a template ID that I can specify, like


body.template-id-4 #page .content, #footer .content {

  background:#fff;

}

Note that I have specified "template-id-4" not a page ID. The problem with doing it page by page is that everytime I create an event, a form, a campaign, etc. I would need to add custom code for that page. Cumbersome. Seems like there should be a way to do this for a range of pages, like with a template...

Share this post


Link to post
Share on other sites

Posted · Report post

BTW: I know the code


body.template-id-4 #page .content, #footer .content {

background:#fff;

}

isn't valid. I'm just saying, isn't there a way LIKE THIS to specify a template ID and set the background color for the content? Just hoping...

Share this post


Link to post
Share on other sites

Posted · Report post

If you look at the <body> tag for the Donations page, it has multiple classes:

page page-id-3407 page-template page-template-page-delta-php custom content-shadow responsive pagelines delta full_width[/CODE]

There is no class for specifically Template 4. page-template is there, but that covers all regular pages.

Share this post


Link to post
Share on other sites

Posted · Report post

Actually, your both kind of there.

page-template-page-alpha-php is actually template | 1 ;)

page-template-page-alpha-php => template 1

page-template-page-beta-php => template 2

page-template-page-delta-php => template 3

page-template-page-epsilon-php => template 4

page-template-page-gamma-php => template 5

Share this post


Link to post
Share on other sites

Posted · Report post

This worked!


body.page-template-page-delta-php #page .content, #footer .content {

  background:#fff;

}

I can now set the page template to Template 4 for any new page I create and it will have the white background and any other special css that I create. I couldn't do it before because I didn't know how you specified the template, now I know: body.page-template-page-delta-php Thank you, Catrina!

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks to you too Simon. This solves so many issues for me! Actually, though, doesn't it go like this, alpha, beta, gamma, delta, epsilon for templates 1,2,3 and 4 respectively? (you have alpha, beta, delta, gamma, epsilon :).

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for letting us know. Glad you were able to resolve this.

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks to you too Simon. This solves so many issues for me! Actually, though, doesn't it go like this, alpha, beta, gamma, delta, epsilon for templates 1,2,3 and 4 respectively? (you have alpha, beta, delta, gamma, epsilon :).

Probably, i cant count especially in latin!

Share this post


Link to post
Share on other sites