News & Events | WS.WebTV Documentation | WebTV Solutions

Print

Introduction

This extension allows you to include/manage News and Events right into your WebTV. It fully integrates with WS.WebTV.

In this tutorial we will explain how to create an Event. News are similar to Events with the following differences: A News does not have "End Date", "Map" and "Notification"; additionally, versions prior to 1.9 did not allow associating "Documents" to News.

Google API Key

The extension integrates with Google Maps. This allows you to specify the geographical location of an Event (if you want to do so).

In order to use Google Maps, it is required that you generate a Google API Key and enter the corresponding key into the WebTV Configuration > General > Google API Key section:

How to get your Google API Key? Read the tutorial.

Creating an Event

1. Go to the News & Events page...

2. Once on the News & Event list...
(A) To create a new Event, or News, click on "New..." button and select the desired option. Select "Event".
(B) To edit an existing Event, or News, click the corresponding "pencil" icon.


The creation and edition interfaces are very similar, however, when you are editing an Event you will see additional options.

3. Properties Tab...
Physical location tracking warning:
You Web browser may display a message warning that the page (the WebTV) is trying to "track your physical location". Allow it so the WebTV is able to center, initially, the Map according to your location.
• Title: Enter the Event title.
• Slug: This is for friendly URLs. You can leave this field blank and the system will generate it automatically when saving.
• SEO Description: This description will be used for SEO and as excerpt when listing the Event on search result pages, etc.
• Tags/Keywords: Write some representative keywords (comma-separated).
• Image: Supply an image (4:3 preferable) to use as main image.
Drag and Drop Tip:
If you are using recent versions of Chrome/Safari, Firefox or Opera, you can drag and drop your image file to the image field. • Image Legend: Supply a brief text about the main image (optional).
• Template: Template to use for the Event.
• Allow Comments: To enable/disable comments for the Event.
• Socialize: To enable/disable the social sharing options for this Event.
• Start Date/Time: The starting date/time for the Event. If Hour and Minutes are set to 0 the system will not display the time.
• One-day Event: If set to Yes, you won't have to enter an eding date.
• End Date/Time: The ending date/time for the Event. If the start and end date/time are equal, the system will understand it is a one-day Event.
• Display Notification: If set to Yes a notification will be displayed in the WebTV, during the Event duration.
• Notification Link Type:
    » Auto: The notification link will correspond to the Event page URL.
    » Custom: You will be able to specify a custom URL.

This is an example to show you how the ongoing event notification will appear (a "foldable" box at the top of the WebTV).

• Display Map: Whether to display, or not, a map for the Event.
NOTE: In order to center the Map, drag it. To zoom in/out the Map use your mouse wheel. To move the marker, drag and drop it.
• Address:
WS.WebTV 1.9+:
Allows to enter the full address where the event will take place (if any). If you want to center the map respect this address, click "Address » Map". This address will be used for the event "Rich Snippet".
Example: Enter "1 Military Road, Watsons Bay NSW 2030" and click "Address » Map"...
WS.WebTV prior to 1.9:
Allows to position the map by entering an address. Click "Apply" when done.
Example: Enter "watsons, sydney" and click "Apply"...
• Google Maps URL: Allows to position the map using a Google Maps URL. Click "Apply" when done.
Example: Enter "https://www.google.com/maps/@40.5868511,-74.1608591,10z" and click "Apply"...
• Manual coordinates input: Allows to position the map using latitude and longitude coordinates. Click "Apply" when done.
Example: Enter Lat="39.50616872856661" and Long="-0.514008514062505", then click "Apply"...


4. The "Text/HTML Content" Tab...
On this tab is where you enter the desired information. As you can see, we have included the popular TinyMCE editor that allows you to apply format to your content, easily.


5. The "Gallery" Tab...
On this tab is where you add images to the Gallery. For more information, check the Gallery tutorial.

6. The "Documents" Tab...
On this tab is where you supply downloadable files for the Event. To add documents:
6.1. Click "New Document": A new empty entry will be added to the list.
6.2. Enter a Title and the document file (.pdf, ,doc, ,zip, etc.). The description is optional.
6.3. Files will not be uploaded until you Save.
6.4. Repeat steps 6.1-6.3 as required. NOTE: If you plan to upload several documents at once (more than 5) we recommend to do it in batches of 5. Most times, the server will limit the maximum number of simultaneous files (and toatal size) that can be uploaded.


7. The "Categories" Tab...
On this tab you can associate the Event with one or several Categories (optional).


8. Done editing...
Once you are done editing the Event, click the Save button.

9. Activating a new Event...
New Events (and News) are inactive by default. In order to activate an Event (or News), return to the News & Event list and click the "gray light bulb" icon (it will turn to yellow when active).

News & Events Widget

The extension includes a Widget to display Latest News / Latest Events / Upcoming Events into the sidebar or other widget zones. To create a News/Event List Widget:
1. Go to Configuration > Widgets
2. Click on "New Widget..." button and select "News/Event List". A new empty entry will be added to the list.
3. Enter the Title, CSS class (optional) and Number of Items for the list. Additionally, select the Type:
    » Latest News: Display a list of News sorted by date (latest first).
    » Latest Events: List ongoging and past Events (whose starting date/time is equal or earlier than the current date/time), sorted by starting date (latest first).
    » Upcoming Events: List future Events (whose starting date/time is later than current date/time), sorted by starting date (earlier first).