Login / Status
developer.Resource
Home . Documentation . Document Library . Extension Manuals
Sponsors
hosted by punkt.deTYPO3 and Open Source MagazineAOE Media

1.3. Configuration

Changing the HTML template

This extension uses a couple of different HTML templates:

template path

contents

TS setup variable

seminars.tmpl

automatic e-mails

plugin.tx_seminars.templateFile (not in flexforms)

pi1/seminars_pi1.tmpl

front-end output

plugin.tx_seminars_pi1.templateFile (also in flexforms)

pi1/registration_editor.html

event registration form

plugin.tx_seminars_pi1.registrationEditorTemplateFile

Note: Do not change the HTML templates directly in the extension directory as then your changes will be overwritten when you upgrade the extension to a new version. Make a copy and modify the copy instead:

  1. Copy the corresponding template file to a convenient directory, e.g. to fileadmin/template/.

  2. Set the corresponding TS setup variable to the path of your new template. For the pi1 templates, you can also use the flexforms of the plug-in for setting the location.

  3. Change the template to your liking.

Configuring prices

You can set up to six different prices for each event: a “standard price” and a “special” price, e.g. for students and people in full employment (each of them can also be saved as an early bird price). In addition, there a two prices including full boarding (“regular” and “special”). In the registration form, the user can select the price to pay.

Events for free: In the single view, the standard price always gets displayed (even if it is 0.00), while the special price only gets displayed if it is not 0.00. This means that if you need to enter a price that is 0.00 (eg. as a special discount), you need to enter this as the standard price and enter the non-zero price as the special price even if the non-free price technically is the standard price.

The early bird prices will only have an effect if you also define an early bird deadline (until when these prices are valid). If no early bird price is set or the deadline has already passed by, these prices won't be visible in the front end.

If you have only one price per seminar, you can configure the list view to not display the special price column (look in the reference for details). In addition, you might want to set some of the following options to just display “price” instead of “standard price”:

  1. For the front-end view:

    1. plugin.tx_seminars_pi1.generalPriceInList

    2. plugin.tx_seminars_pi1.generalPriceInSingle

  2. For the e-mails to the attendees:

    1. plugin.tx_seminars.generalPriceInMail

If you have two prices for some or all seminars, you can change the default labels “regular price” and “special price”, e.g. to “Adults” and “Children”. You can change them using these variables:

  1. For the front-end list view and detail view:

    1. plugin.tx_seminars_pi1._LOCAL_LANG.language.label_price_regular / price_regular_early / price_regular_board / price_special /  price_special_early /  price_special_board

  2. For the e-mails to the attendees and the drop-down box in the registration form:

    1. plugin.tx_seminars._LOCAL_LANG.language.label_price_regular / price_regular_early / price_regular_board / price_special /  price_special_early /  price_special_board

Replace “language” with your two-letter language code if you use a language other than English, e.g. “de” for German. Use “default” as language code for English.

Changing the localized strings

You can change most of the localized strings that are used on the front end and for the e-mails. (The localized strings for the back end and the input form labels for the online registration currently cannot be changed.)

When you want to change some strings, please don't change locallang.xml or pi1/locallang.xml directly as these changes would get overwritten on the next update. Instead, do it like this:

  1. Find out the language code of the language for which you'd like to change a string. The language code for English is “default” and the language code for German is “de”. All other languages have two-letter codes as well.

  2. Find out whether the string which you'd like to change is in locallang.xml or pi1/locallang.xml.

  3. Find out the array key for that corresponding string.

  4. In your TS setup, set the following (replacing language with your language code and key with the corresponding array key):

  1. plugin.tx_seminars._LOCAL_LANG.language.key (for strings from locallang.xml) or

  2. plugin.tx_seminars_pi1._LOCAL_LANG.language.key (for strings from pi1/locallang.xml)

Adding links to the terms & conditions page

terms & conditions page

On the second registration page, you can have up to two “terms & conditions” checkboxes. If you would like the checkbox labels to link to the page containing the terms & conditions (or if you would like to open that page as a pop-up), you can use some HTML for the checkbox label. For example, this will add a link to the first terms & conditions checkbox for a German site:

plugin.tx_seminars_pi1._LOCAL_LANG.de.label_terms = <a href="/index.php?id=1106&amp;type=11" onclick="popup(this.href); return false">Die Allgemeinen Gesch&auml;ftsbedingungen</a> habe ich gelesen und erkenne sie hiermit an.

You can do the same for the label_terms_2 label.

Configuring CSS

The extension provides its own basic set of CSS styles (which work best with a white background and if you're already using a CSS-based design and css_styled_content). These stylesheets usually get included automatically. However, if your have set disableAllHeaderCode = 1 and want to use the provided stylesheet, you need to include the stylesheet typo3conf/ext/seminars/pi1/seminars_pi1.css manually into your page header.

When looking to the source of the HTML output of this extension, you will see that there are some parts of the output (for example table cells) marked to belong to a certain class. But not every part has as 'class=”xyz”'—we have only those classes that are actually used in the CSS file so that the HTML code stays lean. If needed, you can add classes to these parts by adding them to your TypoScript setup (in the template):

By default, the organizer field in the ListView has no class added to keep the HTML-Output as clean as possible. It looks like this:

[...]<td>[name of the organizer]<td>[...]

If you add the following line to your setup,

plugin.tx_seminars_pi1.class_listorganizers  = organizers

the output shows us the following:

[...]<td class="tx-seminars-pi1-organizers">[name of the organizer]</td>[...]

So the resulting class name will be tx-seminars-pi1 and the value from the corresponding TS rule appended. Please not that the last part of the name in the TS setup (“class_listorganizers”) needs to match the string in the HTML template (“###CLASS_LISTORGANIZERS###”). The only difference lies in the capitalization and the “###”.

Then you can add a rule like this to your CSS file:

.tx-seminars-pi1-organizers { ...;}

Classes for table rows

The TR elements of the list view already have a few classes automatically set:

  1. listrow-odd for every other row, starting with the second row

  2. tx-seminars-pi1-canceled for canceled events

  3. tx-seminars-pi1-owner if the logged-in FE user had entered this event record

Configuring the colored square for the number of vacancies

In the list view, the color of the squares in the vacancies column is configured using CSS. The table cell for the vacancies has three CSS classes:

  1. tx-seminars-pi1-vacancies

  2. tx-seminars-pi1-vacancies-x with x being replaced by the exact number of vacancies (which may be 0)

  3. tx-seminars-pi1-vacancies-available if there is at least one vacancy

  4. tx-seminars-pi1-vacancies-cancelled if the event has been canceled

  5. tx-seminars-pi1-deadline-over if the registration deadline for that event has passed

The square itself also has a CSS class:

  1. tx-seminars-pi1-square

This allows you to configure the color of the square in detail, depending on the number of vacancies. The default stylesheet uses:

  1. green for more at least three vacancies

  2. yellow for one or two vacancies

  3. red for “no vacancies” and for canceled seminars

The corresponding part of the default CSS file looks like this. You can do this likewise in your own style sheet:

.tx-seminars-pi1-vacancies-available .tx-seminars-pi1-square {
  background-color: #00a500;
  color: inherit;
}
.tx-seminars-pi1-vacancies-2 .tx-seminars-pi1-square, .tx-seminars-pi1-vacancies-1 .tx-seminars-pi1-square {
  background-color: #ffff3c;
  color: inherit;
}
.tx-seminars-pi1-vacancies-0 .tx-seminars-pi1-square, .tx-seminars-pi1-cancelled .tx-seminars-pi1-square {
  background-color: #c30000;
  color: inherit;
}

Setting up the “multiple seats” feature

Setting up the “multiple seats” feature

In the default configuration, this extension allows each user to register only one seat per event. This can be changed if you need users to register more than one seat per registration (e.g. when you use this extension for a theater, or you would like companies to register all their attendees in one go).

Please note that this doesn't enable users to register multiple timesit just allows them to enter the number of seats for their registration.

This is what needs to be changed:

  1. For the back-end user group managing the registrations, enable the excludefield Attendances: number of seats. If you would like the attendee to also enter the names of the other attendess, please also add Names of the attendees.

  2. Enable the seats field for the notification e-mail to the organizers by adding seats to plugin.tx_seminars.showAttendanceFieldsInNotificationMail. If you would like the attendee to also enter the names of the other attendess, please also add attendees_names.

  3. Enable the seats field in the online registration form by adding seats to plugin.tx_seminars_pi1.showRegistrationFields. If you would like the attendee to also enter the names of the other attendess, please also add attendees_names. Please note that this value also specifies the order of the form fields on the front end.

If the field seats is not filled in (ie. the registration is for 0 seats), the registration is counted as 1 seat.

Please note the the number of seats currently is not included in the automated e-mail to the user. This will be implemented in a later version of this extension.

Setting up front-end editing

Setting up front-end editing

Only do this if you really trust your users to only enter serious events and no fun or test records.

  1. Create a system folder where front-end created event records will be stored. If you like, you can also use your existing event records folder for that. Either way, note the PID of this system folder.

  2. Create a front-end user group for the front-end users that are allowed to enter and edit event records in the front end. Write down the UID of that group.

  3. Add all front-end users that should be allowed to enter and edit events to that group.

  4. Create a page “Enter/edit events” and allow access exclusively to users of that front-end user group.

  5. Add a Seminar Manager plug-in to that page and set its type to “Event Editor”.

  6. In the tab “Front-end editing”, select the front-end group that is allowed to edit events. Alternatively, you can set this using the TS setup variable plugin.tx_seminars_pi1.eventEditorFeGroupID.

  7. Select the system folder where the created events will be stored. Alternatively, you can set this using the TS setup variable plugin.tx_seminars_pi1.createEventsPID.

  8. Select the the page that will be shown when an event has been saved. This can be the page with the user-entered events (which we will create in the next page) or a separate thank-you page. Alternatively, you can set this using the TS setup variable plugin.tx_seminars_pi1.eventSuccessfullySavedPID.

  9. Create a page “Events which I have entered” (or “My events”) and allow access exclusively to users of that front-end user group.

  10. Add a Seminar Manager plug-in to that page and set its type to “Events which I have entered”.

  11. In the first tab, select the system folder where front-end-created events are stored as data source from where to fetch the event records.

  12. In the second tab, you probably want to select “all events” as time-frame.

  13. In the tab “Front-end editing”, select the front-end group that is allowed to edit events. Alternatively, you can set this using the TS setup variable plugin.tx_seminars_pi1.eventEditorFeGroupID.

  14. Select the page with the event editor plug-in (that is the page which you have just created). Alternatively, you can set this using the TS setup variable plugin.tx_seminars_pi1.evenEditorPID.

Setting up the default VIPs feature

You can assign VIPs (front-end users) to each single event. These VIPs are allowed to see all registrations for the events where he/she is manually added as a VIP.

If you want to allow a group of VIPs to see the registrations of all events, you can add all those VIPs to a group. Just add the UID of that group to the TS configuration plugin.tx_seminars_pi1.defaultEventVipsFeGroupId.

After clearing the cache, all members of that group will see all events on their “my VIP events” page, and will be able to see the registrations list of all those events.

You can also set the group's uid in the flexform configuration or the plugin. But you will need to set it for each plugin (on every page). It's easier to set it via TypoScript setup on a global page.

Setting up the countdown

The countdown will show the time left (in words) until the next event starts. Only upcoming events with a begin date/time will be selected for this. If no matching event is found, a message will be shown instead.

To set this up, follow these easy steps:

  1. At the page/column where you want the countdown to be shown, add a new “Seminar Manager”-plug-in content element.

  2. In the settings of this new content element, select “Countdown to the next event” from the “what to display” dropdown list.

  3. You can change the visual appearance by changing the CSS or the HTML template. But please don't change them in the extension's directory (or all changes will be lost upon the next update of the extension)