PLP Creation Guide

Quick Links

Global PLP Settings

When the PLP Plugin is enabled initially, there are a few global settings to apply. In the WordPress dashboard, navigate to:a

Options > Settings > PLP Settings to apply these settings:

  • Notices: ‘Manage per page’ – this should appear as the default setting
  • PLP Background Color: set to white

Global Footer Settings

Setting up the global settings differs between single program site and multi-program site:

Single Program Site

  1. Fill in ALL of the fields within the global PLP footer settings
    1. Make sure to check off ‘Add copyright symbol and current year to copyright notice’ (This will add © 2023 to every footer)
  2. Go through the individual pages and completely remove the custom footer block.

Umbrella / Multi Program Site (if footer content differs – numbers, copyright, Short name, etc.)

  1. Fill in the “global” fields (the ones that won’t change program to program
    1. University Name
    2. Make sure to check off ‘Add copyright symbol and current year to copyright notice’ (This will add © 2023 to every footer)
    3. Legal links
  2. On the pages, KEEP the Custom Footer.
    1. Remove the “© 2022” from the custom footers as that will be duplicated.
  3. University Short Name, Telephone, and Copyright language don’t need to be touched. Footer will pull from the custom footer which is what we want for these.
    1. You CAN delete the “University Name” and the Legal Links as those will be pulled in from the global footer, but it is not necessary.

Yoast SEO Settings for PLPs

Navigate to:

SEO > Search Appearance > Content Types > Paid Landing Pages (PLPS) to apply these settings:

  • Set ‘Show Paid Landing Pages in search results?’ to Off. PLPs are already no-index’d by default, but having the Yoast SEO page settings reflect this will avoid confusion.
  • Delete the purple ‘Site Title’ variable
  • Replace the ‘Site Title’ variable with the Site Title manually entered for the Page content type.

Anatomy of a WordPress PLP

Below is a breakdown of the block structure used for a typical PLP built with the new Paid Landing Page Content Type:

  • Header Override Block – to remove logo links and hide header for desktop/tablet
  • Hero Block – PLP Variation
  • Body content blocks as needed, built via block patterns
  • Footnotes – built manually for now until the footnotes block is finished
  • Optional: Footer Override Block –If this fields differ across pages, this can be used to override global PLP Footer settings
    •  set to ‘PLP’ style – make sure links are entered as relative paths

See the TAP Example PLP here.

General Conventions to Follow Across PLPs

There a few accessibility items to standardize across PLPs as a part of the PLP migration that are new since the initial ATF rollout:

  • The page background color should be set to white via the Global Settings for PLPs.
  • The lead form background color should be set to the #F9F9F9 gray color, you may need to add this color in the global settings if it’s not there already.
  • The button text in the body content should be title case, not all caps, i.e. “Request Information”, not “REQUEST INFORMATION”
  • The form should have an id of ‘form’ and anchor link the button with #form

All notice banners should be hidden. There is a PLP section in the global settings where you can hide all notices for PLPs.

Creation & Settings

Start

  • Click ‘New‘ and ‘Paid Landing Page‘

PLP Settings

  • Add Description from the ticket
  • If Index page- then YES for approved for agency
  • If not index page, then leave blank
  • Toggle ‘Hide Top Bar Table’ for Desktop and Mobile

Header Override Block

  • Toggle on: Hide Breadcrumbs, Remove Logo Link, Remove Logo Link (mobile), Hide Navigation, Hide header desktop
  • Add alt text to Mobile Logo Alt Override

Hero Block

Check out the two ways to build these out:

Adding a New Hero Block

  • Mobile background color set to white
  • Lead form background color set to #F9F9F9
  • Lead form HTML ID should be set to “form”
  • ‘School logo’ should be hidden on mobile
  • ‘Hero text’ font size – 20px
  • Within spacing settings: Add title margin bottom of 2
  • List block within hero:
    • List font size: 18px
    • Spacing Settings: Adding padding top of 2
    • override icon code to enter for the icon settings: e92d – paste this into the override field. This will generate the outlined checkmark icons
    • Icon size: 24
    • Line height: 24
    • Layout Settings:
      • Left margin: 36
      • Right margin: 30
      • Bottom margin: 16

Adding the PLP Hero Pattern

  • Click Blue Check Button for Block Inserter
  • Go to Patterns
  • Click to add the PLP Hero pattern block

Typography Settings

  • Set hero title tag to Heading 1
  • Set the Hero title and content colors to white

  • Set font size for hero to 20
  • Upload school logo
  • Hide the school logo on mobile
  • It might be helpful to add a padding of 2 underneath the H1

Arrow & Background

  • Set the arrow color, hide if needed.
  • Set the background image for desktop and tablet

List Block

List Color & Font Size

  • Add the list point color (note it will not be reflected in the wordpress editor), text color to white, and ‘custom font size’ toggle on- with font size of list items set to 18

List Icon Settings

  • Toggle on for ‘change bullet point for icon’
  • Set the icon code as e92d with the following settings:
  • Icon Size: 24
  • Line Height: 24
  • Left Margin: 36
  • Right Margin: 30
  • Bottom Margin: 16
  • For the second set of list points – the icon size should be 22

Lead Form

Lead Form Settings

  • Add in the lead form details from the ticket and previous spiralyze page.
  • Set the Html Form ID to ‘form’

Footer Override Block

If footer content differs from global PLP footer settings, input new text values.

Global Footer information across the PLP post-type. The Footer information will display across all PLPs unless there is a footer override block present to customize footer info on a page-level basis. Any fields left blank in the footer override block will pull from the global settings.