This content originally appeared on Envato Tuts+ Tutorials and was authored by Sajal Soni
In this post, we’re going to review Ajax Full Featured Calendar 2 from CodeCanyon. This script allows you to add calendars to your PHP website. It’s a ready-to-use tool which you can integrate in your existing PHP website and start using today!
If you’re building a website which is related to events or would like to present your site events in an interactive and interesting way, then you've come to the right place!
There are plenty of premium calendar extensions and scripts available for your PHP website. For each of these premium scripts and extensions, you can expect quality code, bug fixes, support, and new enhancements.
In this post, we’re going to discuss the Ajax Full Featured Calendar 2 script, available at CodeCanyon for purchase at a very reasonable price. It has an admin panel where you can create events, and a front-end calendar.
Let’s quickly go through the important features it provides:
- responsive UI
- add, edit, delete, view, export, update calendar events
- autoembed YouTube, Vimeo, soundclould, and more
- support for custom categories and fields
- support for recurring events
- Google maps integration
As you can see, the Ajax Full Featured Calendar 2 tool provides a lot of useful features that allow you to set up event calendars quickly. Throughout the course of this tutorial, we’ll explore the different features provided by this plugin.
To start with, we’ll see how to download and install the Ajax Full Featured Calendar 2 script from the CodeCanyon marketplace.
Installation and Configuration
In this section, I'll show you how to install and configure the Ajax Full Featured Calendar 2 tool once you’ve purchased and downloaded it from CodeCanyon.
As soon as you purchase it, you’ll be able to download the zip file. Extract this, and you will find a directory with the main script code: AFFC5.
It provides two different versions of event calendars you could choose from. Under the AFFC5 directory, there are two more directories, AFFC2 and AFFC5. The AFFC2 supports Bootstrap 3.x and Fullcalendar 3.x versions, while the AFFC5 supports Bootstrap 5.x and Fullcalendar 5.x versions. You can choose as per your requirements.
The Ajax Full Featured Calendar 2 comes with different demos. We're going to use the AFFC5/AFFC2/Demo/Admin/Demo1 version. Firstly, upload the files from the AFFC5/AFFC2/Demo/Admin/Demo1 directory to your server root directory.
Next, you just need to run it in your browser with your domain. When you run it, it should take you to the installation part as shown in the following screenshot.
Fill in the necessary details and click on the Install button to install it. If everything goes well, it'll be installed successfully as shown in the following screenshot.
Just in case, if you've any issues, you can also install it manually. You just need to import the AFFC5/AFFC2/Demo/Admin/Demo1/calendar.sql file in your database. After that, make sure to create the AFFC5/AFFC2/Demo/Admin/Demo1/includes/connection.php file as shown in the following snippet.
1 |
<?php
|
2 |
// DB Connection Configuration
|
3 |
define('DB_HOST', ''); |
4 |
define('DB_USERNAME', ''); |
5 |
define('DB_PASSWORD', ''); |
6 |
define('DATABASE', ''); |
7 |
define('TABLE', 'calendar'); |
8 |
define('USERS_TABLE', 'users'); |
9 |
|
10 |
define('SITE_FILES_URL', ''); |
11 |
|
12 |
// Default Categories
|
13 |
$categories = array("General","Party","Work", "Letters & Arts"); |
14 |
|
15 |
/*
|
16 |
Only applied for non user versions
|
17 |
Should (non admin versions) display user events from the database?
|
18 |
true - does not display user events
|
19 |
false - will display all events on the database even private ones on non admin versions (e.g: 'Simple')
|
20 |
*/
|
21 |
define('PUBLIC_PRIVATE_EVENTS', true); |
22 |
|
23 |
// Feature to import events
|
24 |
define('IMPORT_EVENTS', true); |
25 |
|
26 |
?>
|
Of course, you'll need to configure the correct database settings in the above file.
With that you're pretty much done with the installation part.
The Dashboard Overview
Once you've installed the Ajax Full Featured Calendar 2 tool properly, you can start using it right away. Go to the https://localhost/index.php URL in your browser, and it should take you to the login page as shown in the following screenshot. Of course, you need to replace the localhost domain with your domain.
Enter the username and password that you configured during the installation part and click on the Log in button to log into the calendar application. After login, you'll be redirected to the main dashboard view as shown in the following screenshot. The calendar view is same for both front-end and back-end application.
Let's quickly go through the different types of calendar views available at your disposal.
The Month View
Click on the month tab to view events in the current month.
The Week View
Click on the week tab to view events that are scheduled in the current week.
The Day View
Click on the day tab to view events that are scheduled today.
The List View
Click on the list tab to view all the upcoming events in a list view.
So these are the different views the calendar provides. Apart from that, you can access other features like search, import and export events from within the dashboard itself.
Next, we'll see how to create events.
How to Create Events
It's fairly easy to create new events. It also depends on the type of event which you want to create. If you want to create a full day event, you can use the month view of the calendar. On the other hand, if you want to create a time-bound event, you can either use week view or day view.
Let's see how to create different type of events.
Create a Full Day Event
In the month view of the calendar, click on the date box at which you want to schedule an event, and it should display the following pop-up for event creation.
Fill in the necessary details and click on the Add button to create the event!
Create a Time-Bound Event
In the week view or list view of the calendar, click on the time-slot at which you want to schedule an event, and it should display the following pop-up for event creation.
As you can see, when you create a time-bound event, it already fills in the start date-time and end date-time for you. Just go ahead and fill in the necessary details and save it!
Go ahead and create a few different types of events to get the feel of it. Also, once you create a couple of events, it would help you to understand how the events are displayed on the calendar in different views.
Walk Through Other Features
In this section, we'll go through a couple of other features provided by the Ajax Full Featured Calendar 2 tool.
Event Search
The Ajax Full Featured Calendar 2 tool provides search tools that a user can use to search events. You can use either the free text search field or the category drop-down box to filter the events that are displayed on the calendar view.
Import/Export Feature
It also allows you to import and export events. When you click on the Export button, it will generate the calendar.ics file which contains all the events. .ics is the standard file format for iCalendar, it allows you to share and import calendar entries with other applications and users easily. And if you already have a .ics file which contains the events, you can easily import it using the Import feature.
Custom Categories Support
Although, the calendar provides four default categories to create events like General, Party, Work and Letters & Arts, you can set up custom categories as well if you wish to do so.
Go ahead and open the AFFC5/AFFC2/Demo/Admin/Demo1/includes/connection.php file, which contains the $categories
array as shown in the following snippet, and you can add your own custom categories in this list and you're done.
1 |
... |
2 |
... |
3 |
// Default Categories |
4 |
$categories = array("General","Party","Work", "Letters & Arts", "My Custom Category One"); |
5 |
... |
6 |
... |
Add New Users
If you can recall it, when setting up the calendar application, we created a default username and password so that you can login with it. Apart from that, it also allows you to create other users if you want to have different users in your application.
Go ahead and click on the Add User button as shown in the following screenshot to create a new system user.
Once you click on that button, it would open the following screen which allows you to enter the username and password of the new user.
Enter the username and password and click on the Add User button to create a new user. So in this way, you can add multiple users as well.
So as you can see, Ajax Full Featured Calendar 2 provides a complete solution for creating, managing, and displaying events. Feel free to explore it and get yourself familiar with the UI and it'll be a fun. Also, it comes with a comprehensive documentation which will guide you should you wish to make yourself familiar with the technical aspects of it.
The Next Step: A Quick Look at a Couple of Other Events Calendar Scripts
If you're looking for more advanced calendar scripts that you could use right away, I recommend that you check out the following post, which summarizes some excellent scripts that are available for a low cost.
Here are a couple of interesting ones:
Cleanto
Cleanto is ideal for many different types of service companies looking for a reliable way to provide clients with full-featured online booking.
Tiva Timetable
Fully responsive, easy to set up, and very customizable, the Tiva Timetable is a good choice for those who are looking for a calendar with a clean and simple modern design.
Conclusion
Today, we reviewed the Ajax Full Featured Calendar 2 script available from CodeCanyon. It allows you to create events on your PHP website. In this post, we discussed how to download, install and configure it on your web server. Considering the features it provides, I believe it’s reasonably priced and it’s worth giving a try.
This content originally appeared on Envato Tuts+ Tutorials and was authored by Sajal Soni
Sajal Soni | Sciencx (2019-08-06T16:53:19+00:00) How to Create a Simple Event Calendar for Your PHP Website. Retrieved from https://www.scien.cx/2019/08/06/how-to-create-a-simple-event-calendar-for-your-php-website/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.