4. Custom CSS & JS

The Custom CSS & JS tab allows you to extend and customize the look, feel, and functionality of your Eventful layouts without editing core plugin files. This is useful for developers and advanced users who want to apply unique styling or custom scripts directly.

1. Custom CSS: Write your own CSS rules here to override or extend Eventful’s default styling.

• Example:

.eventful-title {
  color: #FF5733;
  font-weight: bold;
}

This snippet will change the event title color and make it bold.

2. Custom JS: Insert JavaScript or jQuery code to add interactivity or custom logic to your layouts.

• Example:

jQuery(document).ready(function($){
  $('.eventful-item').click(function(){
    alert('Event clicked!');
  });
});

This script will trigger an alert whenever an event item is clicked.

Tip:

• Always test your CSS/JS changes in a staging environment before applying them to your live site.
• If you make a mistake, you can reset the section using the Reset Section button at the top right.