Places We Protect Template Style Guide
Preserves vs. Project Sites
This guide is aimed more at preserves than at project sites. For places that TNC does not own and where the focus is not on visitors, there can be some flexibility in the use of this template, and you should consult your publisher for guidance.
Examples of PWP pages for preserves:
West Virginia: Bear Rocks Preserve
Examples of PWP pages for project sites:
*Examples will be added as we create more pages that comply with style
Properties
The following properties tabs must be filled in. Ignore the other tabs.
Basic Tab
- URL: This field will auto-generate the URL. Enter in URL format with words, all in lower case, connected by dashes. Example: “new-name-preserve-in-oklahoma”. For new pages, make this include the state name for SEO purposes. No need to change any auto-migrated URLs. The URL will be cut off at 64 characters, so keep your title shorter than that or words will get cut off. Do not include underscores or special characters in the URL, besides dashes.
- Owner or Business Group: Make sure you designate the state (or country) as the Business Group.
- Page Title: Appears on the browser tab, and more importantly, is the headline you’ll see in search results, pulled onto cards in various components, and on the Places We Protect landing page.
- Description: This is the promotional text you’ll see in search results, pulled onto cards in various components, and on the Places We Protect landing page. Limit to 150-160 characters.
- On Time: Make sure you leave this blank.
Image Tab
The image path you use here will dictate which image loads on cards and on the map on the PWP landing page. Remove special characters from image filenames before uploading them to the DAM.
OG and SEO TABS
Follow the general instructions here and below and any SEO guidance to come.
Places We Protect Details Tab
- Follow the instructions on slide 16 of the “Page Properties by Template” guide from GD.
- Make sure you select the correct status (open, closed, limited, hidden). Selecting that in properties determines the status listed in PWP search results, whereas the status in the PWP Overview Component determines what displays on the actual preserve page. If you select "hidden" the preserve will not display on the PWP map.
- If there is no Places We Protect tag in the system for your preserve, request that the global Digital Team create one.
PWP Page Properties
Page Creation (2 Tabs)
-
This is the end portion of the URL of the page. Enter a URL in this field in URL format. Example: this-is-a-url-example. The URL field should contain ONLY lower case letters and numbers and dashes. Spaces and special characters are not allowed. Make sure you are happy with the page URL as it is very difficult to change. 50-character limit.
-
Page Title should be written for external audiences and displays on page cards, internal search results, breadcrumbs (if applicable) and in components when the title is not authored directly. 150-character limit.
-
This should be an enticing sentence or two about what readers will find on this page. It will be used on page cards and in internal search results.
-
Select Places We Protect. The content type for all pages in the Places We Protect detail template should be "Places We Protect."
-
This should be the BU or department that is the primary owner of the page. This field will be used for aggregation pages, analytics tracking, and will allow you to easily locate all of your pages for internal review or audit.
-
Select at least one audience tag that best describes the target audience of your content. Choose the broadest audience that would benefit from the goals of your page.
-
Required. Select if preserve is Open (i.e. open to the public), Closed, Limited Access, or Hidden. Select hidden if you do NOT want preserve to appear on preserve locator map.
-
Required. Select location of the preserve/property. If protected place spans geographic boundaries, select all applicable locations
-
Select the place/preserve that the page is about. If there is no tag matching your page, please use a higher level tag (i.e. Nature Preserves) and then request the tag from the Global Digital Team through the Marketing Request Portal.
-
Enter the name of the person(s) who should recieve notifications if a link or asset on the page is expiring - or if the page itself is set to expire.
Basic Tab
-
COMPLETED IN PAGE CREATION STEP. Page Title should be written for external audiences and displays on page cards, internal search results, breadcrumbs (if applicable) and in components when the title is not authored directly. 150-character limit.
-
Optional. The only place this will used is as the subtitle in hero components if a custom subtitle is not entered in the component.
-
COMPLETED IN PAGE CREATION STEP. This should be an enticing sentence or two about what readers will find on this page. It will be used on page cards and in internal search results.
-
If the page is available in more than one language, enter the language of the current page in this field. 50 character limit.
-
Enter the page path for the current page (the page in the language indicated in the previous field).
-
If the page is available in a different language, enter the name of that language here (in the native language - e.g. Español). 50 character limit.
-
Enter the page path for the alternate language version of the page (the language indicated in the previous field).
-
Checking this box will hide any active site-wide alert banners from displaying on your page. This may be used at your discretion, but is not generally recommended.
-
Checking this box will remove the social share buttons from the page. This may be used at your discretion but is not generally recommended.
-
Do not use this checkbox unless instructed to do so by global marketing teams.
-
Use the calendar icon to schedule a date and time for the page to go live once it is published. If none is selected, the page will go live automatically after workflow is complete. You can also select publish time when submitting your page for publishing.
-
For non-evergreen content, enter a desired expiration date (off time).
Image Tab
-
Required. Select an image to display on the page cards. This image will be pulled onto the page card in the following components: related events, search and featured content.
-
Enter a description of what is shown in the page card image selected in the field above. Alt text is critical to making the page accessible to all audiences.
-
This field instructs AEM on how to crop the photo to fit the aspect ratio needed for desktop browsers. Select the section of the photo to maintain during cropping. (E.g., selecting Top/Left will maintain the top left corner of the image and will only crop as needed from the bottom and right sides)
-
This field instructs AEM on how to crop the photo to fit the aspect ratio needed for mobile browsers. Select the section of the photo to maintain during cropping. (E.g., selecting Top/Left will maintain the top left corner of the image and will only crop as needed from the bottom and right sides)
OG Tags (Social Share)
-
Enter a title for the social post. This will appear on social share card generated when someone shares the page link on social media.
-
Enter a short description. This should be an enticing sentence or two about what readers will find on this page. It will show on social media posts that generate from sharing page link.
-
Choose the most appropriate page type. Most pages that are not in the article template should be categorized as 'website.' Search engines need this piece of info to recognize pages.
-
Required. Select an image to display when a social media post is generated from the page link.
-
Optional. Enter the relative URL for the page. Field determines the address that the social post will link to.
-
OG site name determines the source that displays on social posts. For pages on the TNC global English site, the field should read 'The Nature Conservancy.'
SEO Tab
-
This is what is seen in the browser tab and Google search results. Should be a shorter version of the page title and include high value words. If you have enough room, include branding at the end of the title: | The Nature Conservancy OR | TNC (though don't sacrifice important words to fit the branding in). 65 character limit.
-
This description is visible in Google and other external search engine results. It should primarily entice people to click on the page: what is the page about, why should people want to read it. 170 character limit.
Places We Protect Details tab
-
COMPLETED IN PAGE CREATION STEP. Select Places We Protect (should default to Places We Protect).
-
COMPLETED IN PAGE CREATION STEP. This should be the BU or department that is the primary owner of the page. This field will be used for aggregation pages, analytics tracking, and will allow you to easily locate all of your pages for internal review or audit.
-
Optional. If applicable, select secondary business groups to be used for sorting and filtering. If the event should appear connected with other business group(s) in search, filtering, and sorting, additional business group or groups should be entered here. This field is optional and multi-select.
-
COMPLETED DURING PAGE CREATION STEP. Select at least one audience tag that best describes the target audience of your content. Choose the broadest audience that would benefit from the goals of your page.
-
equired. Select if preserve is Open (i.e. open to the public), Closed, Limited Access, or Hidden. Select hidden if you do NOT want preserve to appear on preserve locator map.
-
Enter Latitude for the map pin in decimal degrees. If you do not want the preserve to show on the map, choose "hidden" in the status field dropdown. DO NOT enter 0 in the latitude or longitude field as 0 is valid location.
-
Enter Longitude for map pin in decimal degrees. If you do not want the preserve to show on the map, choose "hidden" in the status field dropdown. DO NOT enter 0 in the latitude or longitude field as 0 is valid location.
-
Suggested. Only activity types will be available (e.g. hiking, boating).
-
COMPLETED IN PAGE CREATION. Required. Select location of the preserve/property. If protected place spans geographic boundaries, select all applicable locations.
-
Select the place or preserve. If there is no tag for your place, use a higher level tag (i.e. Nature Preserves) and then request a tag from Global Digital via the Marketing Requests Portal.
-
COMPLETED IN PAGE CREATION. Required. Enter the name of the person(s) who should receive notifications if a link or asset on the page is expiring - or if the page itself is set to expire.
Places We Protect Page Components
There are four configurable sections of the PWP page template and each section allows for a specific components. Below are the sections and components available to use in each section:
Configurable Sections |
Available Components |
|---|---|
Hero |
C09 Hero ImageC35 Connect Callout |
Body |
C19 Tab Container |
Within Tab Container |
C18 Preserve Overview ComponentC20 Rich Text Editor (RTE)C11 Title Text Call to ActionC111 Image MosaicC38 ImageC38 Image CollageC105 Statistics Component |
Ending |
C11 Title Text CTAC19 Tab Container
|
The Tab Container Component and What Goes Inside It
All PWP pages should have the body text placed in components within a tab container. Do not put any components other than the hero, connect, and title text CTA components above the tabs.
For preserves (places TNC owns or manages) or for places where visiting is a possibility, the first tab should always be the Preserve Overview Details Component. There may be some cases for PWP pages about project areas that are not visitable where it may be best to use an RTE Component instead to avoid having the righthand column, but that approach should be used rarely and only after consulting your publisher. Here’s an example of that situation.
A typical preserve page will have two Tab Element Components
- Overview Tab: always name the first tab Overview and use the Overview Details Component. Do not place any other components above the Overview Details Component in the Overview tab. More instructions for configuring this tab are on the following pages.
- Visit Tab: always name the second tab Visit. More instructions for configuring this tab are on pages 9-13.
Other Tabs?
There may be some cases where it makes sense to include additional tabs beyond the typical two tabs. For example, for preserves that have overnight lodging or other special facilities that in the past were covered on separate nature.org pages. Here’s an example for the lodging situation. Please consult your publisher if you think you have a preserve page that should have additional tabs.
Visit Tab: RTE Component(s)
The first component in the visit tab and subsequent tabs should usually be the RTE. If you use headers in this section, make them Header 4 font. Content to include in the Visit tab might include:
- Activities to do at the preserve.
- Trail information.
- What you might see.
- Logistical information like parking, facilities, entry fees (if applicable).
- Preserve regulations. It’s usually preferable to list regulations in the text here rather than just linking to a PDF of regulations.
Visit Tab: Map Component
If desired, you can add a larger map in the Visit tab. Place the map between two RTE components containing text, or below a single RTE component. You can add additional map points to mark the parking lot, trailhead, or other landmarks. Each map point requires a photo and description.
Examples using Map Component:
Visit Tab: Resource Listing Component
A resource listing component is recommended if you are linking to any documents (PDFs, etc.) from your preserve page. It is fine to link to them from the text and include the resource listing as well. Add the resource listing at the bottom of the tab. You can include the same resources at the bottom of both tabs if desired, and place a Width and Separator with a horizontal line between the main body of the tab and the resource listing to give some visual separation. A Width and Separator is often necessary below the resource listing component to prevent it from overlapping with or being hidden behind the components that are placed below it.
Examples using Resource Listing Component:
Questions?
- Contact mpizer@tnc.org
- Ask on the Governance Workplace Group
- Check the Centralized Services Team’s Governance Info on Connect
Template Updates
March 28, 2019 PWP Update from Margaret Pizer
- First, the 3/20 AEM update included some changes to how the search function works on that landing page that should help states who have been having trouble getting all of their preserves to show up when they link to it from their state homepages. You can now specify the search radius within the link to the PWP landing page, so large states can make the radius bigger and small states can make it smaller. So as an example: https://www.nature.org/en-us/get-involved/how-to-help/places-we-protect/?s=fort%20dix%20new%20jersey&r=150 will load preserves within 150 miles of Fort Dix, New Jersey, and https://www.nature.org/en-us/get-involved/how-to-help/places-we-protect/?s=edmeston%20new%20york&r=390 will load preserves within 390 miles of Edmeston, New York. Let me know if you want help figuring out how to implement this for the link from your state homepage to the PWP landing page.
- Second, there is a timeline for the other fixes that need to happen on the PWP landing page. Global Digital has put out a call for bids from developers to do several big "optimization" projects on the site, including improving the PWP landing page. Things like improving the search results, optimizing the appearance and behavior of the dots, and more, will be part of that project, and it will hopefully be done by the end of the summer. I can give you a bit more detail on request and/or refer you to the Global Digital team if you have questions I can’t answer.