Recap – shortcodes and people data

This post is a recap for a question that comes up quite often about adding information from either PURE (research@st-andrews) or Symbiosis (School) databases to WordPress sites. I’m going to try to give a summary here, and link to other posts with more detailed information.

The basic idea here is to use ‘shortcodes’ on pages of a synergy wordpress site to pull in information from these data sources.  The shortcodes are instructions added to the page in [square brackets] that are interpreted by WordPress. The particular shortcodes required use a plug-in that I wrote to access various databases and do helpful things with the results.

Continue reading

How to display code in a block on your page or post

To display code in a block on your page or post

1. When editing your page or post, click the Text tab.

2. Scroll to where you want the code to appear and type:


change later


You can now go back to editing in Visual mode if you wish.  You should see something like this…

change later

Edit the 'change later' text as you require.

New page and menu item

Q. How do I add a page to the set of links across the top of all pages in the site?

A. Basically a two stage process…

  1. Make your page
  2. Add it to the menu

Which you do as follows…

1. Adding a page

  • Sign in to your site so you are looking at the site dashboard
  • Select pages > add new
  • Give your new page a title, add some content (you can always edit later, of course)
  • Click the publish button to save the new page

2. Adding the page to your menu

  • In the site dashboard select appearance > menus
  • Find your new page in the pages panel. If you can’t see it try the ‘all’ tab. When you find it tick the checkbox beside it, then click the ‘add to menu’ button.
  • The new page appears at the bottom of the list – equivalent to the right hand side of a horizontal menu. Click and drag to position it, you can also drag to the right to make it be a ‘child’ of another menu item.
  • Note – if you want the menu item to have a shorter title than the page, you can do this by opening the panel of the item (small triangle top right) and changing the ‘Navigation Label’
  • When your done, click the ‘Save Menu’ button

That’s it!



Headers with the WP Display Header plug-in

updated: 29/1/2015

This post explains about how header images are set for sites using the WP Display Header plug-in.  If your not sure if this applies to your site, please ask the administrator.

It’s a three stage process:

  1. select and prepare your header image(s)
  2. upload the image(s)
  3. set which page you wish to use this image

1. select and prepare your header image(s)

Choose images at least around 960 pixels wide.  Remember that you’re only going to use a thin strip of the image, so pictures with an interesting feature which can be cut out are going to work best.  Use photoshop or another imaging program to adjust your image for best contrast and colour.

2. upload the image(s)

Sign in to your site dashboard and select Appearance > Header

  • Click to open the Header Image tab
  • Click the Add new image button
  • Choose the Upload Files tab (unless you’ve already uploaded the image) and select the first image you wish to use as a header
  • Click Select and Crop
  • To crop, drag the selection box to choose a good part of the image.  It’s better not to resize the selection box, just click in the centre of it, and drag the whole box into place.  When you’re ready click the Crop Image button.

Repeat for additional images to be used as headers.

Note – to delete a header image: select Appearance > Header, Header Image tab, mouse over the header image you wish to delete, click the X.

3. set which page you wish to use this image

To set the header image on a given page, edit the page, and scroll to the ‘Header’ panel.  Here you can choose to have:

  • a specific uploaded header for that page alone
  • no header image shown on this page
  • a random choice from all of the uploaded header images available

after making any changes, click the ‘update’ button

WordPress Upgraded

wordpresslogoOur WordPress version was upgraded to 3.7.1 (Basie) this morning. (Thank you Stuart Norcorss!) You may notice a number of changes in your dashboard.

Subsequent WordPress versions should now auto upgrade. Several plug-in upgrades were also completed at the same time.

We did test these upgrades on a cloned resource before implementing them on Synergy, and did not encounter any problems. If anything does come up, please let me know.


Entering research lab/team details

This short help text explains how Bio PIs can specify a list of their lab/research group/team.  This list will appear on their own School profile page, and on the profile page of team members. This ‘team list’ can also be used elsewhere (for example on pages hosted via the Synergy WordPress service), for example to list research group members in other groups joined by their PI if required.

Time for a PI to do this task: approx 180 seconds (assuming name list in hand or head)

Continue reading

New Responsive Theme

Themes are how WordPress styles your site.  It’s possible to switch to a different theme with minimal effort, and all of your site’s content preserved.

Recently I’ve been developing a new ‘responsive’ theme aimed at research group websites.  The aims of this new design were:

  1. To have a layout which dynamically adapts to different sizes of browsing window.  This means that graphics can be dropped, or change size to fit different kinds of devices.
  2. To have a menu which would also change form at the smallest sizes to accomodate phone based browsers.
  3. To pair back header and other elements to allow content come to the fore.

The theme I’ve been working on derives from the WordPress Twentytwelve theme, with a few functional additions (like hide/reveal for search and a resizing sponsor’s footer area).

You can see some example pages using this responsive theme at the site below.  It’s in a version of the School of Biology livery, but other versions will be available.  To test it on a desktop, visit the site, and then drag your browser to make the window narrower or wider. Watch what happens in the header, and also to page and footer graphics.  There are several pages on the site with slight variations.

If you’d like to find out more, please get in touch.