Plugin Requirements

Browsers: Chrome, Firefox, Safari, Opera, Edge

WordPress version: 6.0 and above

PHP version: 7.4 and above

WooCommerce (optional): 7.7 and above

BuddyPress (optional): 11.0 and above

Updated on 16 May 2023

Installation

Download the Plugin: Download the plugin file from Codecanyon

Access Your WordPress Dashboard: Log in to your WordPress website using your admin credentials. Once logged in, you will land on the WordPress Dashboard.

Navigate to the Plugins Section: Locate the sidebar menu on the left-hand side and find the “Plugins” menu item. Click on it to go to the Plugins management page.

Upload the Plugin: On the Plugins page, click the “Add New” button at the top. You will be taken to the “Add Plugins” page, where you can search and upload plugins.

Choose the Plugin to Install: On the “Add Plugins” page, click the “Upload Plugin” button.

Upload the Plugin File: Click the “Choose File” button and select the plugin file you downloaded earlier. Then, click the “Install Now” button.

Install the Plugin: WordPress will upload the plugin file from your computer to your website’s server. Click the “Activate Plugin” button to activate the plugin.

Updated on 16 May 2023

Activation

Go to your WordPress Dashboard.

In your Dashboard, navigate to the “STEC” menu.

Click on “STEC” to access the STEC menu page.

From the STEC menu page, go to “Activator” and click on “Manage license”.

Paste the purchase key into the “Enter your purchase key” field on the “Manage License” page.

Finally, click on the “Activate” button to activate the calendar plugin using your purchase key.

Updated on 16 May 2023

Updating

Download the latest version: Download the updated version of the plugin from Codecanyon to your computer.

Backup your website: Before proceeding with any updates, it’s recommended to create a backup of your WordPress website. This ensures that you have a restore point in case anything goes wrong during the update process.

Access the WordPress admin area: Log in to your WordPress website using your admin credentials. You can usually access the admin area by appending “/wp-admin” to your website’s URL (e.g., www.yourwebsite.com/wp-admin).

Deactivate the plugin: In the WordPress admin dashboard, navigate to the “Plugins” section and find the plugin you want to update. Deactivate the plugin by clicking on the “Deactivate” link or button next to the plugin’s name. Deactivating the plugin ensures that there are no conflicts or issues during the update process.

Access the plugin installation page: On the WordPress admin dashboard, navigate to the “Plugins” section and click on the “Add New” button at the top. On the next page, click on the “Upload Plugin” button. This will take you to the plugin installation page.

Choose the updated plugin file: On the plugin installation page, click on the “Choose File” or “Browse” button. Locate and select the updated plugin file you downloaded in step 1.

Confirm overwriting existing plugin: After selecting the updated plugin file, click on the “Install Now” button. WordPress may display a confirmation message, asking if you want to overwrite the existing plugin files. Verify that the plugin being updated is the correct one and that you have a backup of your website. Then, confirm the installation by clicking on the “Yes” or “OK” button.

Install the updated plugin: WordPress will now upload and install the new version of the plugin, overwriting the existing plugin files. The installation process may take a few seconds.

Activate the plugin: Once the installation is complete, you’ll see a success message. To activate the updated plugin, click on the “Activate Plugin” link or button. The plugin will be activated and ready to use.

Verify the update: It’s recommended to visit the plugin’s settings or test its functionality on your website to ensure everything is working correctly after the update.

Clear your website cache: After updating the plugin, it’s important to clear your website cache to ensure that you’re not serving cached files of the old version. Cached files can sometimes interfere with the proper functioning of the updated plugin.

Updated on 16 May 2023

Display the Calendar on the Front-End

Access the WordPress admin area: Log in to your WordPress website using your admin credentials.

Create a new page or edit an existing page: Navigate to the “Pages” section in the WordPress admin dashboard and either create a new page or choose an existing page where you want to display the calendar.

Edit the page with Gutenberg: Click on the “Edit” button for the selected page to open it in the Gutenberg block editor.

Add the “Full Calendar” block: In the Gutenberg block editor, click on the “+” button to add a new block. Look for the “Stachethemes” section within the available blocks.

Select the “Full Calendar” block: Within the “Stachethemes” section, locate and select the “Full Calendar” block. This block should be available from your Stachethemes plugin.

Alternatively, you can display the calendar on the front-end of your website by using the [stec] shortcode. This shortcode can be placed within any block that supports shortcodes, allowing you the flexibility to insert the calendar in various locations on your page. Simply add the [stec] shortcode to the desired block, and the calendar generated by your calendar plugin will be displayed when the page is viewed on the front-end.

Preview and update the page: Use the preview option in the Gutenberg editor to see how the calendar will look on the front-end. If you’re satisfied, click on the “Update” or “Publish” button to save the changes and make the page live on your website.

View the calendar on the front-end: Visit the page where you added the “Full Calendar” block in the Gutenberg editor. You should now see the calendar displayed based on the configuration and styling provided by the block.

Updated on 16 May 2023

Calendar Shortcode Parameters

Please note that all of the parameters listed below are also available in the calendar dashboard. You can access the calendar dashboard to configure and customize various settings to meet your specific needs and preferences. Here are some of the available parameters:

Shortcode: [stec]

Calendar Settings:

calendar__layout
Calendar initial layout view
Values: agenda, month, week, grid, boxgrid, map

calendar__layouts
Available layout switch buttons in the top menu
Values: agenda, month, week, grid, boxgrid, map

calendar__dow
First day of the week (0 – 6).
Values: Numeric value representing the day of the week (0 – Sunday, 1 – Monday, …, 6 – Saturday).

calendar__show_tz_offset
Show timezone offset.
Values: true or false

calendar__date_format
Date format.
Values: “stec_dmy” (day-month-year), “stec_mdy” (month-day-year), “stec_ymd” (year-month-day), “wp” (WordPress default).

calendar__time_format
Time format.
Values: “stec_12” (12-hour format), “stec_24” (24-hour format), “wp” (WordPress default).

calendar__top_today_button
Show today button in the top bar.
Values: true or false

calendar__top_nav_buttons
Show navigation buttons in the top bar.
Values: true or false

calendar__top_datepicker_menu
Show datepicker menu in the top bar.
Values: true or false

calendar__top_search_menu
Show search menu in the top bar.
Values: true or false

calendar__top_filters_menu
Show filters menu in the top bar.
Values: 0 (off), 1 (toggle), 2 (static).

calendar__top_layouts_menu
Show layouts menu in the top bar.
Values: true or false

calendar__open_events_in
Open events in.
Values: “calendar” (within the calendar view), “modal” (in a modal window), “single” (in a single event view), “external” (in an external link).

calendar__links_target
Links target.
Values: “_self” (same tab/window), “_blank” (new tab/window).

Filter Settings:

filter__location
Filter events by location ID.

filter__organizer
Filter events by organizer ID.

filter__guest
Filter events by guest ID.

filter__category
Filter events by category ID.

filter_events
Display only selected events by ID.

filter__calendar
Filter events by calendar ID.

filter__min_date
Filter events by minimum date. See list with accepted date values

filter__max_date
Filter events by maximum date. See list with accepted date values

filter__start_date
Set calendar initial start date. See list with accepted date values

filter__featured
Filter events by featured status.

filter__read_permission
Filter events by read permission.

filter__author
Filter events by author ID.

filter__attendee
Includes only events that have the attendee in it.
Values: attendee id, email address or “current_user”.

Layout Settings:

layouts__agenda_list
Show agenda list section.
Values: true or false

layouts__agenda_list_reverse_order
Show agenda list in descending order.
Values: true or false

layouts__agenda_slider
Show agenda slider section.
Values: true or false

layouts__grid_gutter
Grid layout gutter.
Values: Numeric value (e.g., 10, 20, etc.)

layouts__grid_columns
Grid layout columns.
Values: Numeric value (e.g., 2, 3, 4, etc.)

layouts__grid_limit
Grid layout limit.
Values: Numeric value (e.g., 10, 20, etc.)

layouts__grid_unbound
Continue to display events, even if they fall outside the active month
Values: true or false

layouts__grid_reverse_order
Display events in descending order
Values: true or false

layouts__boxgrid_gutter
Boxgrid layout gutter.
Values: Numeric value (e.g., 10, 20, etc.)

layouts__boxgrid_columns
Boxgrid layout columns.
Values: Numeric value (e.g., 2, 3, 4, etc.)

layouts__boxgrid_limit
Boxgrid layout limit.
Values: Numeric value (e.g., 10, 20, etc.)

layouts__boxgrid_unbound
Continue to display events, even if they fall outside the active month
Values: true or false

layouts__boxgrid_reverse_order
Display events in descending order
Values: true or false

layouts__month_week_force_title
Display event title on each cell in month and week layout.
Values: true or false

layouts__month_week_style
Month and week layout style.
Values: “fixed”, “auto”

layouts__map_list
Show map list section.
Values: true or false

layouts__map_allow_near_me
Allow “near me” button in map layout.
Values: true or false

Dashboard Settings:

dashboard__in_calendar
Show dashboard button in calendar.
Values: true or false

Miscellaneous Settings:

misc__address_order
Address order.
Values: Comma separated values “country,state,city,address,postal_code”

misc__min_allowed_year
Minimum allowed year for date navigation.
Values: Numeric value (e.g., 2000, 2010, etc.)

misc__max_allowed_year
Maximum allowed year for date navigation.
Values: Numeric value (e.g., 2022, 2030, etc.)

Updated on 23 Sep 2023

Calendar Dashboard

Accessing the Plugin Dashboard
After activating the plugin, you will find the Stachethemes Event Calendar menu in your WordPress dashboard. To access the main menu follow these steps:

Log in to your WordPress admin dashboard.
Locate the “Dashboard” menu on the left-hand side.
Scroll down and click the “STEC” menu item.

Main Menu Structure:
The main menu of Stachethemes Event Calendar consists of a grid layout with three columns and four rows. Each element in this grid represents a sub-menu. The sub-menus available in the Stachethemes Event Calendar plugin are as follows:

Settings:
Use this sub-menu to adjust the calendar settings according to your requirements. Here, you can customize the calendar’s appearance, configure date and time formats, and manage other general settings.

Calendars:
This sub-menu allows you to add and edit calendars. Calendars help organize events into different categories or topics, making it easier for your users to navigate and find relevant events.

Events:
Use this sub-menu to add and edit events. Here, you can provide detailed information about each event, including the event title, date, time, location, description, and featured image.

Categories:
This sub-menu enables you to add and edit event categories. Categories provide a way to group events based on their themes, types, or any other relevant criteria.

Organizers:
Use this sub-menu to add and edit event organizers. Organizers are individuals or entities responsible for hosting or managing events. You can associate organizers with events to provide additional information to your users.

Guests:
This sub-menu allows you to add and edit guests. Guests are individuals who are invited or involved in events. You can associate guests with events to provide relevant information to your users.

Locations:
Use this sub-menu to add and edit event locations. Locations represent the physical places where events will take place. You can associate locations with events to provide accurate venue information.

Attendance:
This sub-menu enables you to add and list attendees for events. You can keep track of the people who will be attending specific events and manage their registrations.

Ticket Orders:
Use this sub-menu to view a list of WooCommerce orders related to event tickets. You can track the orders placed by users for event tickets and manage them accordingly.

Reminders:
This sub-menu allows you to add and list event reminders. Reminders help users stay informed about upcoming events by sending notifications or alerts.

Builder:
The drag and drop builder menu enables users to create their own layouts for events and the event submission form. You can customize the appearance and structure of event pages using this powerful feature.

Activator:
This sub-menu allows users to activate their license for the Stachethemes Event Calendar plugin. You can manage your license activation in this section.

Updated on 16 May 2023

Creating a Calendar

Log in to your WordPress admin dashboard.
Locate the “Dashboard” menu on the left-hand side.
Scroll down and click the “STEC” menu item.

From the “Calendars” sub-menu, click on the “Add New” option.

This will open the calendar editor, where you can set up your new calendar.

Start by providing a name for your calendar in the designated field at the top of the editor. Choose a descriptive name that represents the purpose or theme of the calendar.

Specify the color and thumbnail for your calendar. This will be used to differentiate events belonging to this calendar from others.

Set the timezone for your calendar. Choose the appropriate timezone that matches the location or time zone for which the events in this calendar will be displayed.

Select “Edit [ermission“. Edit permissions determine who will be allowed to edit his calendar. Setting this value to “Private” will allow only the calendar author to make changes to it.

Select “Use permission“. Use permissions determine who will be allowed to add events to this calendar without possibility to edit the calendar itself.

Finally, the “Require approval for events submitted by others” checkbox allows you to control whether events submitted by other users need to be approved by the calendar author before they are published. This setting is particularly relevant if you have enabled event submissions from other users for this calendar.

Once you have filled in the necessary details for your calendar, click on the “Publish” button to make your calendar active.

Updated on 16 May 2023

Creating an Event

Before you begin creating your first event, it is recommended to have at least one calendar already created. Events in Stachethemes Event Calendar must be associated with a calendar. However, if you haven’t created a calendar yet, don’t worry. You can create one during the event creation process itself.

Follow these steps to create your first event:

Log in to your WordPress admin dashboard.

Locate the “Dashboard” menu on the left-hand side.

Scroll down and find the “STEC” menu item.

Click on the “STEC” menu item to access the sub-menus.

Click on the “Add New” button in the “Events” sub-menu.

This will open the event editor, where you can enter the details of your event.

Start by providing a title for your event in the designated field at the top of the editor. This title should accurately represent your event.

Choose the calendar for your event. Click on the dropdown menu and select the appropriate calendar that you previously created or click on the “Add new calendar” button below to create one. It’s important to note that every event must be associated with a calendar and cannot exist outside of it.
The calendar determines the timezone for your event, ensuring accurate time display. However, it’s worth mentioning that the event itself can have its own timezone, which can override the calendar’s timezone setting if necessary.

Set the date and time for your event using the available fields. Specify the start date and time, as well as the end date and time.

Provide a detailed description of your event in the editor. You can use the formatting options to add headings, paragraphs, lists, and other formatting elements to make your description more engaging.
The event description field uses the React version of TineMCE.

Add a images for your event. Click on “Introduction” tab and then click on “Add Images”. The images will represent your event visually and will be displayed in event listings and on the event page.

If you want to associate an organizer with your event, click on the “Organizers” tab. Click on the “Add new organizer” button if you haven’t created an organizer before. Otherwise, select the appropriate organizer from the dropdown menu. An event can have more than one organizer.

Optionally, you can associate guests with your event. Click on the “Guests” tab and click on the “Add new guest” button to create a new guest or select an existing one from the dropdown menu.

Set the event location by scrolling down to the “Location” section. You can either choose an existing location from the dropdown menu or create a new one by clicking on the “Add new location” button.

Once you have filled in all the necessary details for your event, click on the “Create” button at the bottom to make your event live on your website.

Updated on 16 May 2023

Create Event Tickets

Before proceeding, ensure that you have the WooCommerce plugin installed and configured on your WordPress site.

Log in to your WordPress Dashboard.

Go to the Products menu and select “Add New“.

Fill in the necessary product data, such as title, description, product gallery, and price, according to your ticket details.

Depending on your requirements, choose either “Simple product” or “Variable product” as the product type for your ticket.

In the product tab menu on the left side, which includes tabs like “General,” “Inventory,” “Shipping,” and more, you will now see a new tab named “Ticket“.

Click on the “Ticket” tab and select the “Convert to Ticket” checkbox. This flags the product as a calendar ticket.

After selecting the checkbox, two additional options will appear: “Manage stock” and “Stop selling tickets“.

Enabling “Manage stock” in the Ticket tab allows you to limit the ticket stock quantity per event occurrence if the event is repeated.

“Stop selling tickets” lets you prevent the ticket from being sold after a certain time before the event (e.g., 2 hours, 1 day before the event).

Once you have entered all the necessary ticket data, click “Publish” to save the ticket.

To add this ticket to your event, go to Dashboard -> STEC -> Events -> Add / Edit event. Navigate to the “Tickets” tab in the event sidebar menu.

In the “Add tickets” field, enter the name of the ticket you just created.

The calendar will search for this ticket and display its basic data with an “Add to event” button. Click on the “Add to event” button to insert this ticket into the event and save the event.

Updated on 16 May 2023

Set up Pages

Log in to your WordPress admin dashboard.

Locate the “Dashboard” menu on the left-hand side.

Go to “Pages“, and then click on “Add New” to create two blank pages. Name one page as “Guests” and the other page as “Organizers”.

Once the pages are created, return to the Dashboard menu.

Scroll down and find the “STEC” menu item.

Click on the “STEC” menu item to access the sub-menus.

From the sub-menus, click on the “Settings” option. Then navigate to the “Pages” tab within the settings.

In the “Pages” tab, you will find the following fields:

Events single page slug: This field allows you to change the slug (URL) of the single event page. You can customize it according to your preference.

Organizers page id: Enter the ID of the “Organizers” page you created earlier in this field.

Organizers page slug: This field represents the slug (URL) for the “Organizers” page.

Guests page id: Enter the ID of the “Guests” page you created earlier in this field.

Guests page slug: This field specifies the slug (URL) for the “Guests” page.

Note that after making these changes, it’s essential to refresh your website’s permalinks. To do this, go to Dashboard -> Settings -> Permalinks and click on the “Save” button without making any modifications.

Updated on 16 May 2023

Enabling multilingual support

Log in to your WordPress admin dashboard.

Locate the “Dashboard” menu on the left-hand side.

Scroll down and find the “STEC” menu item.

Click on the “STEC” menu item to access the sub-menus.

From the sub-menus, click on the “Settings” option. Then navigate to the “Language” tab within the settings.

In the “Language” tab, enable “Enable multilingual support” checkbox. Note changes to this setting require page reload. Save settings and reload the page.

When multilingual support is enabled, your calendars, categories, organizers, guests, and locations will include a new option called ‘Language Code‘. This option allows you to specify the language in which these items should be displayed on the front-end of your website. By selecting the appropriate language code, you can ensure that the relevant content is presented correctly to your multilingual audience.

Please note that in order to utilize multilingual support, you will still need to have a multilingual plugin installed and activated on your WordPress site, such as WPML, Polylang or similar. These plugins provide the necessary functionality to switch the language of your WordPress website.

Updated on 16 May 2023

Set up GDPR Variables

The following JavaScript variable serves the purpose of configuring user preferences in relation to their GDPR settings adjustment:

 
      window.STEC_FORCE_DISABLE = {
           google_recaptcha: true,
           google_maps: true,
           open_street_map: true,
           open_weather_maps: true,
           facebook_comments: true,
           internal_comments: true,
           navigator_geoloc: true,
           reminder: true,
           attendance: true,
           tiny_mce: true
      }

google_recaptcha: true – Blocks Google ReCaptcha front-end script from loading.
google_maps: true – Blocks Google Maps script from loading.
open_street_map: true – Blocks OpenStreetMap script from loading.
open_weather_maps: true – Disables OpenWeatherMap contents.
facebook_comments: true – Disables Facebook comments form of the plugin.
internal_comments: true – Disables the internal comment form of the plugin.
navigator_geoloc: true – Turns off geolocation detection.
reminder: true – Removes reminder buttons.
attendance: true – Removes attendance section.
tiny_mce: true – Disables TinyMCE

Updated on 16 May 2023

Events List Shortcode

Please note that all of the parameters listed below are also available from the widget settings

Shortcode: [stec_events_list]

min_date
Filter events by minimum date. See list with accepted date values

max_date
Filter events by maximum date. See list with accepted date values
Values:

limit
Maximum number of events to display
Values: number 1,2,3…

include
Include only selected events by ID
Values: number 1,2,3…

order
List order
Values: asc/desc

event_status
Filter events by status
Values: EventScheduled, EventMovedOnline, EventPostponed, EventRescheduled, EventCancelled

display_tags
Display tags
Values: true or false

display_thumbnail
Display thumbnails
Values: true or false

display_tickets
Display tickets
Values: true or false

display_locations
Display locations
Values: true or false

display_categories
Display categories
Values: true or false

display_description
Display description
Values: true or false

featured_only
Display featured events only
Values: true or false

stec_cal
Filter by calendar ID

stec_cat
Filter by category ID

stec_loc
Filter by location ID

stec_org
Filter by organizer ID

author
Filter by author ID

Updated on 23 Sep 2023

Events Slider Shortcode

Please note that all of the parameters listed below are also available from the widget settings

Shortcode: [stec_events_slider]

min_date
Filter events by minimum date. See list with accepted date values

max_date
Filter events by maximum date. See list with accepted date values

limit
Maximum number of events to display
Values: number 1,2,3…

include
Include only selected events by ID
Values: number 1,2,3…

order
List order
Values: asc/desc

event_status
Filter events by status
Values: EventScheduled, EventMovedOnline, EventPostponed, EventRescheduled, EventCancelled

display_tags
Display tags
Values: true or false

display_thumbnail
Display thumbnails
Values: true or false

display_tickets
Display tickets
Values: true or false

display_locations
Display locations
Values: true or false

display_categories
Display categories
Values: true or false

display_description
Display description
Values: true or false

featured_only
Display featured events only
Values: true or false

stec_cal
Filter by calendar ID

stec_cat
Filter by category ID

stec_loc
Filter by location ID

stec_org
Filter by organizer ID

author
Filter by author ID

gutter
Events spacing in pixels

columns
Desired number of columns (if the wrapper width allows it)

tickets_btn_label
Ticket button label (if event has tickets)

auto_slide
Auto slide events
Values: 0 – off or seconds ( 1,2,3, etc…)

Updated on 23 Sep 2023

Accepted date values

Date filters accept static date or a dynamic date value

Static date
Any date in format YYYY-MM-DD e.g. 2023-12-31

Dynamic dates list

• 2_years_ago: 2 years ago from now
• 2_years_ahead: 2 years ahead from now
• 1_year_ago: 1 year ago from now
• 1_year_ahead: 1 year ahead from now
• 6_months_ago: 6 months ago
• 6_months_ahead: 6 months ahead from now
• 3_months_ago: 3 months ago
• 3_months_ahead: 3 months ahead from now
• end_of_next_month: End of next month
• start_of_next_month: Start of next month
• end_of_prev_month: End of previous month
• start_of_prev_month: Start of previous month
• end_of_this_month: End of current month
• start_of_this_month: Start of current month
• end_of_next_week: End of next week
• start_of_next_week: Start of next week
• end_of_prev_week: End of previous week
• start_of_prev_week: Start of previous week
• end_of_this_week: End of current week
• start_of_this_week: Start of current week
• end_of_today: End of today
• start_of_today: Start of today
• end_of_today: End of today
• now: Now
• start_of_this_year: Start of the current year
• end_of_this_year: End of the current year
• start_of_the_prev_year: Start of the previous year
• end_of_the_prev_year: End of the previous year
• start_of_the_next_year: Start of the next year
• end_of_the_next_year: End of the next year

e.g. min_date=”now” max_date=”end_of_this_month”

Updated on 30 August 2023