Jump to content


Photo
- - - - -
Resolved

CiviCRM

Custom Template

This topic has been archived. This means that you cannot reply to this topic.
17 replies to this topic

#1 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 03:56 PM

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:

Please Login or Register to see this Hidden Content

, my regular site global styling looks like this:

Please Login or Register to see this Hidden Content

). 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!

#2 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 11 October 2012 - 04:34 PM

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.

#3 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 05:11 PM

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?

#4 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 05:18 PM

Or, maybe it should be like this:

Please Login or Register to see this Hidden Content



#5 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 11 October 2012 - 05:25 PM

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).

#6 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 05:52 PM

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.

#7 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 05:58 PM

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

Please Login or Register to see this Hidden Content


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?

#8 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 06:17 PM

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.

#9 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 11 October 2012 - 06:29 PM

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.

#10 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 06:42 PM

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

Please Login or Register to see this Hidden Content

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...

#11 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 06:55 PM

BTW: I know the code

Please Login or Register to see this Hidden Content

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...

#12 catrina

catrina

    Advocate

  • Members
  • 12345 posts

Posted 11 October 2012 - 06:58 PM

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

Please Login or Register to see this Hidden Content


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

#13 Simon_P

Simon_P

    Messer

  • Administrators



  • 8388607 posts

Posted 11 October 2012 - 07:05 PM

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

#14 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 07:24 PM

This worked!

Please Login or Register to see this Hidden Content


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!

#15 eidoander

eidoander

    Member

  • Members
  • 25 posts

Posted 11 October 2012 - 07:31 PM

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 :).

#16 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts

Posted 11 October 2012 - 09:29 PM

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

#17 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts

Posted 11 October 2012 - 09:30 PM

The topic was marked as resolved.

#18 Simon_P

Simon_P

    Messer

  • Administrators



  • 8388607 posts

Posted 11 October 2012 - 09:48 PM

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!