The page design and diagrams below will help you get used to what pieces of content are blocks. We’ve done this because once the blocks are displayed on a finish page, it’s hard to see that they’re blocks at all.

The Home, Act and Explore page have unique and common blocks. These diagrams show how each of these pages is constructed.


Issue and Take Action pages layout built with the right blocks




P4 Home, Act, Explore, Issues, Take Action, Tag and Evergreen (Privacy, Copyright..) are pages. Using blocks and dynamic content, pages can be created in a multitude of ways, leveraging unique functionalities.

How Navigation works


P4 Posts are used to display static content, such as news, stories and publications. These are standard WordPress posts, and leverage on Tags, types and Categories to appear across the site.

Posts VS Pages

Learn about blocks

#Blocks #Content #Visuals Block: Group

Create a ‘placeholder’ and add other blocks inside it, then customize it

Learn more
#Blocks #Content #Engagement Block: Accordion

Expand or collapse content to improve user experience by preventing endless scrolling.

Learn more
#Blocks #Content Block: Spreadsheet + Table

Create in-page tables or embed responsive Google Spreadsheets in your P4 posts, pages and campaigns.

Learn more
#Blocks #Content #Engagement #Visuals Block: Social Media Cards

Use images and short texts for a one-click sharing pledges and call to action!

Learn more
#Blocks #Content #Engagement Block: Take Action Boxout

Include Call To Actions within posts and pages through a dynamic floating card!

Learn more
#Blocks #Content #Engagement Block: Timeline

Add timelines with the P4 design to display activities and milestones

Learn more
#Blocks #Data-Analytics #Engagement Block: Form (Engaging Networks)

Insert Call to Action in your P4 pages and send data to your Engaging Networks account

Learn more
#Blocks #Visuals Block: Gallery

Maximise visual impact combining images in grids, 3 columns or carousel

Learn more
#Blocks #Content #Engagement Block: Counter

Show supporters how many signatures are collected at a specific point!

Learn more
#Blocks #Data-Analytics #Setup Block: Cookies

Allow users to have complete control over which cookies they accept in your P4 sites. 

Learn more
#Blocks #Content Block: Media

Insert Videos in your pages right from YouTube or the Greenpeace Media Library!

Learn more
#Blocks #Content #Engagement Block: Happy Point

Embed (via iFrame) a “Subscribe” or engagement form in Planet 4 pages

Learn more
#Blocks #Content #Visuals Block: Columns (& tasks)

Pull out static content (with or without images) or take action tasks in columns.

Learn more
#Blocks #Content Block: Covers

Dynamically pull out posts or Take Action pages in a consistent three or four column layout!

Learn more
#Blocks #Content Block: Articles

Pull out dynamically your posts, deciding by which type, Tag or Category!

Learn more
#Blocks #Visuals Block: Split Two Columns

Combine Categories (Issues) and #Tags in 2 columns with diagonals

Learn more
#Blocks #Content #Visuals Block: Carousel Header

Display several photos on a scrolling carousel for the home page

Learn more
#Blocks #Content Block: submenu

Insert a dynamic “Table of content” to facilitate consumption of long pages.

Learn more




Links & Resources