Include files and images on a page

In order to place images or link to files on any NationBuilder page you first have to upload them to the page.


Upload files

Go to the page where you want to add the file and click on "Files." Any "Files" tab in NationBuilder allows you to select files to upload or drag and drop files from your computer.

website_image_dragdrop.png

Note: Supported file attachments to pages include .ai, .bmp, .csv, .doc, .docx, .eps, .gif, .ico, .ics, .jpeg, .jpg, .json, .pdf, .png, .ppt, .pptx, .svg, .swf, .txt, .xls, .xlsx, .xml, and .zip.


Insert an image or video

When you upload images under the "Files" tab, you still have to insert the images on the page. Go to "Content" and click on the "Insert/edit image" icon_editimage.png icon. You'll get an "Insert/edit image" pop-up on your screen. The second field down is "Image list"; from here, select any image placed in "Files" for this particular page only.

Insert_photo.png

Ideally, you should have the image in the size you want it, prior to uploading it. But, when you click on the "Insert/edit image" icon_editimage.png icon in the toolbar, you can also change the dimensions.

The vertical and horizontal spaces are the amount of space (measured in pixels) you want between the image and anything else on the page. This is usually used to provide space between text in a surrounding article and an image.

When adding an image to the top of your blog (above all blog posts), click on "Files" while editing the blog page and upload your image. Next, click on "Template," and under <div id=“content”>, add <div class=“padbottommore”><img src=“filename.jpg” /></div>. That will add a little padding underneath the image and your first blog post as well.

To add a video, copy and paste the URL and place it in your content area. Embed.ly will automatically post the video in the place of the URL when you publish the page.


Store files, including .pdf and .doc, on a page. Go to your page settings and select "Files" to upload or drag and drop the file(s) from your computer. The control panel will refresh and show the file's name below the button_selectfiles.png button. Right click on your file and select "Copy link address."

Then go back to your page's "Content." Introduce your file with a statement (e.g. Click here to download our fundraising report). Highlight the area of text you want to link the file to. Once you highlight the text, you can click on the "link" icon_link.png icon within the toolbar. You can also link to another page or an external website using this method.

link_to_file.png

In the "Insert/edit link" pop-up box, right click in the "Link URL" field and select "Paste." That will paste the full URL where your file is stored in NationBuilder. In this pop-up box, you can also choose whether the link will open in a new window or the same window. Click the "Insert" button to place the link into your text.

link_to_mp3.png

Click the save_content.png button at the bottom of the content screen.

You can then preview your page to confirm that the link is working properly.

 

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.