Topics

  1. Home
  2. Docs
  3. Topics
  4. Tickets
  5. Ticket Themes

Ticket Themes

FooEvents Ticket Themes allow you to change the way your email tickets look using template sets called Ticket Themes. These can be downloaded from the free Ticket Themes gallery on the FooEvents website.

Quick Links

Adding a new ticket theme

  1. In your WordPress Admin Area, go to FooEvents > Ticket Themes
  2. Browse to select the theme from your desktop that you downloaded from the FooEvents Ticket Themes page
  3. Click on Upload Ticket Theme
  4. Click on the preview image of the theme to send a test email

Setting a ticket theme for event tickets

  1. In your WordPress Admin Area, click on Products
  2. Edit your event (product)
  3. Click on the Event tab
  4. Select the theme in the HTML Ticket Theme and/or PDF Ticket Theme dropdown
  5. Click on Update

Changing the logo

  1. In your WordPress Admin Area, click on Products
  2. Edit your event (product)
  3. Click on the Event tab
  4. Upload your logo file in the Ticket logo field. To ensure compatibility with different email formats please be sure to only use a .png or .jpg image.
  5. Click on Update

Changing the header image

  1. In your WordPress Admin Area, click on Products
  2. Edit your event (product)
  3. Click on the Event tab
  4. Upload your logo file in the Header image field. To ensure compatibility with different email formats please be sure to only use a .png or .jpg image.
  5. Click on Update

Modifying a ticket theme template

  1. Browse to the directory wp-content/uploads/fooevents/themes/
  2. Make a copy of the theme you wish to overwrite e.g. wp-content/uploads/fooevents/themes/[FOOEVENTS-THEME-NAME]
  3. Make changes as required to the files in the new theme directory that you copied

Versions older than 1.7.0:

  1. In your WordPress theme create the following directory structure: fooevents/templates
  2. Copy the template files that you would like to modify from the wp-content/plugins/fooevents/templates directory to the directory that you created in Step 1
  3. Modify the template files as required

Create your own HTML Ticket Theme

PLEASE NOTE: HTML and CSS skills are required!

Step 1: Download a Ticket Theme

Download the FooEvents Ticket Starter Theme or one of our many free ticket themes

Step 2: Make your Changes

1. Extract the ticket theme ZIP file that you downloaded
2. You can rename this folder to something else. Use one word or words separated by underscores only, no spaces!
3. Open the files “header.php”“ticket.php” and “footer.php” in your favourite text editor:

  • The file “header.php” contains the logo, header image, general event details such as the time, location and “Add to Calendar” link
  • The file “ticket.php” contains the barcode and specific attendee details such as the name, custom fields and seats. The code in “ticket.php” will be repeated for each ticket if the customer purchased multiple tickets for the same event in one transaction
  • The file “footer.php” contains the contact information

The specific information contained in these files might be different depending on the ticket theme.

4. Customize the HTML and CSS:

    • If you want to change the colors in a premium theme you will have to search for every occurrence of the color in the inline CSS styles
    • You can either upload your images to the “images” folder in the theme folder or host them somewhere else
    • In both cases, make sure that your are using absolute URLs to reference the images
    • If you’ve uploaded your images to the “images” folder, make sure that the “src” attribute starts with the following code:
<?php echo $themePacksURL.'theme/images/'; ?>
  • If you’re using images in the “images” folder, remember to change “theme_name” to the same word that you’ve named your theme folder in Step 2
  • You can change the image called “preview.jpg” to something that represents your theme

Step 3: Upload Modified Files to Server

1. Use an FTP client such as FileZilla to access the files on your server
2. Browse to the directory “your-wordpress-install/wp-content/uploads/fooevents/themes/
3. Upload the complete themes folder here

Step 4: Test your Theme

1. Login to your WordPress Admin Area and go to Tickets -> Ticket Themes
2. Look for the new ticket theme that you’ve created
3. Click on the image
4. Send a preview to your email address to see an example of how your tickets will look if they use this theme
5. If you are not happy with the result, go back to modifying the HTML and CSS and re-upload the files to your server

Step 5: Set your Theme

You can apply your new ticket theme to your event once you are happy with it.

1. Go to ‘Products’ in your WordPress Admin Area
2. Edit your event
3. Click on the “Event” tab
4. Select your theme in the “HTML Ticket Theme” and/or “PDF Ticket Theme” dropdown list
5. Update your event

The tickets that your customers receive for this event in the future will now use your new template. You can also test your ticket theme again by resending an existing ticket to your own email address.

Sending an HTML ticket preview

  1. Navigate to FooEvents > Tickets Themes in your WordPress Admin Area
  2. Click the theme that you wish to preview. The default FooEvents ticket theme is named “Default”
  3. In the text input box, enter the email address where you would like to send the preview and click the “Send Ticket Preview” button
  4. The ticket will then be sent to the email address you specified
  5. Please Note: The ticket data is pre-populated test data and it is not from one of your valid events. Tickets sent via the preview option will not scan using the ‘FooEvents Check-ins’ app, nor will they match any of your generated tickets

Removing installed FooEvents HTML or PDF ticket theme

  1. Connect to your server via FTP
  2. Navigate to the folder ‘wp-content/uploads/fooevents/themes’
  3. Delete the folder of the theme that you would like to remove

Modify the theme date format

The date displayed on a ticket is the date entered in the events individual settings. The format of the date is determined by the WordPress date format.

FooEvents currently supports the default date formats in the English version of WordPress only. Please note FooEvents does not currently support custom date formats.

You can change which date format to use here – WordPress Dashboard > Settings > General

Please note that after you’ve changed the date format you will have to edit each event, select the event date(s) again and click on “Update” before the date format change will be applied. New tickets that are emailed or existing tickets that are emailed again after this change will display the date in the new format.

Difference Between Single and Multiple PDF Ticket Theme Templates

​If you are using the “Single” template and a customer purchases multiple tickets then each ticket will appear on its own page in the same PDF file. Each ticket will have its own header image, logo and event details. If you are using the “Multiple” template then the event logo and details will appear at the top of the page followed by 3 tickets and then again the event details followed by 3 tickets etc. The idea is that the event details and 3 tickets fit on one page, but if you are displaying a lot of information then these tickets might run over onto the next page. To change this you can either display less information or override the template to remove some of the padding or reduce the font size.

Tags , , , , , , ,
Was this article helpful to you? Yes No