Using element scheduling

advertisement
ASLS Webmasters
January 14, 2013
Using element scheduling
1. Log in to CommonSpot:
https://cmsauth.uwstout.edu/login.cfm or
https://cmsauth.uwstout.edu/[your_subsite]/login.cfm.
2. Navigate to your pages.
3. Create a new page, with three columns.
New > Page
4. Access the central-column Container’s Layout Properties:
5. Enable scheduling for elements in the Container Layout Properties.
Before you click Save, take a look at all the properties.
6. Name the existing Formatted Text Block and add desired content.
7. Insert another Formatted Text Block into the container and edit the element, adding content
and giving the element a descriptive name.
8. If desired, insert other elements in the container and edit them as appropriate.
9. Select the Container’s Criteria.
The Edit Rendering Criteria dialog appears.
10. Select Edit scheduling properties in the Edit Rendering Criteria dialog.
The Schedule/Personalize Element dialog appears:
Choose the option that provides the desired functionality.
The Date Range option enables you to specify exact dates for the element to appear on the page and
disappear from the page. You might use this for information applicable to fall term, spring term, or
summer break. You could create the element at any time of year, and it will automatically
appear/disappear when specified.
Groups enables you to set the element so that it only appears when members of particular groups load
the page. This group assignment is something we should really explore. For example, we might be able
to put faculty/staff in one group, students in another, and everyone else in yet another. We might also
be able to assign everyone who clicks the Admissions link (on the Stout home page) as a member of a
prospective-student group. We could even get more granular. We’ll need to work with Steve Cox & Barb
Button on this.
The Weekdays option enables you to specify days of the week when the content will appear. For
example, certain content might be visible on Saturday and Sunday while different content is visible
Monday through Friday.
The Specific Times option enables you to specify exact times of the day when the content is visible. You
could use this in conjunction with the Weekdays option to create two elements:


One element is displayed during normal business hours and provides standard contact
information.
Another element is displayed after hours and on weekends, providing alternate/off-hours
contact information.
The Browser and other targets option enables you to display content depending on the type of browser
used. For example, you could deselect Safari (Apple) if you have an element containing Flash, which
Apple mobile devices doesn’t support. You could even create two “page versions”—one for mobile
devices and one for other devices.
This option also enables you to specify that an element does not print or show up in a search. Hmm…
The Variable Comparison option enables viewing of the element when the variable value matches the
specified comparison data (as described in the following pages).
Changing page content by user click
Imagine that we have a page (represented below) where we want to provide both static content (always
the same) and more dynamic content (which we’ll let users select). We can use scheduled elements to
provide that dynamic content. We can create links (like those in the left column) that, depending on
which link is clicked, will put different content into the dynamic content area.
The following steps describe a way to provide this functionality using variable comparison via URL (until
we find a better way).
Variable Comparison via URL
You’ve probably seen URLs like this: http://www.uwstout.edu/info.cfm?id=123
and this: http://www.uwstout.edu/info.cfm?id=456.
The question marks (?) signal HTTP query strings. Each query string contains both a variable and its
value (comparison data). In our examples above, both query strings contain a variable named "id",
the first with a value of "123" and the second with a value of “456.” Each of those values is
associated with data of some sort.
So what does this mean to us?
When CommonSpot is fed a link ending with ?id=123, it “searches “ variables named “id” until it
finds one with a value of “123.” It then returns whatever data is associated (in this case, a
CommonSpot element that might contain text and images).
We can name the variable anything we want, such as “content.” And we can use whatever comparison
data we choose.
Continued from the previous step.
11. In the Schedule/Personalize Element dialog we opened in Step 10…
- Type in a Variable name, such as “content.”
- Set the Operator to eq. This will will look for something that equals/matches the comparison
data we specify.
- Type in a value (comparison data) that you can associate with the content of this element.
- Save.
12. Now repeat the previous step for the other element(s), using different Comparison data for each
element.
13. View the page’s standard properties, copying the relative URL. (We’ll use the URL to create our
links.)
Now let’s create the links.
14. Add a UW-Stout CMS Custom Elements > UW-Stout Featured Quick Links element to the right
column.
15. Edit the Quick Links element, creating links—as follows—to each element for which you set
variables.
We could (but won’t) link to Scheduled Element as shown in the following image:
Instead, for each we’ll link to an Unregistered URL or Relative Internal Link, passing the content
variable within the link, as shown in the following image.
We’ll paste the URL we copied in Step 13 into the URL field, then we’ll append the following
string to the url:
?content=A
Where…
- ? signals the start of an HTTP query string
- content is the name of the variable we specified in the Schedule/Personalize Element dialog
- The = symbol indicates that the value/comparison data must exactly match
- A is the value/comparison data we specified in the Schedule/Personalize Element dialog
Note: This string will vary depending on the values you specified in the Schedule/Personalize
Element dialog in Steps 11 and 12.
16. Save.
17. Preview the page, checking functionality.
Displaying content on mouseover
You can also create a link that—on mouseover—displays an element for which you specified a variable
& value. Due to a CommonSpot error, the link requires hand coding. The link would look something like
this:
<p><a href="javascript:show_sched_element('ContentCCC')"
onmouseover="javascript:show_sched_element('ContentCCC'); return true"
onmouseout="javascript:show_sched_element('ContentAAA'); return true">Content CCC
(mouseover)<br></a></p>
By the way, several CommonSpot dialogs indicate Mouseover Action. For example, the Edit Formatted
Text Block Link dialog (shown below) provides the option to show a scheduled element on mouseover,
but that action doesn’t appear to work due to a CommonSpot coding problem. Use the fix noted above
(or use a better fix of your devising).
Schedule/Personalize
The following procedure is incomplete.
1. Add a Schedule/Personalize element from the Miscellaneous Elements section of the Element
Gallery dialog.
2. Select that new element, access the Layout properties, and click Show/Hide Elements
Dynamically. Save.
3. Select that new element, access Elements and add a new element.
4. Name the element “A” (or something like that), add some content, and save.
5. Click Add New Element. Name the element something like “B” and choose a Formatted Text
Block as the Element Type. Save.
6. Click the eyeglasses icon next to the new element and edit the Text block, adding content.
7. Access the Schedule/Personalize Elements menu. Click the eyeglasses, which forces that
element to render and makes the others “invisible.” Close the pop-up.
8. Access the Schedule/Personalize Criteria.
9. ….
Download