Display Edge events on your webpage

If you are a developer who has access to server side scripting you will probably be better off grabbing the data from the various Juggling Edge Feeds which will give you more control.

If not or you are in a hurry you can use the following code to include a list of the latest juggling festivals on your webpage. Just copy and paste the following HTML into your page:

<div id="EdgeEventsList">
<p>For the latest details of upcoming juggling festivals visit the <a href="https://de.jugglingedge.com/events.php">Juggling Edge Events Listings</a>.</p>
</div>
<script async src="https://de.jugglingedge.com/eventsjs.php"></script>;

If you only want to display events for a certain country or alter the maximum number of events to display (limit 1-50) use the following controls which will update the code above:



What does it do?

The 'eventsjs.php' file that this code references pulls the latest events from the Juggling Edge database and creates a javascript file containing the event details. This file is sent to the user's browser when they load the page containing the above code. Once the page has finished loading the script will insert a paragraph for each event into the page. Users without javascript enabled will just see a link to the Juggling Edge events listings.

Take a look at the contents of the generated script file or see the script in action.

This script does NOT track user behaviour.

Styling the output

Each event is displayed inside the containing div in the following format:

<div id="EdgeEventsList">

<p class="event">
<a class="title" href="Edge Listing URL">Event Title</a>
<span class="date"><br />Event Date(s)</span>
<span class="address"><br />Event Address</span>
</p>

etc.

</div>

The elements will inherit the style of your page, but if you want to control the appearance you can use the following CSS selectors:

#EdgeEventsList
The containing block for all of the paragraphs

#EdgeEventsList .event
Each event

#EdgeEventsList .title
Each event title

#EdgeEventsList .date
Each date

#EdgeEventsList .address
Each address