With the Content Builder you can customize project descriptions (not folder descriptions) incredibly easily with a drag-and-drop interface to incorporate flexible layouts, multimedia content, and third-party embeds to make the engagement process interactive and immersive. With the content builder you can also add presentation slides, co-edit on documents, or even do a quick survey before the engagement process, give news updates, and so many more.
Enabling the Content Builder
To use the Content Builder in your project, go to the back-end of your project > "Project settings" on the top right > "Description" tab > switch "Use content builder for description" on > click on the link "Edit description in content builder". You'll then be directed to a completely different page: the Content Builder.
Using Sections, Layout, and Content
On the left of the Content Builder, you'll see a menu that consists of 3 parts: sections, layout, and content. In each of these parts, there are items you can drag and drop to the middle of the screen to use them. The differences between them are explained in detail below.
If you want to edit a part of a section you just dragged and dropped to use, for instance, to add an image or edit the text, click on the part you want to edit - the editor will pop up on the right-hand side of the screen.
You can also adjust how the different blocks of a section are arranged, or if no longer needed, you can easily delete the block.
Using sections
Sections are templated options already designed for you. Sections that are available: 'Image & Text Cards' and 'Info & accordions'. The section "Image & text cards" consist of 3 items where you can add an image and a description. This option can be used to show different designs for instance where you want to give some more information.
The section "Info and accordions" consists of the main description part and 3 text fields that are designed as a drop-down menu or accordion. This option can be particularly useful if you want to describe different parts of a project
When you picked one of the two options, you can still edit them by changing the layout or adding other content.
The accordion editor unfortunately doesn't support images or files today. This means you can only add text to accordions.
Customising the Participation box
Every project starts with the "Participation box" (formerly "About box"). This section displays two important elements:
Actions available to take for participants (taking a survey, submitting an input, viewing current inputs...) and other important information (events).
A list of the participants of the project. You can easily hide these numbers from the widget within the Content Builder.
In order to see and customise the Participation Widget you need to enable the Content Builder for your project description first.
Choosing the desired layout
If you use the Content Builder and want to start from scratch, you start by dragging different columns to the middle of the screen. You can choose between 2 or 3 columns and if you want multiple rows of columns, you can add white space to make sure the alignment of the rows is exactly how you want it. You can even drag and drop columns into a column 🤯
Adding and editing content
Once you have decided how many columns you want in your project description and dragged them into place, you can start with filling up the columns. There are a couple of options you can choose to create content with:
Text - for textual descriptions of your project
Image - for visual descriptions of your project
Embed - to embed third-party services into your project
About box - provides the details of the project such as dates, participants, etc.
Accordion - expandable content section to add a large amount of content
Embed offers numerous opportunities for you to connect with third-party service providers such as YouTube, Microsoft PowerPoint, Tableau, Konveio and so many more.
Tip: we currently don't support image resizing (images will automatically fill the space they are in), so in order to make images smaller you can put the image within a column layout.
Embedding elements in the Content Builder
To make your project more engaging and informative for your audience you can embed third-party elements like videos, presentations, social posts, surveys, etc. into your project description.
The content builder supports a wide range of embeddable content options. When in the Content Builder, simply click on the code component <Embed> on the left side of the application.
Adding the embed url in the <embed> field
Get the embed URL link from your provider > please, see the instructions per provide in the section below
Copy and paste it into the content builder <embed> field
You are good to go!
Pro tip: Always test if your embedded URL is working, by opening an incognito/private window to verify public access.
Obtaining the embed URL link from your third-party provider
Our embed functionality requires a URL link. Below, you will find a comprehensive list of the third-party tools and services that are part of the whitelist of allowed domains that can be embedded.
In general most embed links will be quite long and start with "<iframe = src=". You will need to delete most of the code in these long embed links and only copy the https part.
For example in the embed link below only the https part should be copied into the platform:
<iframe width="560" height="315" src="https://www.youtube.com/embed/22pTFKIHEqo?si=FZJ5yH84gBT5Xzn7" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
Embedding surveys
It will require you to copy and paste the default sharing link into the embed field on the content builder. Among the domains allowed for survey embedding, we find:
Typeform: You will need to copy the default sharing link and paste it into the embed field on the content builder.
SurveyMonkey: You will need to copy the default sharing link and paste it into the embed field on the content builder.
Enalyzer: You will need to copy the default sharing link and paste it into the embed field on the content builder.
Qualtrics: You will need to copy the default sharing link and paste it into the embed field on the content builder.
SmartSurvey: You will need to copy the default sharing link and paste it into the embed field on the content builder.
Snap surveys: You will need to copy the default sharing link and paste it into the embed field on the content builder.
SurveyXact: You will need to copy the default sharing link and paste it into the embed field on the content builder.
Embedding documents
Google Docs will require you copy and paste the default sharing link into the embed field on the content builder.
Google Slides will require you copy and paste the default sharing link into the embed field on the content builder.
Google Sheets will require you copy and paste the default sharing link into the embed field on the content builder.
PDFs require you simply copy the default URL and paste it into the embed field on the content builder.
Slideshare
In your Slideshare, first, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL (at the bottom of the screenshot) into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from " width=).
Microsoft (Word/Excel/Powerpoint):
To be able to access the embed function the file needs to exist online. Therefore you'll need to upload your presentation to OneDrive to make it accessible online. Then open the OneDrive file in (for instance) PowerPoint for the web and choose File>Share>Embed to generate an embed code.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text
<iframe = src=
" and deleting the last part of the link (starting from "width=)
.
Konveio will require you copy and paste the default sharing link into the embed field on the content builder.
Important: you will need to edit this link slightly by deleting the first part of the link that includes the text <iframe = ... src=“ and deleting the last part of the link (starting from " frameborder=)
Embedding maps
Google maps: First, click on the “Share” icon. You will be directed to a form that contains the embed map code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from " width=).
Arcgis: You will need to copy the default sharing link and paste it into the embed field on the content builder. The URL should like similar to this: https://www.arcgis.com/apps/View/index.html?appid=6b6a075eca8d4899958fb273710a6806
You can find more information about the right URL from Arcgis here.
Embedding data visualizations
Tableau: Go to the view in Tableau Public. Select the option "Share" at the bottom of the view and copy the URL link provided in the embed section. When embedding Tableau Public into the content builder, the URL must include the following parameters:
showVizHome=no
embed=true
Google Data Studio: first, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from " width=).
Embedding social posts
Facebook: first, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from " width=).
Eventbrite: will require you copy and paste the default sharing link into the embed field on the content builder.
Unfortunately, neither Tweets nor Instagram posts can be embedded. This has to do with those companies’ policies and is not something we have any control over.
Embedding videos
You can embed a clickable video in your content builder by clicking the embed icon in the editor and pasting the URL link of the video. Make sure to use the correct url, which can differ per video tool. Here's some noteworthy info:
Youtube: first, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from "title=).
Vimeo: first, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code. The embed URL should contain the 'video ID' and would look like this: https://player.vimeo.com/video/<video_id>.
Daily Motion: First, click on the “Share” icon. You will be directed to a form that contains the embed code you need to extract the URL link from.
Important: you cannot simply copy and paste the ‘Link’ URL into the content builder, you must copy the URL from the embed code, which will require you to edit this link slightly by deleting the first part of the link that includes the text <iframe = src=" and deleting the last part of the link (starting from " width=).
Dreambroker: First, copy the default sharing link. For Dreambroker embed links, you will need to manually add the word iframe into the URL you are about to paste into the embed field on the content builder
<https://www.dreambroker.com/channel/3lkvmi5h/33jxadml> would need to be edited to: <https://www.dreambroker.com/channel/3lkvmi5h/iframe/33jxadml>
Wistia will require you copy and paste the default sharing link into the embed field on the content builder.
Need more help or support? Contact our Support Team via the chat bubble in the admin panel.