To sign in, add /wp-admin to the usual site URL.
Most content is in the form of what WordPress calls a Post. These are used not just blog-like “news” content, but also content that evolves over time, such as the description of a project. These posts are listed in boxes in summary pages such as the News or Projects page; when you click the box, the post opens on its own page.
Anything you want to stand out, such as complimentary feedback:
To get a heading in a Post similar to our main Pages – white title on pictorial background:
See the example project page Arts at a Distance..
When you edit a page, you’ll see all sorts of fields both below the main content of the page, and in the right-hand panel. We don’t use most of them. In general, experimenting with them won’t do any harm. But try to remember what you’ve changed.
A couple of them have an effect beyond the page you’re looking at, and should be left as follows:
Media attachments – Keep both “Duplicate…” boxes checked
Multilingual content setup – Keep at Make “posts” translatable.
Only the News category is really like a blog, showing the date it was posted. Treat the other categories like pages: go back and keep them up to date as the project develops.
Keep News and Projects distinct: a project might have News items announcing its launch and other key milestones; but these are separate from the project’s main post, which describes it as it is today.
If you make a mess of a page or post, you can always go back to a previous version.
Notice that there are Undo/Redo buttons near the top left of the page. The usual keystrokes will work too.
Use Preview (near top right) to see the effect of your changes before publishing them.
If you’ve made a complete mess, just close the window or go to edit another page. The “Leave without saving?” warning pops up – say yes.
If you publish a page or post and then decide it was a bad idea, you can revert to a previous version.
In the right-hand panel, under the Page or Post tab, look for Revisions. Click it to go to the Compare Versions page.
Click Previous, or move the slider back. (What you see is the HTML code rather than the final appearance of the page. Don’t worry about that.)
Click Restore this Version.
The content for events that people can book is not on our main website. Instead, it’s on the TicketSolve site. But events that you add to TicketSolve appear automatically on the website, so you don’t have to enter the details twice.
Assuming you’ve already put the video on YouTube or Vimeo …
[This doesn’t work currently.] Start time. If the gig takes a while to get going on the video, YouTube provides an option “start from current point” when you get the sharing link. You can also set or adjust this yourself afterwards by adding ?start=60 to the Video ID. This would start a minute in; substitute your preferred number of seconds.
[Better to edit the video to chop out any long lead-in. The problem is that if there’s ten minutes at the start where nothing’s happening, people playing the video afterwards just think there’s something wrong with it and give up.]
You might link from a project page to posts in the News or Activities categories. Or you can create a Page (rather than a Post) and link to it. Pages don’t have categories or tags.
Include a link back to the Project page from the sub-pages.
In general pages/posts:
Set the Expiry date, which appears under Activities group of custom fields. After that date, the project won’t appear in the Projects page. But it will appear in the Showcase.
Staff members are shown in the About page. Create a Post for each staff member:
A few volunteers are featured in the Volunteers page. Don’t forget to get their permission!
The Staff and Volunteer categories are just for individual people – not general posts about volunteering or job opps. Those go under News with tags “Jobs” or “Volunteering”.
We use categories to divide up different kinds of content, rather than different topics of interest. Visitors to the site get to see tags, but not categories.
So for example items with the “project” category show up on the “Span Projects” menu. Items in subcategories of “activity”, such as “join in” or “make” show up on the Make, Watch & Do page.
Use Tags to allow visitors to pick out items that are on related topics – for example, “gardening” or “jazz”. You can also use Tags for all the items related to a particular project – for example ClwbDigi.
The website is effectively two sub-sites under one umbrella. Posts don’t automatically appear in both the Welsh and English subsites. It is possible to make the content of the two sites very different. But we should aim to replicate every item in both languages.
When you create a new post or page, you have three options:
You have a piece of news to announce.
At this stage, visitors who select Welsh see the news item, but it’s in English. At least they’re aware of it., even if they object to it on moral grounds.
If you update the English version, the Welsh will automatically be updated too; they’re still really the same post.
4. Click the pen icon to edit the Welsh version. Translate the content into Welsh by hand. It’s also possible to choose a separate Feature image if necessary. Click Update; acknowledge the warning flag about creating a separate version.
Now Welsh visitors can see the Welsh version.
5. If, at a later date, you update the post, you’ll have to update each separately. You can use the pen icon to flip quickly from one to the other.
For nearly all posts and pages, we should click the button to duplicate the item into the other language. Whether we then go on to do the translation is a matter of resources available.
The Welsh events page lists TicketSolve events that have the language set to Welsh..
Menus are set in the Admin panel under Appearance > Menus. We use:
To see the Cymraeg menus, select Welsh under Add menu items.
To add a Page to the menu, select it in the left-hand panel, click Add, then in the menu listing drag to adjust its position.
To add a specific section in a page to a menu:
The English and Welsh menus don’t keep in sync automatically. If you change one, you should generally change the other. (There is a feature that automates this to some extent, but it’s not worth the hassle.)
When you select Welsh under Add menu items, the Welsh menus appear, and the pages you can select change to the Welsh ones.
The drop-down menu under “Projects” is filled in automatically with links to the project posts. To make this happen, create a sub-menu item under Projects that has the label:
This sub-menu item will be replaced by a list of the items in the project category. It doesn’t matter what type of menu item it is, but you must edit its label.
Notice the initial asterisk. Instead of “project” you can substitute some other category name, if you want to make a menu of items in that category. Be careful to get the capitals right.
Under the Welsh prosiect menu, put another sub-menu, also with the name *project. Only Welsh project pages will be shown.
The “core pages” are those that hang off a top menu item. You’ll want to tweak them to alter the bits of introductory text, headings, and so on.
They are pages rather than posts, so don’t have a category or tag, and don’t need a Featured Image.
They’re most easily edited with WPBakery, as they consist of many nested shortcodes, which are a bit indecipherable in the basic editor.
The general style of these pages – colours, sizes of boxes, margins, etc – is set by a common CSS file (wp-content/themes/bridge-span/css/span-arts.css). It isn’t recommended to make individual changes separately to each page.
A couple of shortcodes are used to pull lists of content in from the database. TicketSolve pulls current shows from TicketSolve, and Activities pulls posts from the database.
Many of the core pages show a collection of boxes- for example on the front page, or on the Projects page, or the Make Watch & Do page –
If you’re going to put columns or tables of boxes in a page, you’ll want to set the page template to Full Width. In the panel on the right under the Document tab, look under Page Attributes / Template and choose Full Width.
There are three usual ways of making boxes in a page: Inline Columns, Inline Table of Boxes, and Post boxes. “Inline” means you write the content in the page where it appears; “post” means you write each item separately as a WordPress post with a particular category, and the items appear in the appropriate page(s).
The easiest way is to copy an existing example.
The following methods of making boxes are demonstrated on this page. Look at the result that visitors see, and then Edit it to see how the boxes are created.
If your text is more or less static – you aren’t going to add new boxes at intervals:
2. Insert your text in each column. Don’t put the header, image and description all in the same text box.
Use a Single Image element. Under Image Size, put “medium”.
For a uniform style, open the settings of each Row (the pencil icon) and under Extra class name, put boxcolumns; and under Type choose Full Width.
Open the settings of the Row and under Extra class name, put boxcolumns showSomeBelow
This will limit the height of the items, chopping off some of your content. The reader clicks the content to see the whole thing.
If each item appears entirely on this page, and you occasionally add new items:
In a full-wdth row, create a “Qode Element Holder” and put “Qode Element Items” inside it. Inside each of them, write your header, image, and text. It helps if the images are the same size and the text roughly the same length.
The advantage of the Qode Element Holder is that it arranges the items into a table. When you add another item at the front, the rest wrap around.
When you want to add a new item, begin by duplicating an item, and then edit it.
If you want (a) a short text of each item here and the rest on its own page; and/or (b) the same items to appear on more than one page – e.g. on the Covid page and the News page – then do it like the Meet the Volunteers section in the About page:
1. Write each item as a separate post, and assign it to the appropriate categories – e.g. news and covid. Consider setting the Expiry date for each post so that the list doesn’t get ridiculously long.
2. In the page where you want the list of boxes to appear, insert an activities element or shortcode. This is a bit of program code that displays a list of the posts from a particular category. Read on for how to do that.
If you’re using the WPBakery Editor:
2. In the dialogue that pops up, enter the various options.
3. Close the dialog and in the editor, shift the element to the place in the page where you want the list of boxes to appear.
4. To change the options, select the element and click the pencil icon.
If you’re using the basic Gutenberg editor, the Activities shortcode appears as an arcane piece of text. You can enter this by hand where you want a list of posts to appear. Here’s an example:
[activities category="join in" count=3]
Always enclose it in square brackets and begin with “activities”. The other parameters are:
It automatically picks Welsh posts when the page it’s contained in is Welsh.
The title of a page does not appear automatically at the top of the page. It is only used to identify the page in the Admin page index.
You have to create a heading row at the top of the page. (As usual, it’s easiest to start by duplicating another page.)
To create a header with a static background picture:
Variations on this:
The header on the front page is a LayerSlider. The slider is created and edited separately from the page.
To compose or edit a slider, scroll down in the admin menu to LayerSlider/All slides. To create a new one, begin by duplicating one you know works..
The pictures are the background images of the slides. We don’t currently use many of the facilities of LayerSlider, which is capable of complex animations.
Once it’s created, you just create a row and put a layerslider in it, setting its properties to the name of the slider you’ve created.
To insert a button that links to another page, if you’re using WPBakery editor,
1. Click [+] and choose the ReadMore element.
2. In the dialog box, enter the URL (“slug”) of the destination page.
– If it’s a page in our site, omit the domain name – so for example just projects or make-watch-do.
– If it’s a page somewhere else, put the whole URL – for example https://bbc.co.uk/radio4
3. Set the text of the button and close the dialog.
4. Move the element to where on the page you want it to appear.
To insert a row of buttons spaced across the page, using WPBakery editor:
The bulk of the work is in:
The main menu items are pages (not posts) in which the custom shortcodes are used to pull various things off the database. The WPBakery page editor is the easiest way to edit them.
Most of the styles are set in the CSS file in themes/bridge-span/css. Some dynamic behaviour is defined in themes/bridge-span/js/spanarts.js
The boxes we use are our own, rather than those supplied by Bridge. It proved easier to create new ones instead of bending theirs. (In fact there’s quite a lot of Bridge we don’t use, so it might be worth considering whether just to create an independent theme.)
The custom css also sets sizes for headers, fonts, etc. The Bridge theme provides a lot of rather clunky controls for defining the styles of individual elements, but it’s a lot easier to get a uniform style and a bit more readable by setting them all in one file.
The span-project-menu plugin creates the menu of project posts under the “Span Projects” menu item. It looks for “autofill” as the first word in a menu item’s Description (which isn’t otherwise used in this theme). The list contains everything in the projects category that hasn’t passed its Expiry Date.
At present we’re not using the Bridge header mechanism in pages. Each header is just a row at the top of the page, containing a fixed picture. To change the picture, edit the page.
It would be useful to move to using either LayerSlider or Qode slider to pull pictures from the database. And also maybe move to using the theme headers – though this doesn’t seem to work all that well.
The commercial ACF plugin is used to create various fields that appear on some posts, depending on category.