Builder Blocks: Events

From IThemes Codex
(Difference between revisions)
Jump to: navigation, search
(Venue Settings)
 
(30 intermediate revisions by one user not shown)
Line 1: Line 1:
'''Builder Events Block''' adds event management tools to your site by providing custom post types for '''Events''' and '''Venues'''. Builder Events Block also features integration with Gravity Forms (for event registration) and Eventbrite.
+
'''Builder Events Block''' adds event management tools to your site by providing [http://codex.wordpress.org/Post_Types custom post types] for '''Events''' and '''Venues'''. Builder Events Block also features integration with Gravity Forms (for event registration) and Eventbrite.
 +
 
 +
<br />
 +
 
 +
==Related Child Themes==
  
 
Builder Events Block works with any Builder child theme, but '''[http://ithemes.com/purchase/city-church/ Builder Child Child - Noise]''' is designed to work specifically with the Builder Events Block.
 
Builder Events Block works with any Builder child theme, but '''[http://ithemes.com/purchase/city-church/ Builder Child Child - Noise]''' is designed to work specifically with the Builder Events Block.
 +
 +
<br />
  
 
=Installation=
 
=Installation=
Line 45: Line 51:
 
*'''Settings''' - Add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages
 
*'''Settings''' - Add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages
  
==Adding a New Event ==
+
==Adding a New Event==
  
 
To add a new event, click '''Add New'''.  
 
To add a new event, click '''Add New'''.  
Line 62: Line 68:
  
 
The '''Settings''' Page in the Events menu allows you to add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages.
 
The '''Settings''' Page in the Events menu allows you to add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages.
 +
 +
<br />
 +
 +
[[File:Events-settings.png|800px|link=]]
  
 
<br />
 
<br />
  
 
===Eventbrite API===
 
===Eventbrite API===
 +
 +
Builder Block Events requires an Eventbrite API Key and your personal API User Key in order use use Eventbrite widgets on your events.
 +
 +
<br />
 +
 +
[[File:Eventbrite-settings.png|800px|link=]]
 +
 +
<br />
 +
 +
*'''Eventbrite API Key''' - Create your API key from your Eventbrite account here: https://www.eventbrite.com/api/key
 +
*'''Eventbrite API User Key''' - Grab your your API User Key here: https://www.eventbrite.com/login?referrer=/userkeyapi
 +
 +
<br />
  
 
===Post type name and name plural===
 
===Post type name and name plural===
 +
 +
If you want to change the name and plural name of your the post type, you can do so in this section. Changing the post type name and plural name will also change the menu title in the left side of the WordPress dashboard navigation. To see these changes, click '''Save Changes''', then '''refresh the page''' and you'll see the new menu title.
 +
 +
<br />
 +
 +
[[File:Post-type-name.png|800px|link=]]
 +
 +
<br />
  
 
===Permalink Structure===
 
===Permalink Structure===
 +
 +
You can change the permalink structure for events in this section. Updating the permalink slug will change the URL for the event archive and individual event "posts."
 +
 +
<br />
 +
 +
[[File:Permalink-structure.png|800px|link=]]
 +
 +
<br />
  
 
===List or Calendar View===
 
===List or Calendar View===
 +
 +
Set the default view for you events archive view as either '''List''' or '''Calendar'''.
 +
 +
<br />
 +
 +
[[File:List-or-calendar-view.png|800px|link=]]
 +
 +
<br />
 +
 +
This '''List''' view is chosen by default. Choosing the '''Calendar''' view will update the event archive to be rendered in a calendar view.
 +
 +
<br />
 +
 +
[[File:Calendar-view.png|800px|link=]]
 +
 +
<br />
  
 
===Display Order===
 
===Display Order===
 +
 +
The '''Display Order''' sets how events display for the list view, either in '''Start Date''' or '''Publish Date'''. Choosing '''Start Date''' will not display events older than the current date.
 +
 +
<br />
 +
 +
[[File:Display-order.png|800px|link=]]
 +
 +
<br />
  
 
===Notification Messages===
 
===Notification Messages===
 +
 +
The '''Notification Messages''' section allows you to customize notification messages for three different notifications for your events:
 +
 +
*'''ended'''
 +
*'''postponed'''
 +
*'''canceled'''
 +
 +
These notification messages will display if individual events have been postponed or canceled (this option is located on the '''Add New Event''' page for individual events).
 +
 +
<br />
 +
 +
[[File:Notification-messages.png|800px|link=]]
  
 
<br />
 
<br />
Line 82: Line 157:
  
 
Builder Church Block creates a custom post type for '''Venues'''. Venues are not viewable by the public. After publishing venues, you can select to use it under the Location meta box when adding or editing an event.
 
Builder Church Block creates a custom post type for '''Venues'''. Venues are not viewable by the public. After publishing venues, you can select to use it under the Location meta box when adding or editing an event.
 +
 +
<br />
 +
 +
[[File:venues.png|800px|link=]]
 +
 +
<br />
  
 
==Adding a New Venue==
 
==Adding a New Venue==
 +
 +
To add a new event, click '''Add New'''.
 +
 +
Add the Venue title (name) and location address. To add a mapped location, enter your address in the search bar.
 +
 +
Press '''Publish'''.
 +
 +
'''Note:''' Venues are not viewable by the public in an archive. After publishing a Venue, you can select to use it under the Location meta box when adding or editing an Event.
 +
 +
<br />
 +
 +
[[File:Using-venues.png|link=]]
 +
 +
<br />
  
 
==Venue Settings==
 
==Venue Settings==
Line 92: Line 187:
  
 
===Post type name and name plural===
 
===Post type name and name plural===
 +
 +
Changing the '''post type name and name plural''' will change the Venues menu in the WordPress dashboard to your custom post type name.
  
 
<br />
 
<br />
 +
 +
[[File:venue-settings.png|800px|link=]]
 +
 +
<br />
 +
 +
=Miscellaneous=
 +
==How to assign a layout to Events listing page==
 +
 +
Add this code at the end of active theme's (child theme of Builder) functions.php:
 +
 +
<pre class="brush:php;">
 +
function custom_filter_events_layout( $layout_id ) {
 +
    if ( is_post_type_archive('it_bb_event') )
 +
            return '4e57b7c528e6e';
 +
   
 +
    return $layout_id;
 +
}
 +
add_filter( 'builder_filter_current_layout', 'custom_filter_events_layout' );
 +
</pre>
 +
 +
In the above, change "4e57b7c528e6e" to the ID of layout that you wish to assign to Events archive page.
 +
 +
To find the ID for a Layout, go to the Layouts listing, copy the edit link for the desired Layout, paste the link somewhere, and grab the text after the last equal sign. For example, consider the following link:
 +
 +
<pre>http://example.com/wp-admin/admin.php?page=layout-editor&editor_tab=layouts&layout=4e57b7c528e6e</pre>
 +
 +
The Layout's ID for the above is 4e57b7c528e6e.
 +
 +
==How to add start and end date and location to list of events==
 +
Note, this applies to the WordPress backend, see image:
 +
 +
[[Image:BB_events_list.jpg|800px|none]]
 +
 +
Add the following code at the end of your child theme's functions.php file, but '''before the closing ?>''' (if any).
 +
 +
<pre class="brush: php; gutter: false;">
 +
// Add fields to events columns
 +
add_filter('manage_edit-it_bb_event_columns', 'my_it_bb_event_columns');
 +
function my_it_bb_event_columns( $it_bb_event_columns ) {
 +
 +
    $new_columns['cb'] = '<input type="checkbox" />';
 +
    $new_columns['title'] = __('Event Name', 'column name');
 +
    $new_columns['event_start_date'] = _x('Start Date');
 +
    $new_columns['event_end_date'] = _x('End Date');
 +
    $new_columns['event_address'] = __('Location', 'event_address');
 +
//    $new_columns['author'] = __('Author');  uncomment to show author
 +
//    $new_columns['date'] = _x('Date Created', 'column name');  uncomment to show creation date
 +
 +
    return $new_columns;
 +
}
 +
 +
// Get fields for events columns
 +
add_action('manage_it_bb_event_posts_custom_column', 'my_it_bb_event_custom__columns', 10, 2);
 +
function my_it_bb_event_custom__columns( $column_name, $id ) {
 +
   
 +
    $event_data = get_post_meta( $id , '_it_options' , true ) ;
 +
       
 +
    switch ($column_name) {
 +
       
 +
    // event start date
 +
    case 'event_start_date':
 +
        if ( $event_data[$column_name] )
 +
            echo date_i18n( get_option( 'date_format' ) , strtotime( $event_data[$column_name] ) );
 +
       
 +
        break;
 +
    // event end date       
 +
    case 'event_end_date':
 +
        if ( $event_data[$column_name] )
 +
            echo date_i18n( get_option( 'date_format' ) , strtotime( $event_data[$column_name] ) );
 +
       
 +
        break;
 +
       
 +
    // event address, custom or venue
 +
    case 'event_address':
 +
 +
        if ( ( !empty ( $event_data['default_location'] ) ) && ( ( $event_data['default_location'] !== 'custom' ) ) ) 
 +
            $event_data = get_post_meta( intval( $event_data['default_location'] ) , '_it_options' , true ) ;
 +
 +
        echo nl2br( $event_data[$column_name] );
 +
       
 +
        break;
 +
 +
    default:
 +
 +
        break;
 +
    }
 +
   
 +
    return;
 +
}
 +
 +
// add custom fields to be sortable
 +
add_filter( 'manage_edit-it_bb_event_sortable_columns', 'my_sortable_it_bb_event_columns' );
 +
function my_sortable_it_bb_event_columns( $columns ) {
 +
   
 +
    $columns['event_start_date'] = 'event_start_date';
 +
    $columns['event_end_date'] = 'event_end_date';
 +
    $columns['event_address'] = 'event_address';
 +
 +
    return $columns;
 +
}
 +
</pre>
  
 
=Additional Links=
 
=Additional Links=
Line 101: Line 299:
 
* [http://ithemes.com/2012/03/29/coming-soon-new-builder-events-block/ Coming soon blog post]
 
* [http://ithemes.com/2012/03/29/coming-soon-new-builder-events-block/ Coming soon blog post]
 
* [http://ithemes.com/2012/04/11/sneak-peek-new-builder-events-block/ Sneak Peak (screenshots)]
 
* [http://ithemes.com/2012/04/11/sneak-peek-new-builder-events-block/ Sneak Peak (screenshots)]
 +
 +
= See also  =
 +
* [[Builder_Blocks:_Introduction| Builder Blocks: Introduction]]
 +
* [[Builder_BLocks:_Video_Overview| Video Overview]]
 +
*[[Builder_Blocks:_Restaurant|Builder Restaurant Block]]
 +
*[[Builder_Blocks:_Church|Builder Church Block]]
 +
*[[Builder_Blocks:_Events|Builder Events Block]]
 +
*[[Builder_Blocks:_Audio|Builder Audio Block]]
 +
 +
<br />
 +
[[:Builder|← Back to Builder Codex Home]]

Latest revision as of 18:01, January 2, 2014

Builder Events Block adds event management tools to your site by providing custom post types for Events and Venues. Builder Events Block also features integration with Gravity Forms (for event registration) and Eventbrite.


Contents

Related Child Themes

Builder Events Block works with any Builder child theme, but Builder Child Child - Noise is designed to work specifically with the Builder Events Block.


Installation

  1. Download the Builder Events Block plugin from iThemes Member Panel.
  2. From the WordPress dashboard, navigate to Plugins > Add New.
  3. Install and Activate the builder-block-events zip file.


Once Builder Events Block has been installed, you'll notice two new menus have been added to the left-hand navigation of your WordPress dashboard:

  • Events - Adds events with a title (name), text, location map, notifications (to display "postponed" or "canceled", date picker, featured image, plus Gravity Forms and Eventbrite integrations.
  • Venues - Add venues with a title and location map. Note: Venues are not viewable by the public. After publishing venues, you can select to use it under the Location meta box when adding or editing an event.


Builder-events-dashboard.png

Events

Builder Events Block creates a custom post type for Events displayed in an event "archive" visible on the Noise demo site. This event listing is available in both a list or calendar view.


Events-archive.png


The Events Menu


Events-menu.png


From the WordPress dashboard, the Events' menu expands to reveal several pages:

  • All Events - A listing of all events "posts"
  • Add New - The "Add New Event" page
  • Start Here - A quick-start guide for adding events
  • Settings - Add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages

Adding a New Event

To add a new event, click Add New.

Add the event title (name), a description, location address, date and featured image.


Add-new-event.png


Press Publish. Your new event will now be visible on the site from the URL located beneath the Staff Title.

Event Settings

The Settings Page in the Events menu allows you to add your Eventbrite API, choose the post type name and name plural, permalink structure, list or calendar view defaults, display order and custom notification messages.


Events-settings.png


Eventbrite API

Builder Block Events requires an Eventbrite API Key and your personal API User Key in order use use Eventbrite widgets on your events.


Eventbrite-settings.png



Post type name and name plural

If you want to change the name and plural name of your the post type, you can do so in this section. Changing the post type name and plural name will also change the menu title in the left side of the WordPress dashboard navigation. To see these changes, click Save Changes, then refresh the page and you'll see the new menu title.


Post-type-name.png


Permalink Structure

You can change the permalink structure for events in this section. Updating the permalink slug will change the URL for the event archive and individual event "posts."


Permalink-structure.png


List or Calendar View

Set the default view for you events archive view as either List or Calendar.


List-or-calendar-view.png


This List view is chosen by default. Choosing the Calendar view will update the event archive to be rendered in a calendar view.


Calendar-view.png


Display Order

The Display Order sets how events display for the list view, either in Start Date or Publish Date. Choosing Start Date will not display events older than the current date.


Display-order.png


Notification Messages

The Notification Messages section allows you to customize notification messages for three different notifications for your events:

  • ended
  • postponed
  • canceled

These notification messages will display if individual events have been postponed or canceled (this option is located on the Add New Event page for individual events).


Notification-messages.png


Venues

Builder Church Block creates a custom post type for Venues. Venues are not viewable by the public. After publishing venues, you can select to use it under the Location meta box when adding or editing an event.


Venues.png


Adding a New Venue

To add a new event, click Add New.

Add the Venue title (name) and location address. To add a mapped location, enter your address in the search bar.

Press Publish.

Note: Venues are not viewable by the public in an archive. After publishing a Venue, you can select to use it under the Location meta box when adding or editing an Event.


Using-venues.png


Venue Settings

The Settings page in the Venues menu allows you to customize the venue post type name and name plural.


Post type name and name plural

Changing the post type name and name plural will change the Venues menu in the WordPress dashboard to your custom post type name.


Venue-settings.png


Miscellaneous

How to assign a layout to Events listing page

Add this code at the end of active theme's (child theme of Builder) functions.php:

function custom_filter_events_layout( $layout_id ) {
    if ( is_post_type_archive('it_bb_event') )
            return '4e57b7c528e6e';
    
    return $layout_id;
}
add_filter( 'builder_filter_current_layout', 'custom_filter_events_layout' );

In the above, change "4e57b7c528e6e" to the ID of layout that you wish to assign to Events archive page.

To find the ID for a Layout, go to the Layouts listing, copy the edit link for the desired Layout, paste the link somewhere, and grab the text after the last equal sign. For example, consider the following link:

http://example.com/wp-admin/admin.php?page=layout-editor&editor_tab=layouts&layout=4e57b7c528e6e

The Layout's ID for the above is 4e57b7c528e6e.

How to add start and end date and location to list of events

Note, this applies to the WordPress backend, see image:

BB events list.jpg

Add the following code at the end of your child theme's functions.php file, but before the closing ?> (if any).

// Add fields to events columns
add_filter('manage_edit-it_bb_event_columns', 'my_it_bb_event_columns');
function my_it_bb_event_columns( $it_bb_event_columns ) {
 
    $new_columns['cb'] = '<input type="checkbox" />';
    $new_columns['title'] = __('Event Name', 'column name');
    $new_columns['event_start_date'] = _x('Start Date');
    $new_columns['event_end_date'] = _x('End Date');
    $new_columns['event_address'] = __('Location', 'event_address');
//    $new_columns['author'] = __('Author');  uncomment to show author
//    $new_columns['date'] = _x('Date Created', 'column name');  uncomment to show creation date
 
    return $new_columns;
}

// Get fields for events columns
add_action('manage_it_bb_event_posts_custom_column', 'my_it_bb_event_custom__columns', 10, 2);
function my_it_bb_event_custom__columns( $column_name, $id ) {
    
    $event_data = get_post_meta( $id , '_it_options' , true ) ;
        
    switch ($column_name) {
        
    // event start date
    case 'event_start_date':
        if ( $event_data[$column_name] )
            echo date_i18n( get_option( 'date_format' ) , strtotime( $event_data[$column_name] ) );
        
        break;
    // event end date        
    case 'event_end_date':
        if ( $event_data[$column_name] )
            echo date_i18n( get_option( 'date_format' ) , strtotime( $event_data[$column_name] ) );
        
        break;
        
    // event address, custom or venue
    case 'event_address':
 
        if ( ( !empty ( $event_data['default_location'] ) ) && ( ( $event_data['default_location'] !== 'custom' ) ) )  
            $event_data = get_post_meta( intval( $event_data['default_location'] ) , '_it_options' , true ) ;

        echo nl2br( $event_data[$column_name] );
        
        break;

    default:

        break;
    }
    
    return;
}

// add custom fields to be sortable
add_filter( 'manage_edit-it_bb_event_sortable_columns', 'my_sortable_it_bb_event_columns' );
function my_sortable_it_bb_event_columns( $columns ) {
    
    $columns['event_start_date'] = 'event_start_date';
    $columns['event_end_date'] = 'event_end_date';
    $columns['event_address'] = 'event_address';

    return $columns;
}

Additional Links

See also


← Back to Builder Codex Home

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox