Answers.Body: <p>The template would not have anything to do with the styling to make it look like the rest of your website. Styling is in the CSS files. If you do not want to see the header, etc. just use display:none in your CSS file.</p>
  
  <p>But... Are you talking about not seeing the embedded website header, nav, etc? If so, that has nothing to do with Civi templates. If this is case, the simple fix is also CSS display:none</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-16T09:04:33.150Z
Answers.Text: Thank you.
  And which css file should I edit for that?
Answers.UserDisplayName: Elad
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-16T23:17:02.687Z
Answers.Text: You can go to Administration > System Settings > Resources URL to see where your instance is pointing to for the CSS. You can then follow that path to edit the CSS or create your one path to a file of your choice.
Answers.UserDisplayName: Iowa Boy
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-18T18:52:16.353Z
Answers.Text: Thank you.
  How do I associate a specific custom css file with a specific contribution page? I don't want to change the general css for all pages.
Answers.UserDisplayName: Elad
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-18T22:58:27.980Z
Answers.Text: You still put the CSS in the same file as the rest of your CSS, but be sure to include the page id and/or Civi Form Id in the CSS selector for these items so they do not impact other parts of your site. For me, the simplest way to find the right selector and CSS is to use Google inspector. But most browsers have an inspector.
Answers.UserDisplayName: Iowa Boy
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-19T10:35:21.293Z
Answers.Text: Thank you, but still it not clear. I don't want to load this custom css for all pages (like putting it in the Custom CSS in Resource URL), because this css will override styles for the whole website. And I can't specify the css selector to be specific to this page, because I need to style core elements like the header, footer, etc.
  
  I am looking for a way to include a custom css file for a specific contribution page, nothing else.
Answers.UserDisplayName: Elad
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-15T02:43:11.293Z
Answers.LastActivityDate: 2017-10-15T02:43:11.293Z
Answers.UserDisplayName: Iowa Boy
Answers.Body: <p>Got it.
  In the Contribution page > Title tab -> Introductory Message
  I added in the source view a 'link' tag to my custom css. This way it is only loaded from this specific contribution page.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2017-10-19T11:08:35.543Z
Answers.LastActivityDate: 2017-10-19T11:08:35.543Z
Answers.UserDisplayName: Elad
Body: <p>I am using CiviCRM 4.7.24 on Drupal 7.56.</p>
  
  <p>I want to embed in a different website an iframe that shows a simple contribution form of CiviContribute, and styles it according to the website.</p>
  
  <p>I would like to create a simple, blank, template that only shows the donation amount and email address, and submit button. Without any Civi styles like the header, the navigation, etc.
  And I can't find which template is the right one to edit.</p>
  
  <p>The page I would like to edit is:
  <em>domain</em>/en/civicrm/contribute/transact?reset=1&amp;id=2</p>
  
  <p>How can I locate the relevant template? Is there already a clean blank contribution template I could use?</p>
  
Tags: <civicontribute>
Title: Making a simple contribution page template
ThreadText: # Making a simple contribution page template
  
  (Asked by: username_0 on 2017-10-12)
  
  I am using CiviCRM 4.7.24 on Drupal 7.56.
  
  I want to embed in a different website an iframe that shows a simple contribution form of CiviContribute, and styles it according to the website.
  
  I would like to create a simple, blank, template that only shows the donation amount and email address, and submit button. Without any Civi styles like the header, the navigation, etc.
  And I can't find which template is the right one to edit.
  
  The page I would like to edit is:
  *domain*/en/civicrm/contribute/transact?reset=1&id=2
  
  How can I locate the relevant template? Is there already a clean blank contribution template I could use?
  
  **Tags:** civicontribute
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_1 on 2017-10-15. Score: 1 | Accepted answer
  
  The template would not have anything to do with the styling to make it look like the rest of your website. Styling is in the CSS files. If you do not want to see the header, etc. just use display:none in your CSS file.
  
  But... Are you talking about not seeing the embedded website header, nav, etc? If so, that has nothing to do with Civi templates. If this is case, the simple fix is also CSS display:none
  
  > **Comments:**
  > **username_0**: Thank you. And which css file should I edit for that?  
  > **username_1**: You can go to Administration > System Settings > Resources URL to see where your instance is pointing to for the CSS. You can then follow that path to edit the CSS or create your one path to a file of your choice.  
  > **username_0**: Thank you. How do I associate a specific custom css file with a specific contribution page? I don't want to change the general css for all pages.  
  > **username_1**: You still put the CSS in the same file as the rest of your CSS, but be sure to include the page id and/or Civi Form Id in the CSS selector for these items so they do not impact other parts of your site. For me, the simplest way to find the right selector and CSS is to use Google inspector. But most browsers have an inspector.  
  > **username_0**: Thank you, but still it not clear. I don't want to load this custom css for all pages (like putting it in the Custom CSS in Resource URL), because this css will override styles for the whole website. And I can't specify the css selector to be specific to this page, because I need to style core elements like the header, footer, etc.  I am looking for a way to include a custom css file for a specific contribution page, nothing else.  
  
  ---
  
  ### Answer by username_0 on 2017-10-19. Score: 1
  
  Got it.
  In the Contribution page > Title tab -> Introductory Message
  I added in the source view a 'link' tag to my custom css. This way it is only loaded from this specific contribution page.
  
  
  ---
  
  