How to create and edit webpages

NationBuilder website pages are rich with tools to help you build a beautiful, robust, and interactive site. Learn the details behind your website’s functionality to take full advantage of every page and make the site your own.

Table of Contents


Create a page

To create a new page, go to your website in the control panel and click on +New Page

 

1. Enter a page name and slug. The slug will appear after the base URL of your nation.

2. Select a page type. Each page type comes with specific features. For example, donation pages allow you to link the page to your payment processor. If you are looking to create a page with no specific features, select the “Basic” page type. Learn more about the various page types

3. Decide whether you would like this page to be in your top or supporter navigation

4. Click Create Page Create page.  

If you are using a "basic" page type for your homepage, you can easily add a homepage widget by adding the tag homepage to any page. To remove an excerpt from the homepage, simply remove the tag homepage from the page. Learn more


Every page has a series of tabs that can be found in the page navigation. Each tab of the navigation serves a different purpose.

Tabs

Dashboard: This is the activity stream of your page. Any activity from your page will be listed. This includes when the page was published and any interactions visitors had with the page.

Settings & Action Settings: Use these tabs to configure the primary settings of your page. Details are covered in the sections below.

Subpages: This is where you can access the subpages of the page. For example, your blog posts will be listed as subpages of your blog page. The order that subpages appear can be changed by dragging and dropping the names of the pages.

Comments: This is where you can view all comments on your page. You may also add a comment from this area. This section only appears if you have comments turned on.

Followers: This tab lists every follower of your page. Any person can follow a page on your website. Followers will receive email notifications when comments are left on the page. 

Template & Files: These two sections will help you customize your website. The Template is where you can adjust the basic HTML of your page or insert a widget. Upload images or other media files under Files.

Preview & Live: Click on Preview to view what your page looks like before you publish it. You can see how the page will look when logged in or logged out, and how it looks with different themes. Once the page is published, you will have the option to view the Live page. 


Basic page settings

Every page has a set of basic settings. To edit these settings go to [Page name] > Settings > Page settings. This is a full listing of every setting available on your basic pages. 

 

1. You can edit the name or slug of your page. 

2. You can make any page a subpage of another page. Type the slug of the desired parent page in the provided text box. This allows you to quickly move pages between different sections of your site. For example, you could move event pages between various calendars. 

3. A title will be automatically created using the name of your page and the name of your website. You can edit it at any time. This is the title that will appear in search engines and in browser tabs. 

4. Enter the headline of your page in the Headline text box. This will appear as the title of your page.

Title and headline

5. Add a tag to your page to help categorize your pages. It will live at the bottom of the front facing page. 

Tags on front facing page

6. When you create a page, the default status of the page will be “unlisted.” You can change the status by selecting a status from the drop down menu or publishing the page. 

Status name Description Viewable in search engines
Unlisted Page is not listed on your website, but is accessible if you have the link. Any unlisted page will remain viewable in search engines if it had been published previously.   
Published Page is published and on your site.  √ 
Expired  This only applies to event pages. After the event has passed, the page will disappear from the site but is accessible in the control panel. √ 
Archived  Page is removed from your public site, but is accessible via search. √ 
Deleted  Page is removed from your site and search, but can be accessed in your control panel. Content can only be viewed from when editing the page. Its URL will not work, nor will preview mode.  
Rule violated  Page has been flagged as having violated a rule. Needs to be reviewed. √ 
Hidden  Page is only accessible in your control panel and not available from your site or search. Content can be viewed in preview mode or when editing the page. Its URL will not work.  

7. Select an author for the page by clicking on the dropdown menu. A blank search box will appear. Enter in the name, email, or twitter handle of the person you wish to add as author. The default author is listed as the person who created the page. 

8. If the page is user-submitted, select the appropriate checkbox. User submitted pages are connected to a particular username and when listed as user-submitted the page URL will change to: “mynation.nationbuilder.com/user-submitted-username/slug.” Locate all user-submitted pages by going to Website > Pages > User-submitted.

9. When your page is published, a text box with the publication date will appear. You may adjust the date by typing in a new date and time.

10. Check one, or both, of the navigation checkboxes to include a page in your top navigation, supporter navigation, or both.

Note that supporter navigation will only appear for people who are logged into your nation, meaning they have already activated an account. 

Navigation

11. The Show sidebar checkbox can adjust if the sidebar appears on your page. Unchecking the box will also remove the supporter nav from selected pages.

Basic page with sidebar

12. Check the Show stream checkbox if you want to have an activity stream displaying profiles from your nation. The profiles shown will be those who took an action on your page and what action they took. Each supporter will have the option to not publish her action to the site. This setting only applies to action pages.

13. Check the Allow comments checkbox if you want to allow comments on your page.

14. Limit who can see a page on your website based on the person’s access level. A person can see all pages that are less restrictive than her own. So, a supporter with an active membership on her profile will be able to view pages open to members, logged in users, and anyone.

15. Check the Show social slider checkbox if you want to have a slider displaying profiles from your nation. The profiles shown will be those who took an action on your page. Each supporter will have the option to not publish her action to the site. This setting only applies to action pages.

16. Any page of your website can be the homepage or a splash page. Only one page can act as the homepage at a given time. Similarly, only one page can act as a splash page. 

Homepage and splash page

17. You may assign default action pages for your nation. This includes a default donation, invoices, volunteer, and signup pages. This setting only applies to action pages.

Default page

 

Don’t forget to click Save page Save page to save your changes. Delete your page by clicking Delete page Delete page.


Action settings

An “action page” is a website page where your visitor is asked to take an action like sign a petition, make a donation, or RSVP to an event. Every action page has settings that are activated when a visitor takes an action on your site. To edit these settings go to [Page name] > Settings > [Action] Settings. These settings are always located the third tab to the right. 

The action pages available include: signup, user-submitted blog posts (within blog settings), user-submitted events (within calendar settings), donation, endorsement, feedback, petition, survey, vote pledge, volunteer signup, invoice, and moneybomb.

1. Choose to ask for phone number and address or require entry of phone number and address, or not ask for them at all (uncheck all boxes). 

2. Automatically add tags to any person who takes an action on your website. For example, track attendance by adding the tag “RSVP - Charity Drive - Event date” to anyone who RSVPs on your event page. These tags are completely separate from page tags. Enter the name of the tag in the provided text box. Separate multiple tags with commas.

3. Assign a point person when a visitor takes an action on your website. A point person is responsible for that visitor’s relationship with your organization. For example, your volunteer coordinator would be an excellent point person for people who sign up on your volunteer website page. Any control panel user can be listed as a point person. To add a point person to a website page, select the control panel user’s name from the provided drop down menu. Note that if a visitor already has a point person, she will not be assigned a new one when she takes a website action.

4. Grant membership for action taken. Since every action page can grant membership when the action is taken, both unpaid and paid membership can be automatically added to supporters. First, decide which membership type to assign. If the membership should never expire, do not set an expiration date. Otherwise, set an expiration date that is relative to the date the supporter takes the action. 

Please note: membership cannot be granted on invoice pages or moneybomb pages.

5. Add a supporter to a path. This will allow you to build and track the relationship with your supporters. Check the “Add to path” checkbox and add the appropriate information for path type, path point person, step, step point person, and step due date.

Please note: a supporter cannot be added to a path for pledging on a moneybomb page.

6. You can select what page a supporter lands on after she takes an action on your website. This will create action chains for supporters take multiple actions in a row. For example, when someone signs your petition, you can have them land on your donation page. Enter the slug of the page you want to have your supporters land on in the text box.


Edit your content

There are three options to edit the content of your website page: 

1. Every page has a content editor where you can enter and format your content.

If you are entering quite a bit of content, note that you can click the arrows button for full screen mode. This will allow the editing tools to stick, so they will be within easy access of the content you're currently editing, instead of having to constantly scroll to the top of the page.

You can set headings and text styles by clicking on the Normal dropdown menu.

You can also Bold, Italicize, Underline, and color text, as well as align text to Left/Center/Right.

Easily add bulleted or numbered lists by clicking the bullet 123 buttons. You can also increase and decrease indents .

 

 

You can insert links to other websites, posts, etc. by highlighting text and clicking on the chain button. You can remove them via the broken chain link button.

There are also Undo/Redo buttons, as well as the ability to clear text formatting .

 

2. Edit in-line formatting using the HTML editor. 

HTML source editor

new_wysiwyg_source_code.png

 

3. Use CSS to define the style of the page in Template. Template is where you want to place iFrame, Javascript or other code that you want to use within that page only. In order to access the page template, click on the Create a custom template button_create_custom_template.png button.

Note: If you are using a specific theme and not a NationBuilder public theme, you can customize for the entire theme by clicking on here. When you do, you will be redirected to Website > Theme > Current custom theme > Files where you can make your changes.

custom_create_template_4.png

When you begin to edit the specific page template, the changes you make will override the theme level template and only affect this page.

custom_template_code.png

Once you make the change, scroll to the bottom of the page and you can save the drafted changes or save and publish the changes. You can also discard the drafted changes, reverting the template to its previous state or choose to delete the custom template, restoring the theme level template.

If you want to strip out the theme layout template, but keep the content of the page, check off the option to "Ignore [theme name] layout template."

website_template_change.png

More information on editing the page template is covered in our theme documentation.


Add images and video

To insert an image on your page:

1.  Click on the Insert/edit image icon.

2.Click Upload and insert (or drop) the image. 

3. (Optional) You may edit the image formatting including size, alignment, border, and vertical or horizontal space in the Advanced tab. You can also click/drag to resize the image once you've uploaded it.

4. Click Ok. Your image should appear in your content editor. You can always open the editing menu by clicking on the image and then clicking on the Insert image button again.

Don’t forget to click Save Content Save content at the bottom of the page. 

Learn more about including images and other media files in your page.

 

Note that the content editor is integrated with Embed.ly so videos from YouTube, Vimeo, Hulu, and other sites will automatically display when added to the page.

To add the video, copy and paste the URL of the video into your content editor. The URL must be on its own line with nothing in the lines immediately above or below. Embed.ly will automatically post the video in the place of the URL when you publish the page.

Youtube link

Remember to click Save Content Save content after you paste the link.

You can view all embedded videos at the bottom of the page under “Content URLs found.”

Content URL found

Note that the Embed.ly does not work with “youtu.be” links. If you have one of these links, we recommend that you return to Youtube to get the more traditional “.com” URL. You can always embed the video using an iframe code provided by Youtube. You will insert the iframe in the Template of the page.

Youtube iframe


Add a table

1. To add a table to your content, click on the table  button on the content editor toolbar. 

 

2. Hover over Table and select the size of the table by scrolling the mouse over the boxes indicating the amount of columns and rows you want. Click when you've got the dimensions you want and the table will appear in the content box.

3. Enter your content and format it as you see fit. Note the pop up box with buttons to expand, delete, insert rows before/after, insert columns before/after, and delete columns. 


Configure featured content sliders

Sharing your site on social media 

How to create a website theme with NationBuilder

How to add a widget to your webpage

How to delete a page

NationBuilder public theme guidelines

How do I adjust text sizes in the WYSIWYG editor?

Inserting images with text wraparound option is gone

 

If you’re unclear on how this feature works, please ask a question. If you would like to see changes to this feature, please submit a suggestion.