#Blocks #Content #Engagement

Block: Timeline

Add timelines with the P4 design to display activities and milestones

Learn more

New block available in Posts too, not only Pages: the Timeline block. All password-protected content stopped displaying the excerpt when shared in Skype (IM) or Twitter (Social Media). And the team continued doing preparatory work for the soon-to-be-launched P4CG (P4 Campaign Generator).

Release v1.63 (06/8/2019)

UX Improvements 🌈

  • PLANET-3793Blocks in Posts: Timeline
    • The Timeline is another block available in posts from now on. The width of the image has been set up so that it doesn’t take up more than half of the content window.
  • PLANET-3809Password-protected content have the excerpt visible when shared in Skype (IM) or Twitter (Social Media)
    • Password-protected content should not have the excerpt visible when shared in Instant Messaging apps (e.g. Skype or Rocketchat) or Social Media (Facebook). This has been fixed now, so it does not display any information from the password-protected content.

P4 Campaign Generator (P4CG) preparatory work ✊

  • PLANET-3816 Hide title section
    • For CPP pages, there should be a way to not display the title (“Demo Title” + green gradient background). P4CG doesn’t need to show title blocks, as titles are more often than not shown in the header block. However, title blocks are a requirement for the WP system otherwise you can’t find the pages. So the developer creates the ability to hide the title block from the user whilst still having the title in the system.

Before

After

  • PLANET-3817Add white color to customiser for Minimal navigation bar & Footer background color
    • Users should be able to have a white (#ffffff) background as an option for both Minimal navigation bar and Footer. The white color has been added as an option to choose in CPP customizer.
  • PLANET-3825Remove compulsory state for column block title.
    • The title for the Column header within the ‘Images’ style of the Columns block was compulsory. The compulsory state has been changed with this release.

Before

  • PLANET-3824 Rename elements in customizer to avoid confusion and where ever possible, provide instruction text
    • Some titles/elements needed to be renamed in CPP builder interface to avoid confusion and wherever possible, instruction text had to be provided.
    • You can see below the changes that have been done (current name > new name):
      • Navigation Colour > Navigation Background Colour
      • Header Color > Header Text Color
      • Secondary Button Colour > Secondary Button Colour and Link Text Colour
  • PLANET-3822EN block add styling to Petition Counter number
    • As a user, I would like the strapline to immediately follow the Petition Counter number. So that I can create a dynamic sentence.For example –  478 people have signed the petition.

Before

After

  • PLANET-3820Remove link from heading text Columns: Images style
    • The links from the column headers in the “Images” layout version of the Columns block have been removed.
  • PLANET-3819 – In-block styling for ‘Full Width’ Carousel block
    • Editors are now able to apply styling to the text within the ‘Full Width’ Carousel block. Styling includes changing the type size, colour and vertical spacing. Changes include:
      • selector for type size
      • selector for colour
      • vertical spacing automatically based on the type size
  • PLANET-3818In-block styling for EN Form block
    • Editors are now able to apply styling to the text within the EN Form block. Styling includes changing the type size, colour and vertical spacing. Changes include:
      • selector for type size
      • selector for colour
      • vertical spacing automatically based on the type size
  • PLANET-3792  – Add new Red/Orange for Oil campaign
    • The oil campaign has replaced its green/blue colour palette with red/orange. This new color set has to be added to the colour for the oil campaign.

Engaging Networks form improvements  📣

  • PLANET-3849EN Form: sort alphabetically Fields/Question/opt-in lists and add color-code for non-tagged ones
    •  The Fields/Question/opti-n lists inside the EN Form page are now sorted alphabetically and the ‘Non-tagged’ fields are listed *after all the normal ones*. Really helpful for editors of NROs with many many fields and questions.

Bug Fixes 🐛

  • PLANET-3781Gallery Block: Grid style focus point not working when used in Posts
    • When used in Posts, and on all screen sizes, the Grid Style is not displaying the focus point as set in the back end. This has now been fixed.

Backend

Front end

  • PLANET-3808Password-protected content not working on evergreen page template
    • Password-protected content seem to work fine for Pages using the Default template and for Posts, but not for Pages using the Evergreen template. No password is prompted when accessing pages using the Evergreen template. This has been fixed now.
  • PLANET-3837Plan Du Site (French Sitemap) Headers are in English
    • The Headers in the Sitemap were in English and all the pages were being displayed in French for the French version of the MENA site.
    • A super easy fix was pushed and now the Sitemap shows the correct version of language: the French language short name was added as `fr_FR` in WPML. To fix the issue we change it to `fr_CA` at `WPML >> Languages >> Edit languages`.

Before

After

  • PLANET-3841Columns block: font (and size) changing when adding paragraph in block descriptions
    • When adding spaces in Columns block descriptions the first paragraph is ok, but the following ones were different font sizes, which should not be happening.

Geek alert 🤖

  • PLANET-3701Include predefined set for font sizes in CSS Styleguide
    • Define specific proportional values for font sizes and stick to them, instead of using arbitrary values. This will increase consistency and maintainability.
  • PLANET-3638 JS: Use the same closure method for all js code
    • Use the same closure everywhere in our JS codebase. It could be document.ready or a jQuery closure.
  • PLANET-3863 – Upload Cookie’s Bar background image to live environment
    • Upload an image  to the Planet 4 Master Theme, in order to be used on the Cookies Bar A/B Test – via Google Optimize.
  • PLANET-3864Install an anti-flicker snippet on all P4 websites
    • The most effective way to mitigate page flicker when loading Optimize is to temporarily hide the page while the Optimize container loads. This is accomplished by adding the anti-flicker snippet as the first script on Planet 4 pages.
    • The following tasks have been done:
      • Install the anti-flickering snippet in all Planet 4 websites. The code should use the same GTM ID that is input by the web admins on the P4 Settings.
      • Create a field on the P4 Settings where the web admin could allow or block the anti-flickering snippet.