In this guide, we’ll be going through the required steps to display this icon in your Eventtop section.

To get started, go to EventON > Settings > EventTop as shown below:

You can use the EventTop designer to add the Tags box to the canvas and this will include the Live Now icon to your live events.

For more details about how to rearrange elements and create a custom layout for your EventTop using the built-in designer, please go through this guide: How To Use The EventTop Designer.

The post How To Display or Hide the Live Now Icon first appeared on Documentation.

This feature can be implemented on new and existing events and to get started you can edit an existing event or add a new one by going to Events > Add Event on your WordPress admin dashboard.

To get started, please go to the Time and Date and set the default Event Start and Event End times.

Next, toggle the option to Enable virtual visible event end time.

Once enabled, a new date and time picker will be displayed under the Time and Date section that allows you to set the virtual visible event end time.

To ensure that this strategy is effective, you can set the time to be earlier than the actual event end time( for this example, we’ll set the virtual end time to 2025/02/15) and this will be displayed on the front end as shown below:

The post How to Use Virtual Visible Event End Time for Events with Limited Visibility but Extended Durations first appeared on Documentation.

User Guide

To get started, go to EventON > Settings > ICS Import.

On this page, you can customize how the events will be imported into your site by toggling the following options:

• Publish imported events – When this setting is enabled, all the imported will get automatically published on your site. If your calendar is configured to display future and past events, then the imported events will be visible immediately.
• Event processing timezone method – This select dropdown allows you to select what timezone will be used for the imported events. You can select from the UTC timezone, WordPress timezone(Configured in WordPress > Settings > General > Timezone) or set this to the default timezone in the ICS file.
• Use custom timezone for importing events – Enabling this option allows you to select a custom timezone that will be applied to the imported events and override the setting above.
• Disable auto-detect all-day events based on ICS event time – This setting checks the timezone that is set on your WordPress site and uses this as a reference for all-day events. Enabling this option ensures that all-day events are not automatically detected so that you can manually configure them after the import.
• Enable duplication event name check during importing – Enabling this option will create a validation system that helps avoid having duplicate events on your site.
• Sync already imported events if event UID matches in the ICS file – Enabling this option allows you to sync existing events on your site with the data from the imported file.
• Import past events as well from ICS file – Enabling this option allows you to override the default behavior of the import tool and import past events based on the starting time.
• Import Method – This option allows you to select your import method of choice. You can select from doing the import manually from an ICS file, manual import using an ICS URL, or a scheduled event from an ICS URL. You can create a daily, weekly, or monthly schedule to import events from the URL.

Here are some guides on how to get the ICS link from popular programs.

1. How to get ICS link from Google Calendar
2. How to get iCal public calendar feed link
3. How to get Outlook public calendar link

Import Process

For the purpose of this guide, we’ll go through the steps of importing events through a file.

Please select Manual import by uploading ICS File on the Import Method field.

Export an ICS file from your external calendar application and click on the Process ICS File button.

In the next modal window, click on the Upload File button and select the ICS file that you exported in the previous step.

Next, click on the Upload .ICS file button to kickstart the import process. If the file passes validation and some events are found in the file, a new window will open containing a detailed list of the events as shown below:

In this window, you can click on blue tick marks to deselect events that you’d not like to be imported. You can also expose more import options by clicking on the 3-dot button as shown below:

Once this button is clicked a drawer menu will slide in from the right side with the following settings:

The additional settings allow you to customize the calendar with the following options:

• Hide end time – Enabling this option will hide the end times of all processed events.
• Event User Interaction – This setting allows you to select the kind of event that will happen after the event has been added to your calendar and a site visitor clicks on it.
• Change Event Times by – This field allows you to fine-tune the event time by adding negative or positive time offsets.

The post How To Use the ICS Import Tool first appeared on Documentation.

In this guide, we’ll be going through how to use the built-in import/export tool to export translation strings, edit them in a spreadsheet program, and import them back to your site. You can also edit the file and import the same translation into a new site running EventON.

Exporting data

To get started, go to EventON > Language and select the language version that you want to edit from the following dropdown field:

Next, scroll down to the bottom of the page and select the export option that you’d like to use. The export tool supports the following formats:

Export using vars

This option is more suitable for technically savvy users who’d like to associate the strings(variable names) that are used in the plugin codebase with their front-end translation. This option is more versatile since it allows you to match unique variable names with their translations. Once exported, the data looks as shown below:

Export using text

This option exports the language data as text data in the way it is displayed in the default language on the site. When using this method, you should take caution when translating strings that match for example if “your name” is appearing in various places in the calendar, then translating one of the rows that contains this text will overwrite all other instances of this text. Once exported, the data looks as shown below:

Bulk editing the data

Once you have selected your preferred export format, click on the corresponding export format button as shown below:

Clicking on one of these buttons will start the download process of the CSV file.

The next step is to open the file with your favorite spreadsheet program. For example, you can use Numbers on Mac, Excel on Windows, or an online program such as Google Sheets.

Once the file is open in the editor, you can add all your translations to column B on the spreadsheet and save changes as shown below:

Finally, you can download the file as a CSV and import the file back to your site by clicking on the Import button as shown below:

The post How to Bulk Update Language Translations Using the Import/Export Tool first appeared on Documentation.

• Accessibility: Plain text is more accessible to individuals with disabilities who rely on screen readers or other assistive technologies to browse websites.
• Dynamic event dates: Using the plain text option allows you to change the event dates on embedded posts without having to edit the post again. You would only need to change the event date under the Events post type.
• Consistency across various devices: Using event details values ensures that the page/post containing the event details is consistent across various devices and screen sizes.
• Faster load times: Reducing the CSS and HTML on a page might help to reduce the load time of the page.
• Legal Requirements: In certain industries or regions, there may be legal requirements for event details to be displayed in a specific format, often plain text for clarity and compliance.
• AMP pages: Using the event shortcode in plain text will ensure that converting the page to AMP will work smoothly.

To get started with this feature, create a new event by going to WP Admin > Events > Add Event and add your event details. Please go through this guide for more details about creating new events: Getting Started with EventON: Adding Events.

Once this is done, go to the page or post that you want to embed the calendar. For the purpose of this tutorial, we’ll create a new post by going to WP Admin > Posts > Add New:

Once the post title and content have been added, we can embed the event shortcode within the content by following these steps:

Add the EventON block

Click on the Add block button and select the EventON shortcode block.

Add a Single Event

Using the shortcode generator, add a single event and select the Only selected event data values as the Event Display Style as shown below:

Enable the display of selected values

In the next option, toggle the option to Show only select Data values of the event and then select the fields that you would like to be displayed as shown below:

Save the shortcode and publish the post

You are now ready to publish the post and this should look like so:

The post How to Use Single Event Data Values first appeared on Documentation.

The EventCard designer represents an interactive graphical drag-and-drop builder that makes it snappy to design the perfect layout for your event cards. Please go to EventON > Settings > EventCard Design to access the designer.

The designer supports both single-column and multiple-column layouts to organize the event data. Here is a list of the supported row layouts:

Single-column layout

Two-column layout

Three-column layout

Two-column left double-stacked

Two-column right double-stacked

Two-column left triple-stacked

Two-column right triple-stacked

Supported Actions

The designer allows you to perform the following actions:

Deletion of fields from the event card

Deletion of the entire row of field data

Hiding fields temporarily

Changing the background color of the field

Reorder rows using drag-and-drop

Adding a Field to the EventCard

To get started, please ensure that you have some unused fields at the bottom of the designer as shown below:

If you don’t have any fields yet, you can delete the fields you want to remove or replace from the designer interface using the abovementioned steps. Once this is done, move to the next step below.

Select and click on one of the available column layouts.

For the purpose of this tutorial, I selected the two-column layout and as soon as this is done, two field options will appear in the designer as shown below:

Click on the + Set Field button and select one of the unused event card fields:

Clicking on one of the fields will replace the empty field as shown below:

Repeat this process for all the empty fields.

Once all the changes have been made hit the Save Changes button!

The post How to Use the EventCard Designer first appeared on Documentation.

• Event directory website – Users can submit their own events for inclusion
• Community website – Members can contribute events relevant to their interests
• Non-profit and charity website – Volunteers can submit fundraising events and charity drives
• Wedding and party planning website – Users can submit their celebrations and party events
• Health and wellness website – Professionals can share workshops, seminars, and health-related events.
• Niche interest communities – Members can submit events if your website caters to specific hobbies or interests (gardening, pet enthusiasts, technology meetups).

Installation

In order to get started, you will need to have EventON and the Action User addon installed and activated. You can get the EventON plugin by downloading it from your CodeCanyon account. Please follow our tutorial on how to install & activate EventON and how to install addons in case you need more details about the install process.

Setting Up Action User

Go to EventON > Settings > Action User > General Settings and enable the option to “Assign logged-in user to event after successful event submission” and “Allow only logged-in users to submit events” as shown below:

You can customize the fields that you want displayed by clicking on the Form Fields tab on the left menu.

Create your guest event submission page by going to your WordPress dashboard > Pages > Add New and add the page title.

If you are using the block editor, add the EventON block.

If you are using the Classic Editor, click on the EventON button on the menu bar to launch the Shortcode generator and select Action User – Event Submission Form as shown below:

Publish the page and the event submission will be visible on the front end of this page for site visitors to submit events as shown below:

Create an Events Listing Page

In this step, we’ll create a custom page on your WordPress site that will list all submitted events from guest users on your site. For this, we need to create a new custom page template on your theme.

To start, copy the page.php file of your theme and rename it to eventon-listing- template.php

Now, open this file and paste the following code to tell WordPress that you have added a new page template:

<?php
/**
* Template Name: EventON Events Page
*/
?>

Create an Events Listing page on your WordPress Admin page by going to WordPress > Pages > Add New.

Assign the template that we created in the previous step to this page from the side panel as shown below:

Next, copy the following code in the template:

<?php 
get_header();

the_title( '<h1 class="entry-title default-max-width">', '</h1>' ); ?>

<div class="entry-content">

<?php
$users = get_users( array( 'fields' => array( 'ID' ) ) );

foreach ( $users as $user ) :
  
    if(function_exists('add_eventon')){
    
      if(!empty($user->ID)){
      $user_info = get_userdata($user->ID);
      $author_profile_url = get_author_posts_url($user->ID); 
      echo '<div class="author-name"><a href="', $author_profile_url, '" class="contributor-link">', $user_info->display_name, '</a></div>';
      echo do_shortcode("[add_eventon users='".$user->ID."']");
      }
    }

endforeach;

?>
</div><!-- .entry-content -->

<?php get_footer(); ?>

This code will be responsible for dynamically looping through the users on your site and displaying them on the listing page.
PS: This code can be customized further to suit your site requirements.

Once the page is published, it will display a list of calendars with the user’s display name like so:

The post How To Allow Users to Submit Events and Create an Events Listing Page first appeared on Documentation.

You can achieve this by appending the section ID to the page/post URL. Here is an example:

https://demo.myeventon.com/single-event-view-calendar/#event_organizer

In the above example, when the user clicks on this link, the page will automatically scroll to the Event Organizer section, as shown below:

EventON uses the following default IDs that you can append to the page URL to scroll to the sections:

• Event featured image – #event_ftimage
• Event details – #event_eventdetails
• Health guidelines – #event_health
• Event time – #event_time
• Event location – #event_location
• Add event to calendar – #event_addtocal
• Event reviews – #event_evore
• RSVP – #event_evorsvp
• Event organizer – #event_organizer
• Event speakers – #evo_speaker
• Event tickets – #event_evotx

You can find the ID of a specific section on the events page by following these steps:

• Hover over a particular section using your mouse
• Right-click and select Inspect on the browser context menu
• Find the top-most div container and copy the ID as shown below

The post How to Use Hashtags to Link to Event Sections first appeared on Documentation.

The process of customizing the EventTop is now streamlined since the introduction of the designer. The built-in layout designer works the same as the Eventcard designer.

To access the designer, please log in to your WordPress admin dashboard and head over to EventON > Settings > EventTop > EventTop Settings as shown below:

The designer is currently divided into two sections. The first section is a full-width container that can hold multiple fields. The second section is sub-divided into four rows that can hold multiple fields independently.

NOTE: Most of these fields will not be available in the tile layout, however all the fields added in the designer will be visible on the row layout. This is to provide better usability and visibility when interacting with the calendar on the front end of your site.

To add a new field in these sections, click on the grey rounded + button shown below:

Once this button is clicked, you can add a new field by clicking on one of the options available on the Unused Event Top Fields panel on the editor, as shown below:

To remove an item from the section, click on the black rounded – button shown below:

From the same page, you can also customize how the dates will be displayed. You can enable any of these values:

• Event Day Name
• Event Start Year
• Event End Year (If different than start year)

For the location field on the EventTop, you can display either the location name and address or one of the two.

You can also toggle to enable the following on the EventTop:

• Show event custom meta data icons on eventtop
• Show edit event button for each event
• Hide live event progress bar with time remaining
• Hide blinking “Live Now” icon from event top for current events

You can also set the following default EventTop styles. This setting can be overridden within the event shortcode.

Colorful with gap between events

Colorful EventTop

Colorful EventTop bubbles

Clear with left border colors

Clear with left border colors and gaps

The post How To Use The EventTop Designer first appeared on Documentation.

To be able to use this feature, we recommend starting off by setting up Sorting and Filtering Options for all your calendars. You can do this by heading over to your WP Dashboard > EventON > Settings > Sorting and Filtering as shown below:

On this page, you can globally enable or disable the sort and filter options on all calendars via the first setting on the page. You can also enable or disable the following sorting options:

• Event Main Title
• Event Color
• Event Posted Date

It is also possible to enable or disable the following filtering options:

• Past & Future Event Filtering
• Virtual Event Filtering
• Event Status Filtering
• Event Type Category #1
• Event Type Category #2
• Event Type Category #3
• Event Type Category #4
• Event Type Category #5
• Event Location
• Event Organizer
• Event Tags
• Event Speaker

Here is a screenshot of how these filters look on the front end:

If you click on each of these options, it will expose a dropdown or checkboxes containing additional options that you can use to only display a filtered list of events.

1. Category 1 and Category 2 will display a list of the event type terms that have already been defined on your site. You can also enable event types 3, 4, and 5 for additional taxonomies.
2. Event location lists all the locations that have been stored for your events. Clicking on a single location will filter and display all events from that location.
3. Event organizer lists all the event organizers that have been assigned to each event on your site.
4. Event speaker lists all speakers that have been assigned to your events through the Speakers and Schedules addon.
5. The past and future events button exposes the following options: All, Only past events, Only future events.
6. The virtual events button allows the visitor to select from All, Virtual events, and Non-virtual events.
7. Event status will allow users to select from the defined events statuses such as scheduled, moved online, canceled, physical events, etc.

The sorting and filtering options section are enabled by default in the calendar shortcode but you can disable them by adding the following attribute:

hide_so="yes"

It is also possible to expand the filter options by default by adding the following attribute:

exp_so="yes"

Here is an example shortcode:

[add_eventon_wv hide_so="yes"]

The post How To Set Up and Use the Filter Bar on Calendars first appeared on Documentation.