Author Archives: rousem

Twitter Feed Custom Element

Share

Adding the Twitter Feed to a Common Spot page requires three steps.

  1. Embed the Profile
  2. Create the Widget
  3. Add the Widget to your page

*You must have a Twitter account to execute this element

Embedding the Profile

Once you log on to Twitter, go to the account whose tweets you want to add to your page. Next, click on the drop down menu that looks like a head and shoulders and click “Embed this Profile”.
Creating Twitter embed code

Creating the Widget

The Create a User Widget dialog box appears (see image below). For username, use the name of the Twitter account you want to follow. In the image below, I’ve added East Carolina. Click the Create Widget button at the bottom. All the other properties are optional or can be left blank.

Widget2

After creating the widget, a line of code will appear in the box to the right. Copy and paste the code into a text editor like Notepad. In the copied code, there is a line that says “data-widget-id” followed by numbers, copy the numbers. This is the id you will use when putting the widget onto your page.

CopyCode

Here’s an example of what the code you would need to copy looks like:

Code

Adding the Widget to your Page

Under the Custom Elements dropdown menu in CommonSpot, click Twitter Feed. An error will appear that says “There was an error with the Twitter Feed. Please make sure all setting values are correct.” This is normal, click the link the link that says “Click here to define the custom element data”. A box will appear that requires the Twitter User Name, Number of Tweets to be Imported, and Data Widget ID to be entered. When entering the user name make sure to remember to put “@”. The Widget ID is the number that you have copied from Notepad. To show East Carolina’s twitter feed, it would look like this:

TwitterFeed


Once you click save the widget will appear as follows:

TweetFeed

Adding a Calendar Widget to Common Spot

Share

The University has begun rolling out a new calendaring application called Localist. The new application will replace all the current Common Spot calendar options. ITCS has worked to move all the calendar events stored in the old systems to the new Localist calendar application. You can visit the new calendar at http://calendar.ecu.edu.

If you would like to add the calendar events to your Common Spot page, the following tutorial will help you do that.

Localist Widget Builder

https://calendar.ecu.edu/help/widget

To add a calendar of events to your Common Spot website, you will need to create a “Widget”. You are not required to login to this site. For now, you should leave the defaults in place and the only choice you should make is to choose Event Type = University. Once you do that, scroll to the bottom of the page and click the “Generate Widget Code” button.

WidgetBuilder

Now that you have generated your Widget Code, click in the box called “Widget JavaScript”, highlight all the text in that box (you can use Ctrl A). Copy the text and paste into a text editor (Notepad works well.).

Edit the text to remove everything except for the actual URL. For example if I paste the JavaScript as follows:

<script type=”text/javascript” src=”https://calendar.ecu.edu/widget/view?schools=ecu&days=31&num=50&types=20000″></script>

I will want to edit out everything but the URL as shown below (including the quotes (“”) at the beginning and end): Your URL should look similar to this.

https://calendar.ecu.edu/widget/view?schools=ecu&days=31&num=50&types=20000

Now to add the JavaScript, go to the Common Spot page where you want your Calendar of events to reside and insert the “Include Javascript” element from the Custom Elements in the Element Gallery.

When you are back at the page where your element resides, click on the gear icon  so that the dropout menu appears. Choose “New Data” or “Data”. (If you want to edit the javascript that is already there, you will need to choose “Data” as the “New Data” link will generate another occurrence of the calendar.) In the dialog box that appears paste the URL that you created from your Widget JavaScript code into the text box nest to “External Source”. Leave the “Script Input” blank. See screenshot below. Click Save to close the dialog box and your calendar should appear on the web page.

EnterCustomElementData

 

 

 

 

 

 

Example of Calendar on a web page (image 1). The width of your calendar depends on the size of the container where you insert the javascript element. If you use a two or three column layout, the calendar of events will wrap to fit the width of the column where it is added. (image.2)

Image 1:

CalenderFullPage

 

 

 

 

 

Image 2:

CalendarColumnOnly

Enable Common Spot copy/paste in Google Chrome

Share

Chrome Users: if you want to use the copy/paste operation in Chrome to edit your commonspot pages, install the cs_paste_extension.

Go to the Google Chrome Store
https://chrome.google.com/webstore/category/home?hl=en-US&utm_source=chrome-ntp-launcher

Search for paperthin chrome extension

PaperThinStore

Install cs_paste_extension by Fred Kingsbury

AddCopyPasteExt

Click the menu button and choose Tools, Manage Extensions. Verify that the cs_paste_extension is Enabled.

VerifyExtension

Using Common Spot’s Redirect Feature

Share

A “redirect” is when a visitor is automatically forwarded from one page to another page. Common Spot provides a an easy way to setup a page to page redirect. You can use this feature if you have a page that is being replaced by a new page or may have been moved to another part of your website. Note that this is a page-to-page redirect and only affects this single page. (There are options available to redirect a site to another site, but you will need to fill out a Help Ticket and have the web team handle that for you.)
 
To do the page to page redirect in Common Spot, you must first make the original page expire. To do this login to that page and click on Properties Menu >> choose Standard Properties >> on the Main tab >> look for Expiration date. Set the Expiration date for the day you want your old page to begin redirecting to the new page.

Below the Expiration date, there’s an Action drop-down where you choose the Redirect Action. A text box will open for you to type in the URL of the new page or use the Choose option to find the new page. Click OK and that’s it. Do not delete the original page or this feature will no work!
 
Redirects are a very standard way to retire an outdated page but direct any visitors who may have it bookmarked to the updated page.

Recent changes in web browsers may affect how you use CommonSpot.

Share

Most browser companies are moving to prevent programmatic access to the system clipboard. That means that the buttons in the Rich Text Editor (RTE) for Cut, Copy and Paste are prevented from working in Chrome and Firefox. Using Ctrl+X, Ctrl+C and Ctrl+V still work.
IE 10 still allows programmatic access to the clipboard.

The PaperThin Chrome Extension (free in the Chrome store) uses a feature in Chrome to allow those buttons to work.

PaperThin is testing IE 10 on Windows 7 for any other issues that may have come out of the recent (Feb 27) automatic push of the IE 9 to IE 10 upgrade.

You can use Internet Explorer 10 with CommonSpot if you press F12 and choose IE 10 Compatibility Mode. In straight IE 10 mode, access to the CommonSpot Dashboard is met with an eternal spinning dialog. We are testing a fix for this issue. Stay tuned.

Microsoft released a tool to prevent the automatic push:

http://www.microsoft.com/en-us/download/details.aspx?id=36512

Firefox 10 ESR was also automatically upgraded to Firefox 17 ESR last week. So far there seems to be no issues with Firefox 17 except Cut/Copy/Paste operations in the RTE. We are currently testing a work-around for this issue.

Error:

Attempting to get into the Dashboard with IE 10 results in spinning cursor.

 Work-around:

Hit F12 and change to Browser Mode: IE 10 Compatibility View

 Error:

Cut, Copy and Paste does not work with Firefox 17 ESR

 Work-around:

Get the FireFox 10 ESR version

http://ftp.mozilla.org/pub/mozilla.org/firefox/releases/