Category Archives: How To

Notes on how to achieve various effects when working with either event plugin.

Custom post types, taxonomies , capabilities, roles

amr events, Custom Post Types, , , ,

Are you you getting the browser messages when saving a new custom post type draft?

  • Firefox: “This page is asking you to confirm that you want to leave – data you have entered may not be saved.”
  • Internet Explorer: “Are you sure you want to leave this page”
  • Chrome: “The changes you have made will be lost if you navigate away from this page”
  • “Leave page or Stay on page” when you click save draft on a new custom post type?
What happens when you do not have the right capability
What happens when you do not have the right capability
Leave or Stay message in chrome
Leave or Stay message in chrome

What happens?

You opt to leave and the post was still saved but the custom fields etc do not save.  BUT then you CAN edit the post and then add in the custom fields / meta box without any further problem (what the?)

And of course admin’s have no problem!

Why?

This appears to be because we have said that the custom post type supports the default taxonomies and possibly wordpress is trying to do something with javascript (maybe assign a default category to the custom post type) but the user is not allowed to.  However it also happens when the custom post type has tags but not categories?  But it does not happen if it just has the custom taxonomy (with the assign_terms or assign_terms=>edit_events capability).    The behaviour only occurs with default taxonomies.

Key finding:

If you are allowing your custom post type to be assigned categories and tag taxonomies like normal posts, then ANY role that is required to be able to create the custom post type while default taxonomies are supported, must also have ‘edit_posts’ capability. (Unless you have code to change the default taxonomies, but then you will be messing with the standard posts capabilities)

Arguably the wordpress default capability ‘assign_terms’ should not be mapped by default to ‘edit_posts’ as this is what is making life complicated.  Possibly a contributor should have ‘assign_terms’ capability directly?   Or one might say that it’s the sharing of taxonomies that is causing the complication.

Background

I wanted a role that could create events but NOT also create posts.  Similarly with editors.
Custom roles can be setup to manage custom post types (in this case events) and one can isolate these capabilities.  However when one adds taxonomies (default and custom) into the mix, things get more interesting.

Default taxonomy capabilities for categories and tags

$default_caps = array(
 'manage_terms' => 'manage_categories',
 'edit_terms'   => 'manage_categories',
 'delete_terms' => 'manage_categories',
 'assign_terms' => 'edit_posts',
 );

While one could overwrite these capabilities with say ‘assign_terms’=>’assign_terms’, then one would not be able to assign categories and tags to standard post types without also ensuring that the default roles were assigned the capability ‘assign_terms’.  All achievable, it just seems wrong to have to mess with standard wp and risk breaking other plugins.

Registering custom taxonomy means that in this case ‘edit_events’ capability is enough to be able to assign this custom taxonomy to this single custom post type

'capabilities' => array (
 'manage_terms'=> 'manage_categories',
 'edit_terms'=> 'manage_categories',
 'delete_terms'=> 'manage_categories',
 'assign_terms' => 'edit_events'  // strictly speaking need one for each new posttype ?
 )

 

TIP: while you are testing this all out, a role manager plugin like Justin Tadlock’s members plugin is very helpful.  Roles and their capabilities are saved in the database and unless you ‘remove’ the role and add it again, the capabilties will not update as you might want them to.

I was actually trying to create a custom role that can assign categories, tags and custom taxonomies to your custom post type. If you give these roles ‘manage_categories’, they’ll be able to add new categories BUT still not assign a post to existing categories.  They have to have ‘edit_posts’ or obe has to override the default wp setup.

 

How to change icon images (subscribe to calendar, add to google)

amr events, amr ical events list, Css, How To, ,

The plugin comes with two sets of default icons (16px and 32 px).  It also includes extra icons that match those for your use.

screenshot of icon listing
some of the available icons

Don’t like those icons?

You could do one or more of the following:

  1. Switch images off
  2. Use Css to replace the text with your own images
  3. Write own formatting routines

Switch images off

You could choose just to have the link text for the actions behind the icons.  See the “Listing events’ settings.

settings screenshot to show you how to switch images off
Switch images off

Use Css to replace the text with your own images

First switch the default  images off and then use css to show your chosen icons instead.

text replaced with image
text replaced with image

There are various techniques that one can use to replace text with an image. The following was used to demonstrate the above replacement using the plugins html classes.

a.icalsubscribe { 
    display: block;
    height: 50px;
    width: 50px;
    background-image: url(http://i.stack.imgur.com/XtpTm.png);
    background-size: 50px 50px;
    text-indent: -9999px;
    overflow: hidden;
}

Some of the link classes that you may wish to define image icons for are:

  • subscribe
  • icalsubscribe
  • addtogoogle
  • hrefaddtogoogle
  • hrefmap
  • timezone
  • refresh

Add the extra css :

  1. Either to your custom themes stylesheet (not to one that gets updated automatically, because you will lose your modifications), or
  2. use something like jetpacks wordpress custom css, or
  3. use a custom ical events list css

Write own formatting routines

See the pluggable files in each plugin folder.  Use the function there as a base for your new function.  Add your function to your custom themes function.php or to your own site specific snippets plugin.

some pluggable functions in amr-icalevents-list

  • add_cal_to_google
  • add_event_to_google
  • amr_ical_showmap
  • amr_show_refresh_option
  • amr_format_tz

some pluggable functions in amr-events

  • amr_subscribe_to_event_series
  • amr_subscribe_to_event

 

Groupings of events, expanding and collapsing the groupings

amr events, amr ical events list, Css, How To

Events can be grouped in many ways. To set up groupings see this post on event grouping and styling.

Expand and Contract Groupings

To expand and contract groupings, tick the ‘load js’ in the listing events settings

Use js
Use js

and optionally add a shortcode to add text to showall or hideall detail of groupings

[expandall]
[events]
Events collapsed behind groupings
Events collapsed behind groupings
One event grouping expanded
One event grouping expanded

Grouping events

amr events, amr ical events list, Css, How To, Html

Events can be grouped by date formats or by categories, tags or custom taxonomies.

  • Events can be grouped by days, weeks, months and some funkier options that no one will probably ever use, but I liked the challenge! Actually I imagined one could do some seasonal styling perhaps? each grouping has it’s own css classes, and date/time format
  • Grouping also allows one to do timetables (grouped by day), weekly schedules, or monthly, quarterly or seasonal event views.
  • See how to format the date related groupings here.
  • Each grouping comes with css classes so you could for example do seasonal styling of event groups.
  • By adding in the javascript in the settings, one could also expand and collapse the groupings.

Settings

 

Grouping settings
Grouping settings

Styling Groupings – use the css classes

Example of html produced with css classes
Example of html produced with css classes

Complete multi-lingual event website

amr events, amr ical events list, How To,

To achieve a complete multi-lingual website using amr-events and amr-ical-events-list, the following are required:

the wordpress language files

These are required for the day, month etc event time localisations.  See this post for instructions and links.

your theme language files

Some theme language files can be found at http://i18n.svn.wordpress.org/
. You may have to click down various paths as sometimes somelanguages are stored differently.
Danish example: http://i18n.svn.wordpress.org/da_DK/trunk/messages/twentythirteen/

Updated plugin language files

Some folks have kindly provided translations.  You can see the latest available here.   These are not always up to date.  See translation tools below.  If you need to update your language files, please send me the update and I’ll upload it.

If you do NOT send an update, your version may be overwritten in a plugin update unless you move it.

Custom Language File Location

For these two plugins, you can store your custom .mo and .po files in your WP-CONTENT languages subfolder.

Do not use the subfolder /plugins as wordpresss may one day be auto loading translations to that folder.

custom_language_file

Translation tools:

Finally a Language switcher and/or a multi-lingual language plugin. Some plugins that may help:

  • Xili (unverified in recent years)

Demonstration

lang.icalevents.com

Importing events from a csv file

amr events, How To,

Simple ‘flat’ events can be imported from a csv file.  This is possible with a third party csv import plugins. The amr-events plugin attempts to use the wordpress meta data as simply as possible to facilitate this kind of easy integration with other plugins.

Events can be complicated: they can recur, be in different timezones, have exceptions to their recurring definition, have alterations to some instances etc.    These ‘complications’ cannot so easily be imported.

From a brief review of the csv import plugins out there, starting with the self named “ultimate csv importer” and backing away in disappointment, I read reviews of a few others and decided to try the really simple importer.   It worked so nicely and cleanly that I stopped there!

What a pleasure to see a plugin that

  • inserts itself sensibly into wordpress, adding itself under tools > import just where it should be
  • imports the data with limited fuss, very sensibly using the column headings, making sensible defaults for missing fields instead of insisting that they are mandatory data. eg: choose to include a post_status, or let it default to draft and ‘publish’ it later.
  • handles custom fields and custom post types as easily as they should be handled – why should there be a ‘fuss’

 So how to import events?

I suggest you create yourself a test event or two that are similar to the event data that you wish to import.  This is so that you can see the meta data that is created.  The amr events plugin tries to stay close to the ICS RFC spec formats for the data, but is sophisticated enough to cope with a reasonable set of date formats and will work with minimal event data input.   Sample files provided below.   The plugin needs

  • some of the standard wordpress post data, as little as your chosen csv importer will cope with.
    • post_title
    • post_content
    • post_type = event (or whatever you have in your settings, or load as post and change afterwards if your csv importer is a bit ‘dumb’.)
  • a minimal set of event meta data (see example file for variations):
    • _DTSTART in RFC format eg: 20140402T090000   or 20140402
  • optional extras:
    • _DTEND  (to define any timed events or events of greater than 1 day.  NOTE RFC 5545 says _DTEND ends on NEXT day for one day events – be careful what you define and test it!)
    • _timezone (if timezone differs from UTC or your website timezone – careful testing with your setup)
    • _allday (timed or allday)
    • _LOCATION
    • see your sample events post-meta in phpmyadmin for more possibilities.

Notes:

  • It is probably not practical to try CSV importing recurring _RRULE data or detailed duration data (use DTEND rather)
  • If you experience any problems, please consider carefully whether it is a problem with your chosen CSV importer and if so, log your support query there.
  • If some data goes in a bit wonky – maybe you set it up a bit wrong, the amr-events plugin does try to correct things – update the post and save.

Screenshots:

imported csv events
variety of events with various data supplied or omited
really simple csv import screen
really simple csv import screen

 

import csv menu
The csv import option is right there in the wordpress import menu – exactly the right place

Example Event CSV file:

minimal_events

Styling the dates

Css, How To

I received a question about whether the plugin could style dates in the way the little purple date is shown in the header image of the website and the plugins wordpress page.

a real life example
a real life example

 

The calendars shown in the header are taken from real live examples of the plugin being used in various sites.  The sites will in many cases have added custom css to style the events lists to match their themes.

With a combination of the date and time formats in the settings for each list and some css, almost anything is possible.

The key is that one can add extra characters into the php date format string.  If the characters are the same as a date format character, one can ‘escape’ them with a preceding backslash.

Sooo…. one could for example add some html to isolate part of the date for css styling purposes.   The image below shows the date and time format settings for a event list.   Note the format string for the day.   It surrounds the month with a span.

\<\s\p\a\n\>M\<\/\s\p\a\n\>j
adding html to the date format
Date format settings for a event listtype

Then one can spice it up with some custom css.  To prove this, I have used the power of the firebug browser add-on to add some element css to show you what could be done.  I’d put the text-align: center at a higher level actually – no need to repeat it.

You of course would add the css for the event date class and the span within it to your theme or to a custom calendar css file.

Example styling of a month and day (prof of concept facilitated by firebug browser add-on)
Example styling of a month and day (prof of concept facilitated by firebug browser add-on)

Finding the Facebook events ics feed for subscribing or syncing

amr ical events list, How To

I’m not a fan of facebook…..however I get asked the questions, so have had to develop some familiarity, so here’s a quick reference until facebook changes things again.

Before you get too stuck in to facebook for your events,  look at oreilly.com’s advice on perhap not using facebook as the home for your public events.

Finding that public events ics feed in facebook

From a facebook ‘page’

They really do not make it easy do they ?  There is no obvious ‘Export all’ as there is in the personal page.  So…Pretend you’re only exporting one event from your page.

Example fb page
Example Facebook page – events page

Click the event

The facebook events lists, click export.

Click export.

Choose subscribe to all events, or right click and copy the link address

Copy that webcal ics address and use it wherever you need to subscribe to that set of events.

From a personal homepage

After logging in look for the export events option, not just for one event but ALL upcoming events.

Go to your all events page:   https://www.facebook.com/events/list.

Click "Export"In the top right corner, see the little gear icon, click it and click the export option.

 

You should get a popup window.

export facebook ics
export facebook ics

If you just want the url to subscribe to it from another application, right click and ‘copy the link address’. Paste it in to your calendars subscribe url option.

Alternatively if you just click on it, your calendar application should open up and hanlde the subscription process for you.

Use it in the ical events plugin?

facebook in shortcode
facebook in shortcode

Bear in mind that the plugin caches the url’s, so you may need to force a refresh (add ?refresh) to the calendar page url and refresh the page in your browser.

eg:

 

Other possibly useful references:

Table css, overlapping or disappearing sidebars

Css

Table widths and css

Tables are wonderful  – they expand beautifully and naturally to fit your content, but sometimes that same content can make the table do  weird things.

Loooong Urls

Please be sure to test your css in your theme with representative content.

The plugin tries to deal with some of the problems that occur.  For example long urls that can make a table expand too much.   See also plugin-and-theme-css-not-working-well-together.

Sometimes the only way to really sort a table width out is to “fix” the width of the table and/or the table cells.    Now this the plugin has to leave this to you – some people have wide content areas, some not.  Some have lots of info displayed,  others have minimal.

The plugin has no way of knowing what size would work best for you.

I suggest that you use something like firebug to see what your theme is doing (or not doing!) and then google table+css+width for ideas on what might work with your theme.   You know the size of content area that your calendar or agenda list must fit into and perhaps simply setting the width of the table and/or the table cells will be the answer.

Coping with a wide table

A suggestion from 456bereastreet.com

Css3 options:

  • word-wrap: break-word has some browser support
  • word-break: (normal, break-all, keep-all) aimed at dealing with mixed character sets.  Random Break Point.

Resources:

See posts on this site tagged css.

Google indexation and pagination

How To, , ,

For best google indexation and search engine crawler bandwidth management, please read this post and then check your events website:

Events date navigation  and rel=”next” and rel=”prev”

Main calendar canonical tag

  • Your main calendar page should have a canonical tag in the header
  • wp default themes already generates a canonical tag for pages
  • Assists in telling google that alternate views are just that – ie: “alternate” and not duplicate data. EG: if you are showing views like agenda and calendar, the default first view will have the canonical tag.

Use Google webmaster parameter tools

You may wish to tell google to ignore certain parameters (eg not to ‘crawl’ into the future? ) – or maybe not… your call

  • this could maybe reduce the impact of google crawlers – else they get so clever now, they try t o follow all GET and POST parameters.
  • some parameters that may be in use in your calendar and widget date navigation are:
    • days,
    • months,
    • events,
    • start,
    • startoffset,
    • agenda,
    • calendar

Judicious use of upcoming events widgets

Think carefully about Seo, sidebars, widgets and what pages have sidebars.  Should  that events  calendar and upcoming events list be on every pageand post? Some notes: