Tutorials – Events Manager for WordPress http://wp-events-plugin.com Event Registration, Bookings, Calendars, Locations Sun, 10 Jun 2018 18:01:32 +0000 en-US hourly 1 https://wordpress.org/?v=4.9.6 17180428 Integrating with MultiSite Global Tables Mode http://wp-events-plugin.com/tutorials/integrating-multisite-global-tables-mode/ http://wp-events-plugin.com/tutorials/integrating-multisite-global-tables-mode/#respond Thu, 16 Nov 2017 13:08:50 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=3169 We’re continuing our series of tutorials for our custom add-on called “Styles” by taking a few more steps to make sure it is fully integrated with the MultiSite Global Tables mode in Events Manager. We had previously added a custom conditional placeholder for styles. MultiSite allows WordPress administrators to create

The post Integrating with MultiSite Global Tables Mode appeared first on Events Manager for WordPress.

]]>
We’re continuing our series of tutorials for our custom add-on called “Styles” by taking a few more steps to make sure it is fully integrated with the MultiSite Global Tables mode in Events Manager. We had previously added a custom conditional placeholder for styles.

MultiSite allows WordPress administrators to create separate blogs within their WP installation. MultiSite Global Tables Mode (we’ll call it global tables for the rest of this tutorial) is a special Events Manager feature which allows you to publish events on different blogs in that network, but display and search them on other blogs.

In many cases, your implementation will automatically work with this mode, however in our tutorial there’s a few extra steps we need to take, and we’ll take the opportunity to highlight the nuances you should be aware of when creating an add-on that you’d like to work with global tables.

Current status of our add-on

Up until this point, our add-on would ‘sort of’ work on global tables mode. Our ‘style’ shortcode attribute would be registered properly, it’d add the right conditions to search our database tables as well as adding the search form field on every blog.

The main issue would be with how styles are stored. Currently, styles are stored on a per-blog basis, meaning you could create a set of styles on your main blog, and another blog admin could add a whole different set of styles on your other blogs. The problem here is that if you’re trying to do something like this:

[events_list blog=”1,2,3,4″ style=”1″]

The style ID 1 will represent different styles on each blog, so your search results will be incorrect. What we want to do here, is make sure that styles are controlled from a central location, so that ‘Super Style’ with ID 1 will be the same on all blogs of the network.

Creating global options

Since we’re storing our styles in the wp_options table (which we wouldn’t recommend doing for an add-on like this, we’re just demonstrating the possibilities), every blog has its own options table and therefore grabs style information from there. What we want to do is make sure that option name is stored somewhere that all blogs will access, and this is pretty easily achieved by adding the following snippet of code:

add_filter('em_ms_globals', 'my_em_styles_ms_globals', 10, 1);
function my_em_styles_ms_globals( $globals ){
	if( EM_MS_GLOBAL ) $globals[] = 'my_em_styles';
	return $globals;	
}

What happens here is we’re hooking into the  filter, which allows us to declare certain fields usually stored in the wp_options table on the wp_sitemeta table instead, which is essentially an options table for your network when running multisite. Events Manager does this for various options when in multisite mode that are shared at a network level, such as email settings, and allows you to add your own.

On line 3, we check if we’re in global tables mode by checking the EM_MS_GLOBAL constant which will either be true or false, and if so, we add our my_em_styles option. We do this since we only want styles to be available globally with global tables enabled, and not just multisite in general.

Note that if in multisite but not in global tables mode, EM_MS_GLOBAL will be false as well, you can check if multisite is enabled with the WP is_multisite() function, or test for multisite without global tables like so:

if( is_multisite() && !EM_MS_GLOBAL )

Restricting admin menus to main blog

The second thing we’ll want to do is restrict the styles admin menu to just the main blog. In our first step of this tutorial, we created admin pages to add/edit styles we could then assign to events. At this point, if an admin edits a style on one blog, it’ll be edited on all blogs. Since many multisite setups usually have different admins for different blogs, we’ll limit the ability to add styles only to the main blog, by tweaking the code we originally added so it becomes:

function my_em_styles_submenu () {
	if( !EM_MS_GLOBAL || is_main_site() ) {
   		$plugin_page = add_submenu_page('edit.php?post_type='.EM_POST_TYPE_EVENT, 'Event Styles', 'Styles', 'edit_events', "events-manager-styles", 'my_em_admin_styles_page');
  	}
}
add_action('admin_menu','my_em_styles_submenu', 20);

What we did here is wrap the function that adds our submenu page in an if statement that will run that function if either we’re not in global tables mode, or we’re on the main site of the network. By doing this only the main blog admin can add or edit styles, and admins of other blogs can add those styles to their events.

Further considerations

Whilst we’ve mentioned about how inefficient storing styles in the wp_options table, it has allowed us to demonstrate how you can declare global options that are shared across a network.

A more ‘elegant’ approach would have been to store this data in the wp_em_meta table. By doing this and using the EM_META_TABLE php constant to refer to that table (which we recommend in any situation), all data would have been stored on the global table automatically. Any custom EM data you’d want to be persistent across your network can be stored there, and then you wouldn’t have had to worry about global options in that case when accessing that data.

You would, however, have had to decide about whether to restrict your styles admin page to the main blog.

 

Next Steps…

We now have a fully functional, multisite-ready, add-on! We’re entering the final chapter of our styles tutorial which will create some special pages based off our events page which will allow us to display a list of styles and a page for each style showing all of its associated events.

The post Integrating with MultiSite Global Tables Mode appeared first on Events Manager for WordPress.

]]>
http://wp-events-plugin.com/tutorials/integrating-multisite-global-tables-mode/feed/ 0 3169
Using Additional Custom Taxonomies http://wp-events-plugin.com/tutorials/using-additional-custom-taxonomies/ http://wp-events-plugin.com/tutorials/using-additional-custom-taxonomies/#comments Tue, 21 May 2013 12:35:03 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=2390 Events Manager automatically makes any taxonomy associated with events or locations searchable/filterable using our shortcodes and PHP listing functions. Update : Since version 5.8 we have base classes you can extend and duplicate the features available in our own taxonomies, including uploadable images, color picking and associated placeholders. This tutorial

The post Using Additional Custom Taxonomies appeared first on Events Manager for WordPress.

]]>
Events Manager automatically makes any taxonomy associated with events or locations searchable/filterable using our shortcodes and PHP listing functions.

Update : Since version 5.8 we have base classes you can extend and duplicate the features available in our own taxonomies, including uploadable images, color picking and associated placeholders. This tutorial is still accurate, but will be updated in the future to provide more information on extending our own classes. Meantime, developers will be interested in seeing how we do this with our own classes, such as with EM_Category and EM_Categories

Using other Plugins to help

There are various plugins which allow you to create custom taxonomies and associate them (or already present taxonomies) with existing custom post types. Since Events and Locations are custom post types, you can achieve the same effect using these plugins if you’d rather not add any code.

Two recommended plugins for the task are:

The end result is the same as coding this out, so we’ll explain what to do once you’ve added a taxonomy to Events or Locations further down.

Examples : Add existing taxonomies

We’re assuming you’ve already registered a taxonomy, or are using previously created taxonomies. We won’t cover registering a new taxonomy, for that, see the already-comprehensive instructions on the WordPress Codex.

The principle is exactly the same for any taxonomy you’d like to add, here’s the code:

function my_em_own_taxonomy_register(){
    register_taxonomy_for_object_type('custom_category',EM_POST_TYPE_EVENT);
    register_taxonomy_for_object_type('custom_category',EM_POST_TYPE_LOCATION);
    register_taxonomy_for_object_type('custom_category','event-recurring');
}
add_action('init','my_em_own_taxonomy_register',100);

Seriously, it’s that easy. What we’ve done above is add the ‘custom-category’ taxonomy to both Events and Locations, and is now available to your shortcodes and other object functions as custom_category .

Here’s another common example, adding the Event Tags and Categories that ship with Events Manager:

function my_em_own_taxonomy_register(){
    register_taxonomy_for_object_type(EM_TAXONOMY_CATEGORY,EM_POST_TYPE_LOCATION);
    register_taxonomy_for_object_type(EM_TAXONOMY_TAG,EM_POST_TYPE_LOCATION);
}
add_action('init','my_em_own_taxonomy_register',100);

Notice the slight difference here, which is we’re using constants to name the taxonomies, you could just as easily use ‘event-categories’ and ‘event-tags’, but since we define these as constants this is a ‘configuration-safe’ approach.

Exceptions : Post Tags and Categories

One final common example which has a slight twist – adding the normal posts category to your events and locations:

function my_em_own_taxonomy_register(){
    register_taxonomy_for_object_type('category',EM_POST_TYPE_EVENT);
    register_taxonomy_for_object_type('category',EM_POST_TYPE_LOCATION);
    register_taxonomy_for_object_type('category','event-recurring');
}
add_action('init','my_em_own_taxonomy_register',100);

Now your Events and Locations can assign and search for post categories. The twist is when using this in your search attributes, since we already use category and tag, you need to use post_category and post_tag instead.

Using Custom Taxonomies in searches

Once you’ve added the taxonomy to Events or Locations, it’s time to search! You can do this using shortcode or PHP. Here’s an example of both ways to search the post categories we added above.

Shortcode:

[events_list post_category=”featured,-hidden”]
[locations_list post_category=”featured,-hidden”]

Code:

echo EM_Events::output( array('post_category'=>'featured,-hidden') );
echo EM_Locations::output( array('post_category'=>'featured,-hidden') );

The two examples above search for events and locations respectively which contain the featured category but not the hidden category.

Note that when filtering with taxonomies, both events and locations are not considered here, only one or the other. That means if you want to filter locations by a specific taxonomy, you use location functions and shortcode and vice-versa.

The post Using Additional Custom Taxonomies appeared first on Events Manager for WordPress.

]]>
http://wp-events-plugin.com/tutorials/using-additional-custom-taxonomies/feed/ 26 2390
Using Theme Templates for Event and Location Pages http://wp-events-plugin.com/tutorials/using-theme-templates-for-event-and-location-pages/ http://wp-events-plugin.com/tutorials/using-theme-templates-for-event-and-location-pages/#comments Tue, 26 Mar 2013 13:03:39 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=2329 Since Events Manager 5.3.7, you can now choose to display your event and location pages using templates provided by your theme. This is useful when you’d like to make use of various layouts your theme provides. Unfortunately, this won’t always work by just choosing your template and we’ll explain why,

The post Using Theme Templates for Event and Location Pages appeared first on Events Manager for WordPress.

]]>
Since Events Manager 5.3.7, you can now choose to display your event and location pages using templates provided by your theme. This is useful when you’d like to make use of various layouts your theme provides.

Choose your templates for event and location pages

Unfortunately, this won’t always work by just choosing your template and we’ll explain why, and hopefully how to get it working.

Whilst this is very convenient, this is not necessarily a ‘WP Way’ of doing things. This is because templates are ‘meant’ for normal WP pages, and due to this some themes also depend on various classes WordPress or the theme itself inserts into certain elements of your site HTML. We sort of ‘trick’ WP into loading a page template rather than the default ‘post’ template which Custom Post Types use (which is what events/locations are).

This is probably why you’re here, because you’ve chosen a specific template to be used, but it’s producing unexpected results.

Fortunately in most cases, these are the body_class and post_class hooks, meaning we also allow you to add classes to event and location pages, which may not get added automatically. We’ll show you an example of what can be done with this.

This is actually the case with TwentyTwelve and using a full-width page. We’ll show you how to figure out the missing link and then hopefully you can use this same method to detect the subtle differences between templates and add the relevant classes to make the event/location pages look like they’re meant to.

As you can see in the first screenshot, we’re going to select the Full-width Page Template, No Sidebar page template provided by TwentyTwelve from your Events > Settings > Pages tab in your admin dashboard. When you save this setting, and visit an event page, you’ll see that whilst the sidebar is gone, there’s a big gap where the sidebar once was:

These two sections provide information for CSS styling

What we need to do here is look at a normal page using this template, and figure out what class name specifically triggers this unique CSS styling behaviour. Visit a normal page on your browser, and inspect the HTML source of this page. In our case, we use Google Chrome, right-click and choose ‘inspect element’, which brings up an easy to read tree of elements on your page:

Before adding the correct classes

As you can see, there is a specific set of classes generated for each page, which themes make use of, the body classes and the post classes, highlighted above respectively. In this case, there is only one class that makes the magic happen, and that’s the full-width class in the body.

After adding full-wdith, the page displays correctly!

To fix our event page, we simply revisit the settings area in the first screenshot, and in the Body Classes text box, enter full-width and save your settings. Now look at the event page again:

That’s it! You now have a full width events page.

Whilst every theme can use different class names, or other methods entirely, this should help you debug the majority of themes when trying to create a unique look. If you still run into problems, you may want to consider the ‘original’ and ‘WP way’ of doing things, which involve creating your own template for events and locations (single-event.php and single-location.php files).

The post Using Theme Templates for Event and Location Pages appeared first on Events Manager for WordPress.

]]>
http://wp-events-plugin.com/tutorials/using-theme-templates-for-event-and-location-pages/feed/ 18 2329
Setting up W3 Total Cache for Events Manager http://wp-events-plugin.com/tutorials/setting-up-w3-total-cache-for-events-manager/ http://wp-events-plugin.com/tutorials/setting-up-w3-total-cache-for-events-manager/#comments Tue, 08 Jan 2013 14:15:40 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=2235 W3 Total Cache is currently one of the most popular caching plugins for WordPress. If set up correctly, it can significantly reduce the time it takes to load your website pages as well as the load on your server. Events Manager and Events Manager Pro already works out the box

The post Setting up W3 Total Cache for Events Manager appeared first on Events Manager for WordPress.

]]>
W3 Total Cache is currently one of the most popular caching plugins for WordPress. If set up correctly, it can significantly reduce the time it takes to load your website pages as well as the load on your server.

Events Manager and Events Manager Pro already works out the box with W3TC, but there are certain settings, particularly surrounding the CDN which you can tweak and get the best out of both plugins.

This isn’t a comprehensive tutorial and we’re assuming you have already set up W3TC correctly, there are plenty of great tutorials out there already, these are recommendations specifically geared towards sites using both Events Manager and W3TC together.

1. Page Caching? Registered Users vs. Visitors

Page caching can be a great help, since your site is not repeatedly regenerating the same page over and over again. This can really make a difference when you’re displaying many events on one page, or calendars containing hundreds of events, since minimal CPU work is needed to regenerate these pages once cached.

One caveat you may experience is if you’re caching pages for both visitors and registered users. Since Events Manager serves up different booking forms to registered and guest users, some being unique to each visitor, you should not serve cached versions of these pages.

There’s two options here, and the right one really depends on how your website works and what content you display to your registered users vs. non-registered users.

Don’t cache pages for logged in users (recommended)

If you’re displaying different content unique to each user (e.g. the WP Bar at the top, user account info, etc.) then chances are you’ll want to just check the ‘Don’t cache pages for logged in users’ option. Whilst your logged in users won’t get cached pages, this will still help significantly by reducing the load your visitors impose on your servers . Since visitors will always see the same page content you can safely serve them cached pages, including those containing our booking forms etc.

w3tc-cached-users

Cache pages for both registered and guest users

If you can display the same content to both registered and non-registered users, then you will need to prevent event pages containing booking forms form being cached. Also, bear in mind that conditional placeholders such as {is_logged_in} may not work as expected.

You can selectively choose to not cache event pages by adding this to your cache exception list e.g. /events/*

w3tc-cached-exceptions

If you do go this way, you may want to consider changing the permalink slugs of locations and categories (in Events > Settings > Pages > Permalink Slugs in your wp admin area) so they are hosted outside of your events url pattern, so that only single event pages are cached. Since location pages won’t change from user to user then it would be wise to let these pages be cached.

2. Make sure W3TC includes our scripts, styles and images

If you’re using CDN (which is recommended by the way) then you’ll want to make sure that W3TC includes JavaScript, CSS and images which are related to Events Manager.

This is very easy, simply visit the CDN settings page of W3TC and scroll down to the advanced panel and find the Custom file list: option. Enter these values below the ones already there, each on a new line.

wp-content/plugins/events-manager-pro/includes/js/*
wp-content/plugins/events-manager/includes/css/*
wp-content/plugins/events-manager/includes/js/*

w3tc-cached-cdn-custom

If you have been using Events Manager for a while, earlier versions of the plugin used to store images in a specific folder, so you may want to add this line as well:

wp-content/uploads/events-manager/*

3. Make sure thumbnails get cached too

If you’re using TimThumb to cache images, you may also need to add some special rules to your CDN in order for these images to get cached,  we have made a separate tutorial for those using Amazon CloudFront.

Alongside that, you also need to add another rule to the custom file list in step 2:

wp-content/plugins/events-manager/includes/thumbnails/timthumb.php

If you are using normal WP Thumbnails, which you can choose to do in our Settings > General > Performance Optimization (as of EM 5.3.3) settings, then W3TC should already be using the CDN to serve these files.

The post Setting up W3 Total Cache for Events Manager appeared first on Events Manager for WordPress.

]]>
http://wp-events-plugin.com/tutorials/setting-up-w3-total-cache-for-events-manager/feed/ 6 2235
Caching thumbnails generated by TimThumb http://wp-events-plugin.com/tutorials/caching-thumbnails-generated-by-timthumb/ http://wp-events-plugin.com/tutorials/caching-thumbnails-generated-by-timthumb/#comments Sat, 29 Dec 2012 16:13:02 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=2200 UPDATE: As of Events Manager 5.5.4 we’ve stopped using TimThumb since the script is not being maintained anymore. We wrote a post about it, describing the reasons for stopping using TimThumb and the alternatives available, please read that for more information. Events Manager uses TimThumb to generate images. This is

The post Caching thumbnails generated by TimThumb appeared first on Events Manager for WordPress.

]]>
UPDATE: As of Events Manager 5.5.4 we’ve stopped using TimThumb since the script is not being maintained anymore. We wrote a post about it, describing the reasons for stopping using TimThumb and the alternatives available, please read that for more information.

Events Manager uses TimThumb to generate images. This is a great bit of script that makes showing thumbnails of any size very quick and very easy.

The major downside of TimThumb though is that every time you show a thumbnail on your page, the link to the image is actually to a timthumb.php file which then generates a thumbnail or grabs a cached version from our uploads/em-cache directory. The fact that there already is some form of caching is great, however there is a unecessary load on the server since each time you request a thumbnail some PHP processing is needed to serve the file. This becomes a bigger problem when you’re showing many thumbnails on one page and/or have high volumes of traffic.

Fortunately there is a solution! In particular you can use the combination of a caching plugin along with a CDN, which can store cached versions of your timthumb images without accessing your server each time for the same thumbnail.

In this example, we’ll highlight how you can use the popular W3 Total Cache plugin and Amazon CloudFront. This tutorial expands on suggestions already made by Ben Gillbanks at BinaryMoon (current maintainers of TimThumb).

We’re not going to cover how to set up W3TC, we’ll assume at this point you’ve already successfully set up a CloudFront CDN and your normal images, stylesheets and scripts are already being correctly served by the CDN. If you look at a thumbnail generated by EM, you’ll notice that it is not being served by the CDN yet, as there’s two steps you need to take.

1. Add a Behaviour for TimThumb on CloudFront

By default, CloudFront urls will not accept and pass on Query Strings, meaning timthumb.php will not receive the relevant information it needs to find the right thumbnail and return the right size. However, it is very easy to add a rule to your CloudFront account which will allow this to happen.

Firstly, visit your CloudFront management console, you will see a list of your current distributions as seen below. You then need to access the distribution settings for the site you are working on by clicking the information icon (the grey i icon).

Then, visit the Behaviours tab, the screenshot below shows a CDN with the behaviour we’ll be adding already there, chances are you’ll only see one row.

Now you’ll create a behaviour which will allow timthumb.php requests to have querystrings passed on. Click the Create Behaviour button and fill out the form to contain these values:

Path Pattern : */timthumb.php
Origin : Choose an origin from the dropdown, by default you only have one to choose
Forwarded Query Strings : Yes

You’re done configuring CloudFront. In the event that you’ve done this step after step 2, if you test this out you’ll still see errors because you are still viewing incorrectly cached versions of your thumbnails, you should visit the invalidations tab (or use the purge tool in W3TC) and invalidate the current cache of your timthumb.php file. After a few minutes it will start working as expected.

Now onto configuring W3TC

2. Configure W3TC to use the CDN for TimThumb images

Visit your W3TC CDN settings and scroll down to the advanced options.

You’ll see an option called Custom file list, in this textbox add a new line and write timthumb.php or alternatively the full path to your Events Manager timthumb file which is by default wp-content/plugins/events-manager/includes/thumbnails/timthumb.php

Save your settings, purge your page cache  if applicable.

3. Test your site

That’s it! It’s time to check out your site, if you view the source of your thumbnails they should now be pointing to your CloudFront CDN url!

If all is done well, then you should start seeing decreased page loading times and server loads.

The post Caching thumbnails generated by TimThumb appeared first on Events Manager for WordPress.

]]>
http://wp-events-plugin.com/tutorials/caching-thumbnails-generated-by-timthumb/feed/ 12 2200
Modifying the Event Calendar HTML http://wp-events-plugin.com/tutorials/modifying-the-event-calendar-html/ Thu, 28 Apr 2011 23:27:13 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=459 The event calendar, as with most other part of Events Manager, can be modified using template files. By adding a specific file to your theme folder which overrides the default calendar format, you can use the information passed on by Events Manager to generate the calendar to your exact specifications. There are

The post Modifying the Event Calendar HTML appeared first on Events Manager for WordPress.

]]>
The event calendar, as with most other part of Events Manager, can be modified using template files. By adding a specific file to your theme folder which overrides the default calendar format, you can use the information passed on by Events Manager to generate the calendar to your exact specifications.

There are two files for calendars, both which are located within the templates/templates folder:

  • calendar-full.php – This is the full calendar, which is called if you modify your Event Page settings or use full=1 in shortcodes or ph functions.
  • calendar-small.php – This file is used to generate widgets and default calendars where the full=1 attribute was not passed.

There are two variables which are made available to you inside both files:

  • $calendar – contains an array of information regarding the calendar and is used to generate the content
  • $args – the arguments passed to EM_Calendar::output() and was used by EM_Events::get() to retrieve the correct event information

$calendar looks something like this (this is not PHP, just the summarized result of a print_r statement):

Array(
	[cells] => Array(
		[2011-03-28] => Array(
			[date] => 1301270400
			[type] => pre
			[link_title] => Event Name
			[link] => http://mysite.com/events/2011-03-28/
			[events] => Array (
				[0] => EM_Event Object
			)
		)
		[2011-03-29] => Array	(
			[date] => 1301356800
			[type] => pre
		)
		[2011-04-01] => Array	(
			[date] => 1301616000
		)
		[2011-04-02] => Array	(
			[date] => 1301702400
			[link_title] => Event Name 1, Event Name 2, etc.
			[link] => http://mysite.com/events/2011-04-02/
			[events] => Array (
				[0] => EM_Event Object
				[1] => EM_Event Object
				etc.
			)
		)
		.....
		[2011-04-30] => Array (
			[date] => 1304121600
		)
		[2011-05-01] => Array	(
			[date] => 1304208000
			[type] => post
			[link_title] => Event Name 1, Event Name 2, etc.
			[link] => http://mysite.com/events/2011-05-01/
			[events] => Array (
				[0] => EM_Event Object
				[1] => EM_Event Object
				etc.
			)
		 )
	)
	[month_start] => 1301616000
	[month_next] => 5
	[year_next] => 2011
	[month_last] => 3
	[year_last] => 2011
	[links] => Array(
		[previous_url] => ?ajaxCalendar=1&month=3&year=2011&
		[next_url] => ?ajaxCalendar=1&month=5&year=2011&
	)
	[row_headers] => Array (
		[0] => M
		[1] => T
		[2] => W
		[3] => T
		[4] => F
		[5] => S
		[6] => S
	)
)

$calendar[‘cells’] will contain an array with the exact number of days required to fill a calendar grid format. Each array item has a yyyy-mm-dd date key and can contain various attributes:

  • date (required) – This is a unix timestamp of that date.
  • type – The type of date which can consist of three possible values, pre, post and today, which if present means that this day in question falls in the previous month, next month or today respectively
  • link_title – The title of the anchor tag linking to the calendar day page.
  • link – The link to the full list of events that day.
  • events – An array of EM_Events which occur on that day.

Aside from the individual day information, some more variables are passed on to aid in making this calendar work.

  • month_start – timestamp for the first day of the month
  • month_next – next month number value (1-12)
  • year_next – next year number value (e.g. 2011)
  • month_last- next month number value (1-12)
  • year_last– next year number value (e.g. 2011)
  • links – An array of the previous and next links
  • row_headers – Array of calendar column header names for $calendar[‘cells’] which will always divide evenly by the number of row_headers

Using the above information, you can determine everything you need to display custom calendars, or just make minor changes to the current calendar templates. Simply copy either or both calendar templates to your theme folder as instructed here and make your changes.

The post Modifying the Event Calendar HTML appeared first on Events Manager for WordPress.

]]>
459
Modifying Event Location Google Maps http://wp-events-plugin.com/tutorials/modifying-event-location-google-maps/ Thu, 28 Apr 2011 03:20:59 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=430 “How do I modify the centering of the maps?” “How can I do x to the maps?” These are very common (and valid) questions! Currently, integration with Google Maps is fairly limited and is something we intend to remedy in the future. However, as always we try to make it possible

The post Modifying Event Location Google Maps appeared first on Events Manager for WordPress.

]]>
“How do I modify the centering of the maps?”
“How can I do x to the maps?”

These are very common (and valid) questions! Currently, integration with Google Maps is fairly limited and is something we intend to remedy in the future. However, as always we try to make it possible for developers to do their thing in a upgrade-safe manner.

How Google Maps work in Events Manager

Firstly, let me quickly explain how maps work in Events Manager (this will probably go into documentation rather than tutorials in the future).

Google Maps itself is loaded and handled purely by javascript, all of it located within the includes/js/events-manager.js file (or events-manager-source.js for viewing purposes 4.0 onwards). When maps are “created” by Events Manager, it just creates the grey loading map div class and a couple of other elements with some data for the javascript to retrieve and use to build the maps. Here’s what’s output by a single event map:

<div id="em-location-map-f3d18" class="em-location-map" style="background: #<span class=;">CDCDCD; width: 400px; height: 300px">Loading Map....</div>
<div class='em-location-map-info' id='em-location-map-info-f3d18' style="display:none; visibility:hidden;">
<div class="em-map-balloon" style="font-size: <span class=;">12px;"></div>
		<div class="em-map-balloon-content" >Balloon Content Here</div>
	</div>
</div>
<div class='em-location-map-coords' id='em-location-map-coords-f3d18' style="display:none; visibility:hidden;">
	<span class="lat">123</span>
	<span class="lng">123</span>
</div>

As you can see there’s two hidden divs with the balloon contents and also some coordinate information for Google Maps to center on. When a page is loaded, the javascript checks for the location map divs by class and loads google maps only if it finds one.

After loading the map, a specific jQuery event is triggered, called em_maps_location_hook, which passes the map data onto event listeners.

Modifying maps with javascript

To make modifications via javascript, you need to bind a function to this javascript event, you can do this at any point in your theme or in another javascript file:

jQuery(document).bind('em_maps_location_hook', function( e, map, infowindow, marker ){
	....
});

The three variables this function accepts are:

  • map – this is a Google Maps Map object
  • infowindow – a Google Maps InfoWindow object attached to marker
  • marker – the Google Maps Markerobject attached to map

The map has been loaded, so at this point the changes you make are final.

For the global maps, it’s the same principle, except the hook is called em_maps_locations_hook and one variable is supplied which is an array of markers.

Modifying maps with templates

The HTML generated resides in two files that you can override using template files to customize the HTML, and you could even remove the classes that trigger the Javascript and handle it yourself. The maps templates are located in two places:

  • templates/map-global.php – this is the multi-locations map
  • placeholders/locationmap.php – this is #_LOCATIONMAP placeholder

The post Modifying Event Location Google Maps appeared first on Events Manager for WordPress.

]]>
430
Trigger a Plugin Update or Activation http://wp-events-plugin.com/tutorials/trigger-a-plugin-update-or-activation/ Thu, 28 Apr 2011 00:58:28 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=387 There have been some occasions in the past where for some reason or another when updating the plugin, the right functions were not fired which are sometimes to update parts of Events Manager such as the database structure or updating settings. In most cases, this is easily remedied by deactivating

The post Trigger a Plugin Update or Activation appeared first on Events Manager for WordPress.

]]>
There have been some occasions in the past where for some reason or another when updating the plugin, the right functions were not fired which are sometimes to update parts of Events Manager such as the database structure or updating settings.

In most cases, this is easily remedied by deactivating and reactivating the theme, but sometimes this still doesn’t trigger the update. The way to force an update is to go to yoursite.com/wp-admin/options.php and look for a dbem_version value.

Whatever that value is, lower it by the minimum amount possible. For example this screenshot shows version 4.019, so we want to set this to 4.018 and click the save button at the bottom.

Now, we just need to go to the plugins page and de/reactivate the plugin.

The post Trigger a Plugin Update or Activation appeared first on Events Manager for WordPress.

]]>
387
Overriding Event Page Content With Filters http://wp-events-plugin.com/tutorials/overriding-event-page-content-with-filters/ Wed, 27 Apr 2011 22:56:53 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=458 When users access the events page, Events Manager decides what to show based on the rest of the URL. So, for example, mysite.com/eventspage/locations/ or mysite.com?p=x&locations_page=1 would return a list of current locations. There may be times where you want to override certain content generated by Events Manager either replacing it

The post Overriding Event Page Content With Filters appeared first on Events Manager for WordPress.

]]>
When users access the events page, Events Manager decides what to show based on the rest of the URL. So, for example, mysite.com/eventspage/locations/ or mysite.com?p=x&locations_page=1 would return a list of current locations.

There may be times where you want to override certain content generated by Events Manager either replacing it entirely, replacing parts, or adding to the default html generated. If we use the wordpress filters em_content and em_content_pre, we can intercept the output process and add what we need.

This tutorial provides a brief explanation of these two filters, they are covered in more depth on our tutorial page, creating a custom event information page.

em_content_pre

This filter is best used if you want to prevent Events Manager from trying to output content altogether. In some cases you may want to add your own custom pages, and therefore it would make sense to check for this first before EM goes and does unnecessary work.

This works pretty much exactly like em_content, except a second parameter is passed to your function, which is the original content of the wordpress page that will be overwritten by Events Manager. To find out how to use em_content_pre, see our tutorial page, which makes use of this filter when building an example add-on for Events Manager.

em_content

If you need to add certain content to event pages, or do further processing on the HTML output of Events Manager, this is the filter for you!

function my_em_custom_content($content){
	if( /* Do something here to decide whether to override */ ){
		$content .= "Here, I'm adding this extra text to the end of my event content.";
	}
	//Whatever happens, you must return the $content variable, altered or not.
	return $content;
}
add_filter('em_content','my_em_custom_content');

Note that if you want to change the title text (e.g. the texts that appear in your window title bar and the title of the event), you should also hook into the em_content_page_title filter, which works exactly like the em_content filter. In fact, you only should need to change your function name (so there’s no duplicates), filter name and custom content to get this to work:

function my_em_custom_content_title($content){
	if( /* Do something here to decide whether to override */ ){
		$content .= "My Custom Title";
	}
	//Whatever happens, you must return the $content variable, altered or not.
	return $content;
}
add_filter('em_content_page_title','my_em_custom_content_title');

The post Overriding Event Page Content With Filters appeared first on Events Manager for WordPress.

]]>
458
Creating Custom Permalinks in WordPress http://wp-events-plugin.com/tutorials/creating-custom-permalinks-in-wordpress/ Wed, 27 Apr 2011 17:09:57 +0000 http://wp-events-plugin.com/?post_type=tutorials&p=442 This tutorial forms (the final) part of our series of tutorials for creating an custom add-on for Events Manager called “Styles”, where we will be able to select from a list of styles during event registration. We are in the process of creating custom styles pages, and now need to register

The post Creating Custom Permalinks in WordPress appeared first on Events Manager for WordPress.

]]>
This tutorial forms (the final) part of our series of tutorials for creating an custom add-on for Events Manager called “Styles”, where we will be able to select from a list of styles during event registration. We are in the process of creating custom styles pages, and now need to register permalinks as part of this step.

This tutorial sort of doubles as a WordPress tutorial (although I found the codex tutorial most helpful when creating permalinks in Events Manager) as this principle could be adapted to work for any plugin. This doesn’t use any plugin-specific functions whatsoever.

Creating the rewrite rules

Firstly, we’ll have to add some rewrite rules to the array. We’ll hook into the rewrite_rules_array filter and add our own rules to the $rules array. For the purposes of this example, we’ll assume our events page is located at our imaginary site mysite.com/events/ What we want to acheive is the following:

  • mysite.com/events/styles/ – displays the list of styles and upcoming events
  • mysite.com/events/style/id#/ – displays the single style name with this id and its upcoming events
function my_em_styles_rewrite_rules_array($rules){
	$events_page_id = get_option ( 'dbem_events_page' );
	$events_slug = urldecode(preg_replace('/\/$/', '', str_replace( trailingslashit(home_url()), '', get_permalink($events_page_id)) ));
	$events_slug = ( !empty($events_slug) ) ? trailingslashit($events_slug) : $events_slug;
	$my_em_rules = array();
	if( !empty($events_slug) ){
		$my_em_rules[$events_slug.'styles$'] = 'index.php?pagename='.$events_slug.'&styles_page=1'; //styles list
		$my_em_rules[$events_slug.'style/(\d+)$'] = 'index.php?pagename='.$events_slug.'&style_id=$matches[1]'; //single style
	}
	return $my_em_rules + $rules;
}
add_filter('rewrite_rules_array','my_em_styles_rewrite_rules_array');

The first six lines involve retrieving the url of the events page and deciding to add our rules only if there is a valid events page. Lines 7 and 8 are the redirection rules, which use regex to identify when we access style pages.

$my_em_rules[$events_slug.'styles$'] = 'index.php?pagename='.$events_slug.'&styles_page=1'; //styles list
$my_em_rules[$events_slug.'style/(\d+)$'] = 'index.php?pagename='.$events_slug.'&style_id=$matches[1]'; //single style

The first line will only catch our styles list page. Since we don’t need to obtain any information from here, we’ll just add an extra querystring variable called styles_page and set it to 1.

The second line handles requests for specific style pages. The (\d+) bit will catch the id number and when we pass $matches[1] into the style_id querystring variable it will be replaced by the actual number in the requested url. If this stuff confuses you, you should read up more on regex and the preg_match php function

Register your querystring variables

That was the hard part… the rest is a piece of cake! Now that we’ve added our rewrite rules, we also need to register the new GET parameters we just created, as they will not be made available to the $wp_query object and we won’t be able to load our content properly without that.

add_filter('query_vars','my_em_styles_query_vars');
function my_em_styles_query_vars($vars){
	array_push($vars, 'style_id','styles_page');
    return $vars;
}

All we’re doing here is pushing our variable names into the $vars array, and passing it back onto the query_vars filter.

Flush the rewrite rules

Once this is all ready, you’ll want to flush the rewrite rules so that these new rules take effect. You can do this by visiting your Permalinks settings, each time that page is loaded, rules are refreshed.

If you want to initiate this with PHP, you’d use the following, but bear in mind you’d want to use it sparingly, such as when your custom add-on is activated for the first time:

global $wp_rewrite;
$wp_rewrite->flush_rules();

The post Creating Custom Permalinks in WordPress appeared first on Events Manager for WordPress.

]]>
442