Collection page - set up requirements

The template

A screenshot of an entire template collection page including all blocks: header, information, optional mapping/geospatial, open activities, highlights, closed activities, and footer. The example page is for activities related to parking and traffic.

The basics

1. URL

Please choose the URL of your page. This will be your Citizen Space site URL followed by the name of the page. The URL needs to be lower case. For example, https://yoursite.citizenspace.com/2040-plan

2. Page title

You will need to provide the name of the page, which will appear as a link in the top navigation of your Citizen Space homepage. For example, "Arlen Hill 2040".

3. Page theme colour

Please provide the hex code for the main featured colour you'd like to use for this page. We may use shades of this colour to improve accessibility, and for design purposes.

Header

Header block with labelled parts. 4 is the hero image or colour. 5 is the title of the page. 5a is the optional heading.

4. Hero colour or image

You can choose to have this section as a solid colour (the theme colour you chose), an image banner, or a solid colour with an image in a strip below the header block. For either of the image options, please send no less than three images for us to choose from. Images must be 3000px wide, 1000px high, with a resolution of at least 72dpi. We ask this as some images don’t work on all screen sizes (mobile/desktop) so sending a selection reduces the need for back-and-forth.

5. Title

Keep this short and sweet. You have the option to add a subhead (see below).

5a. Optional subhead

This will sit within the header, so to avoid a header that dominates the whole page, try and keep it short - try one or two lines, or ~50 words or less. (Remember you can add more copy in the info block below.) People skim read digital content, so we recommend using this line to explain what this page is for or the main thing you want visitors to do.

Information block

The information block with labelled parts. 6 is where supporting informative text goes. 6a is an optional section header. 6b is an optional image or video. 6c is an optional call to action button linking out to further information.

6. Informative text

Here’s where you can provide supporting information and context. You can choose either a single column (full width text), or a two-column layout, with one column for text and the other for an image or a video. For a single column layout, we suggest two paragraphs, or about 150 words. For a text-and-image layout, we suggest about 50-70 words. Video can be a great way to provide extra information here.

6a. Optional section header

A short title can add some extra context

6b. Optional image or video

The standard image size here is 6:4, which translates to landscape video orientation, but you can also use portrait, if e.g. you’ve got a video filmed on a smartphone. Image size needs to be minimum 1200px and resolution must be minimum 72dpi. Videos must be hosted on YouTube or Vimeo.

6c. Optional button call-to-action (CTA)

You can link out to something underneath this section using a button. If there’s an important supporting document, like a proposal overview, or a section on your corporate website about your scheme/project/group, this is a good place to link out to further information.

[Optional] Mapping/geospatial block

Optional mapping/geospatial block is labelled with 7 the geospatial map. 8 is the title and an optional subheading.

If you have Citizen Space Geospatial enabled and are running a lot of activities with a place-based element - for example, active travel, school streets, urban planning - you can include an interactive map on your page showing where changes are being proposed or implemented.

This map will pull from an activity in your site. If you don’t have a mapping activity, a bespoke one will need to be created. This activity can be private/won’t appear on your homepage if you don’t want it to.

7. Map data

Please provide all geospatial data in either Shapefile or GeoJSON format. This means all layers, titles for the key, and attributes for each later. Please also let us know in which order you’d like the layers to display.

8. Title and subhead

Please provide an informative title and subhead if required. With a map it’s useful to have a line or two explaining what it’s showing.

Open activities block

Activities block is labelled with 9 the heading and an optional subheading. 10 represents the listing type.

9. Activities block title & subhead

Please let us know if you’d like to change the text here.

10. Listing type - a curated or filtered list

Please let us know which listing you’d like. Your Customer Success Manager will discuss this with you in more detail during your set up call. Both options allow you to add a specific set of activities to your page.

Here are our articles on the two types:

Please also let us know which layout you’d like in this section, such as how many activities you want in each row. View the different layout options here.

Highlights block

Highlights block example with labels. 11 is for the Heading and optional subheading. 12 for the block headings (3 blocks in a row) and 13 for the content within the block.

This is where you can pull out key information, decisions you’ve taken, or anything you really want to draw attention to. You can also link to external sites using buttons in these blocks if you wish. Keep in mind these sections are meant to be a place to display headline information, so we can’t fit loads of text in here.

11. Highlights block header & subheader

Please provide a title for this section. You can also provide us with 1-2 lines of summary text if you'd like.

12. Highlights block headings

Please provide a title for each individual highlight card. Please keep titles short so that they can fit on one line; about 5 words.

13. Highlights block content

Please provide us with the content for each card. If text only: copy for each card should be between 50-100 words. If you’d like images and/or button links, please provide us with the URL you’d like, and any images or icons (minimum resolution 72dpi).

Closed activities block

Activities block is labelled with 14 the heading and an optional subheading. 15 represents the listing type.

14. Activities block title & subhead

Please let us know what text you’d like here.

15. Listing type - a curated or filtered list

Please let us know which listing you’d like. Your Customer Success Manager will discuss this with you in more detail during your set up call. Both options allow you to add a specific set of activities to your page.

Here are our articles on the two types:

Please also let us know which layout you’d like in this section, such as how many activities you want in each row. View the different layout options here.

Footer block which is labelled 16, with optional call to action button.

16. Footer

You can have a footer that’s just an image, or you can have a custom Call to Action.

If you’d like an image, please send no less than three images for us to choose from. Images must be min 2000 pixels wide with a resolution of at least 72dpi.

If you’d like to link out to something - for example, contact details or mailing list signup - please provide the header and subheader text (no more than one line each) you’d like, the URL for the button to link out to, and the button text.

When you've got all of these deployment requirements, send them over to your Customer Success Manager. You will agree a deployment date with them, and your new page will be set up on this date.