How to add content to the 100 Rural Years website
This guide is for anyone who wants to publish content onto the 100 Rural Years website such that the content follows the style and structure conventions already in place.
This guide presumes you already have publisher access to the website and that you are familiar with the WordPress user-interface, most especially the WordPress Admin Dashboard and the Gutenberg Editor.
Note that the entire site exists in two distinct places on the internet – the ‘live’ platform (https://100ruralyears.uk) and the ‘staging’ platform (https://100ruralyears.uk)
The vast majority of the content workflow is carried out on the staging platform. Changes made here do not effect the public view of the website, until (at the right moment) the changes are ‘promoted’ from staging to live. In this way the public content is not disturbed by, potentially lengthy, content edits. Once all edits are done (and checked as much as possible) all changes are released at once to the live platform.
The overall workflow for making new content available on the public website is:
- Edit the content (on the staging platform)
- Quality Check the content (on the staging platform)
- Get authority to publish
- Update live platform
The rest of this guide discusses each of these steps in turn:
2023 UPDATE:
Although the foregoing represents the designed publication workflow for 100RY (aimed at ensuring stability and coherency of the live website) – it is of course simpler to work directly on the live website. In the case of a single, authorised and responsible, owner of the site content this may be pragmatically the preferred way of working.
To do so, first of all visit https://100ruralyears.uk/wp-admin and login. Then browse to the page that needs editing and you will see a banner at the top with an ‘edit page’ option:
Editing Basics
Ensure the Settings panel is visible. Also turn the Block Browser on when adding anything other than simple text content:
By default, when you click on the page canvas a simple ‘paragraph’ block gets created and you can type text in. When you do so, if the mouse moves, a floating toolbox appears:
Selection Scope: Simple blocks contain content: text, headings, lists, images, videos etc. Complex blocks (like accordions) contain other blocks, so (for example) an accordion can be expanded on the page to reveal a number of paragraphs, headings images etc… just whatever simple blocks you happen to have put inside the complex accordion.
During editing, when you click on the page, by default, you are working with the simple block you happen to have clicked on. If you want to work on its container, maybe drag an entire accordion up the page, you will use the scope selection tool to step up through the hierarchy of containers. You will only see the scope selection tool if the block you have clicked on is contained within some other block.
Typical containers you will use are: columns, Accordions, and groups. Columns blocks contain 2 or more Column blocks that then contain the blocks of content you want to display – a 3-level hierarchy. Accordion blocks contain 1 or more Accordion Items that contain the content you want to display, also a 3-level hierarchy. Groups contain content to be displayed – a 2-level hierarchy. Groups are used to create call-outs and further reading panels.
Block Type: Clicking this allows you to transform a block – typically to change the text you have entered to be a heading instead of the (default) paragraph, or perhaps to create a bulleted list.
Drag and nudge: lets you move a block up or down the page, or up and down within the block’s container (if any). Sometimes it is tricky to add a block – say if it is needed within a container but after an image; it can be a struggle to click in just the right place. It can be easier to first create the block elsewhere, and then nudge it down into position.
Block Styling: some limited but commonly used styling options. What you see depends on the block type. Further settings for a block can be seen in the Block tab of the settings panel. NB. when creating a link try to ensure that off-site links are set to open in a new page.
Block Operations: Duplicate or delete a block, etc… also here you can create a group – highlight all the content that will be inside the group block and select ‘group’ from this pop-up menu.
Edit the Content
You will have to create an account but note that the free edition is perfectly fine for grammar, punctuation and spell-checking. Take their tour to understand how to use its features.
Before going any further you should ensure that you have spell-check and grammar-check tools in your web browser, as WordPress doesn’t supply these features out-of-the-box. The Grammarly browser extension is recommended and can be added to your browser using the link above.
All content must be added/changed/deleted on the staging environment. To access the standard WordPress administration on the staging environment visit:
https://100ruralyears.uk/wp-admin
You may need to log-in using your WordPress Editor credentials. If you don’t have these then you will need to request access from the WebMaster by e-mailing webmaster@100ruralyears.uk
You will now be at the familiar WordPress Admin Dashboard. All of the content you will be managing resides on Pages (this is not a blog-site and so Posts are not used).
To delete or add content select the ‘Pages’ item from the left-hand sidebar menu.
2023 UPDATE:
Themes have been removed. You will see all stories as a simple list under the Stories page.
Add A Story
Start by cloning an existing story.
Story Page Attributes
Start by adding the title and the page attributes.
2023: Point 6 – use STORIES as the parent page
2023 UPDATE:
Comments are no longer allowed in order to remove the moderation overhead. Always ensue ‘allow comments’ is not selected.
The Title should be very short as it appears in summary displays elsewhere on the site; it should also have a strong and clear relationship to the ‘URL Slug’.
The ‘URL Slug‘ is what appears in the address of the page. There are limitations on the characters that it can have (eg. no spaces) but it should clearly represent the story title. The default value is usually fine.
All stories will have plenty of images in them, one should be used also as the Featured Image (this appears when a link to the page is shared on social media sites). It is best to use the first image that appears in the story, as this gives a visual clue to the visitor that they have arrived where they expected to (if they’ve seen the image in a social media link, for example).
All pages in 100 Rural Years must use the full-width template.
Make sure the Parent page is the Stories page.
Set the page visibility to public; otherwise, only (logged-in) site editors and admins will see the page.
Story Content
Add content using ‘blocks’ of the appropriate types: Paragraphs, Headings, Lists, Images, Quotes etc…
You don’t need to apply any styling (colours, font sizes…) – all styling is applied automatically to ensure consistency across the site.
Now you can start adding content.
For full detail concerning how content is styled, browse the accordion:
Section Breaks
Section headings are added as H2 Heading blocks (which will appear with a horizontal separator line before them)
Embedded Media
When adding media ensure that Alt Text, Title, Description and Caption are all supplied in the Media Library. Usually these are all set to the same text.
All images should have their link set to ‘Media File’ so they are part of the pop-up gallery when they are clicked:
Callouts
Stories will contain ‘callouts’ that either relate to an ACRE Network Member, or else to something else on the Internet.
Callouts contain media, a link and a description. The media might be an image, an embedded YouTube video, a local mp4 video, or else a local mp3 audio-clip. The link and the description are simple Paragraph Blocks; the link must be the first paragraph of the group.
The content of a callout is added as per normal content – using blocks. To create the callout itself either group the blocks after adding them or else add them to a ‘columns’ type block (usually 2-columns).
To give the group or the columns block the required callout styling select the parent – this can be tricky if you aren’t aware of the hover feature of the ‘transform block’ option in the WordPress editor:
Having selected the parent of the (grouped) callout content blocks add the advanced CSS styles story-callout and either light-text or dark-text to the (parent) block properties:
NB: light-text creates an ACRE Network Member style callout; dark-text creates the ‘off-site’ style callout
Further Reading
Stories also have Further Reading sections.
These are a Paragraph Block with the title ‘further reading’) and
- a list block of links to additional resources
- The title paragraph and list blocks are grouped, and
- the parent group class is given advanced CSS class story-ref.
Quotations
Stories can also contain quotations. Use a standard Quote block and add Advanced CSS class story-quote
Because citations ‘float’ on the page it is often useful to add a ‘spacer’ block after a quotation.
note, you don’t need to worry about selecting parent because quotes are a single, ungrouped blocks.
Voices
Voice styling (deep purple) can be applied to any accordion. Select the outer most parent of the accordion block and add Advanced CSS styling class story-voices
Galleries
Galleries are first created using the FooGallry tool in the /wp-admin dashboard (left handside). Once created they can be added to a page using a ‘shortcode’ block:
Story SEO
We are using the WordPress Yoast plug-in to enable Search Engine Optimisation. When editing a page you will see a large ‘Yoast’ panel at the bottom of the page. Here we need to add the story abstract to the meta description:
There’s a lot more that can be done with Yoast, but this is the sufficient minimum.
Add the story to the overall Stories page
Edit the Stories page
Add the story title and brief abstract as paragraphs. Make the title into a link to the story page. Try to keep the list in alphabetical order.
Update an ANM page
All ACRE Network Member pages pre-exist although many have very limited content..
Displaying ANM Content
All ANM pages must exist, even if we have no content for them – this is so that the map on the Places page is fully satisfied (all counties lead to a page).
Adding a new resource
In the resources section use the ‘+’ button to add a new Tab. Enter resource details as per existing tabs. Ensure that any header logo is center aligned.
Adding a new voice
If there are no voices at all on this page as yet
Add an Advanced Accordion with one entry. Give this accordion the Advanced CSS styling class anm-stories
If this page already has some voices
Simply add a new entry to the existing accordion.
Adding a new treasure
Archival treasure sections contain:
- An H2 heading describing the archival item and including a link to the representation of that item within the associated archive website.
- An image of or related to the archival item
- A blockquote block describing the archival item with a citation that also deep-links to the item within the archive’s website.
These items should be grouped and the group should be given Advanced CSS styling class anm-treasures
ANM Page Styling
Summary of special stylings:
Banner Styling
The page top is a columns block (30/70 split) with an Advanced CSS styling class of anm-banner
Resource Styling
There are no special styles required. Add content to an Advanced Tab block. ensure logos are centre-aligned.
Voices Styling
The accordion uses Advanced CSS styling class anm-stories
Treasures Styling
A ‘treasure’ section content is grouped such that the group uses Advanced CSS styling class anm-treasures
ANM page SEO
Add the description (or a summary of it) from the banner section to the meta description in the Yoast SEO panel at the bottom of the page – just like we had to when adding a story.
Ancillary Content
Home Page
This is a static page. The only thing that may need to be changed is the background image. This must be done by a webmaster edit of body.home in file wp-content/acre-100/style.css
Policy Pages
Please check info on the privacy and cookie policy pages remains correct.
Quality Check the Content (staging)
Publish the page and check the styling and layout. Check use of ‘groups’ and ‘Advanced CSS Styles’ if it isn’t looking right.
Proof read, and use a checker for spelling, grammar and punctuation.
Check that all links lead to the right place; ensuring that off-site links open in a new browser tab (and that in-site links do not open a new tab).
Check that all images open the light-box pop-up when clicked.
In the WordPress Admin Pages view check that new pages appear in the right order/place. Either drag to correct or edit the page and explicitly set ‘Parent Page’ and ‘Order’.