Web Services Blog

Create a Web form with Google Docs

Google users who have a valid Google account (can be a personal or a Clemson Google account) can create Google documents, spreadsheets and presentations similar to those created in Microsoft Office. Word and Excel files can be uploaded to Google Docs. Forms can be created from the Docs list or from any spreadsheet. Google provides several forms templates that can be used for easy form creation.

To access Google docs, launch your Web browser and point to http://docs.google.com. Log in with your Google userid and password. Help with Google docs, including Forms, can be found at http://docs.google.com/support.

Results from the form will be automatically entered into a Google Spreadsheet. Form results can be viewed in summary form or in the Google spreadsheet. Respondents will receive a confirmation message once they submit the form.

Create a new form from your Docs list:

Choose New > Form

Image

In the form template that opens, add your questions and options.

Image

Choose Save to save your form.
Choose Email this form.
Add email addresses for your desired recipients.
Choose Send.

Create a new form from a spreadsheet:

Open the spreadsheet that you wish to convert to a form.
Choose Form > Create a form.

Image

Edit and/or add questions, choosing your preferred question type.
Choose Save to save your form.
Choose Email this form.
Add email addresses of your desired recipients.
Choose Send.

Email form from the spreadsheet view:

Open the spreadsheet that you have already converted to a form.
Choose Form > Send Form.
Add email addresses of your desired recipients.
Choose Send.

Image

Edit an existing form:

To edit a question, choose the Edit button on the right of the question to be edited.
To delete a question choose the Delete button on the right of the question to be deleted.
To duplicate a question choose the Duplicate button to the right of the question to be duplicated.

Image

Create multiple-choice questions:

Choose the Add Question button at the top of the editor.
Enter the question into the Question Title box.
Enter additional information in the Help Text box.
Select the Multiple Choice option in the Question Type drop down menu.

Image

Enter one answer choice in each box, creating additional boxes as needed.
Choose the add “Other” link to add an empty box that respondents can use to add their own answers.
Check the Make this a required question box if you want to require that the respondent choose and answer before the form can be submitted.

Edit the confirmation message:

Choose More Actions > Edit confirmation.
Edit the text in the confirmation message.
Choose Save.

Image

Embed your form in a Web page:

Create your form and save it.
Choose More Actions > Embed.
Copy the URL from the Embed window and paste it into your Web page.

Image

Spreadsheet tips:

Insert columns to contain your own content next to form responses, such as for calculations, notes, or lookups.
Insert rows of information at the top – below the column headers (questions) and ABOVE the area where data is collected. The form responses will always be inserted in the first available/blank row.
Insert new sheets or move sheets. Responses will continue to be automatically entered in the same sheet.

To see the results of a form, open the original spreadsheet. It’s a good idea to use the same name for the form as your spreadsheet, so it’s easier to find.

Remember, the spreadsheet row, cell and column limits apply to the spreadsheets attached to your forms too.

Enable your pdf form to be edited with Adobe Reader

Create your pdf form in Acrobat Professional 8 or higher. Acrobat Professional 8 is the first version that provides a feature for pdf form fields to be filled in and saved using Adobe Reader.

A pdf form is simply a pdf file that contains form fields. In Acrobat Professional Version 8 or higher, you can create a pdf form from a blank page, an existing pdf file or a scanned document.

Ordinarily, Adobe Reader users can’t save filled-in copies of forms that they complete. You can now extend rights to Adobe Reader users so they have the ability to fill in and save pdf forms. These extended rights also include the ability to add comments, use the Typewriter tool, and digitally sign the pdf.

Create a new form in Acrobat Pro:

From a blank page:
1. File > Create PDF > From Blank Page.
2. Add text and form fields to manually build the pdf form.
3. Save the pdf form.
4. Choose Advanced > Enable Usage Rights in Adobe Reader to allow Adobe Reader users to fill in the form and save it.

From an existing pdf:
1. Forms > Create New Form.
2. Choose Start with a PDF document to initiate the New Form Assistant.
3. Choose Continue.
4. Browse for and then select the pdf that you want to turn into a form.
5. Choose Open.
6. Choose Next.
7. The New Form Assistant imports your pdf and prepares it for entering form fields. Choose Next.
8. Choose Run Auto Field Detection if available, to allow the New Form Assistant to scan your pdf and automatically create form fields.
9. Choose Place Fields by Hand if you prefer to create your form fields manually.
10. Choose Next.
11. Add form fields to your pdf file.
12. Save the pdf form.
13. Choose Advanced > Enable Usage Rights in Adobe Reader to allow Adobe Reader users to fill in the form and save it.

The enabled usage rights are applied only to the current pdf form. You must enable the usage rights each time you create a form and wish to enable Adobe Reader users to save their own filled-in copies of that pdf form.

Once your form is completed you can create a link to it on your Web site, or email it as an attachment. The form can be downloaded and filled in using Adobe Reader and saved with all the information.

Home page feature – rotate image on refresh script

This is how to add rotating images to the feature area on your home page.

Create a new text file and copy the content in red below into it. Save the file as rotateImageOnRefresh.js and upload it to Cascade. Place it in the same folder as your index page.

<!-- SET THE MAX FEATURE COUNT (Total -1) -->
var maxFeatureNo = 4  <!-- 5 total - 1 = 4 -->

var featureNo
var myFeature = new Array()
<!-- CHANGE img src= to the file path of your image --!>
<!-- MAKE SURE YOU HAVE ONE FOR EACH FEATURE IMAGE -->
myFeature[0] = '<img src="images/features/01.jpg" width="688" alt="Put your ALT tag here" border="0">'

myFeature[1] = '<img src="images/features/02.jpg" width="688" alt="Put your ALT tag here" border="0">'

myFeature[2] = '<img src="images/features/03.jpg" width="688" alt="Put your ALT tag here" border="0">'

myFeature[3] = '<img src="images/features/04.jpg" width="688" alt="Put your ALT tag here" border="0">'

myFeature[4] = '<img src="images/features/05.jpg" width="688" alt="Put your ALT tag here" border="0">'

<!-- DONT TOUCH --> featureNo = Math.round(Math.random() * maxFeatureNo) document.write(myFeature[featureNo])

<!-- IF NOTHING DISPLAYS ON THE PAGE THEN SOMETHING IS WRONG -->

Edit your index page. Copy the following content in red where you want your images to be displayed.

<script src="pathToFile/rotateImageOnRefresh.js"></script>

Submit your index page. Publish the rotateImageOnRefresh.js file, your index page and all the images that will rotate when the page is refreshed.

Cascade Minimum Requirements (Supported Browsers)

From the Hannonhill Web site:
http://www.hannonhill.com/products/requirements.htmlWeb Browser:

  • Web Browser:
    • Google Chrome 50+
    • Firefox 45+
    • Apple Safari 8+ for OS X
    • Microsoft Internet Explorer 11 / Edge
    • Mobile Safari on iOS 7+
  • Screen resolutions of 1280×1024 or higher for full desktop resolution. Tablet and mobile resolutions are also supported.
  • Network connection

Create a link to an email address (mailto: link)

The WYSIWYG editor does not have a built-in mailto: option but you can still easily create a link to an email address.

  1. Highlight what you want to become a link (preferably the person’s name or their full e-mail address spelled out).
  2. Choose the Insert/Edit link button from the WYSIWYG toolbar.
  3. Choose the External Link tab.
  4. In the Link field enter mailto: followed by the e-mail address (mailto:web_services-l@clemson.edu).
  5. Add a title to describe the link (Email Web Services).
  6. Choose the Insert button.
  7. Choose Submit.

Insert and upload at the same time

You can upload a file into Cascade as you are inserting it into your page. (Be sure the appropriate extension is part of the file name: pdf, .jpg or .doc.)

Insert an image:

  1. Click inside the content region where the image will be placed. For example, if you would like the image to be in line with the top of the text, you will place your cursor before the first sentence.
  2. Choose the “Insert/Edit Image” icon  from the WYSIWYG editor.
  3. Click the file chooser icon.
  4. Select the folder where the image will be saved (such as the image folder). The Upload option is now available from the Browse menu in the upper left corner.
  5. Click Upload.
  6. Select the image to be uploaded and choose Open.
  7. The Select File box in Cascade will contain the path of the file you have chosen to upload.
  8. Choose the Upload button.
  9. Choose the Confirm button and confirm that the file has been uploaded to Cascade.

Inserting a link:

  1. Select the text or image to link from
  2. Choose the “Insert/Edit link” icon  from the WYSIWYG editor.
  3. Click the page chooser icon.
  4. Select the folder where the file will be saved (such as the documents folder). The Upload option is now available from the Browse menu in the upper left corner.
  5. Click Upload.
  6. Select the file to be uploaded and choose Open.
  7. The Select File box in Cascade will contain the path of the file you have chosen to upload.
  8. Choose the Upload button.
  9. Choose the Confirm button and confirm that the file has been uploaded to Cascade.

What are the display name, title, keyword and description?

Display name
This is the information used as a breadcrumb trail and in the left navigation. When adding the Display Name, consider how the name will affect the breadcrumb trail and navigation performance. A very long display name will cause text to wrap to multiple lines in the left navigation.

Title
This is the name that appears as the headline in your page and at the top of the Web browser window when viewing the published page. This is also the name that is recorded when someone bookmarks your page. The title plays an important role in Search Engine Optimization (SEO). The title should describe what your page is about, in just a few words. Spaces and upper case are acceptable. Avoid generic page titles such as “Welcome.”

Keyword
Keywords are also used by search engines to return accurate search request results.

Description
Descriptions are snippets of text, displayed below the links on search results pages, that provide details about the results.

Align text around an image

Images can be placed either before or after your text has been added.

  1. Click inside the content region where the image will be placed. For example, if you would like the image to be in line with the top of the text, you will place your cursor before the first sentence.
  2. Choose the “Insert/Edit Image” icon  from the WYSIWYG editor.
  3. Choose the internal tab to insert an image from Cascade. You can also upload images to Cascade during the insert image process.
  4. Select the file icon to browse to the image folder.
  5. Select the image  and choose confirm.
  6. Add the alternate text for the image including “Clemson University, Clemson, SC” at the end of each entry.
  7. Do not enter anything in the width/height boxes since your image should already be sized correctly.
  8. Choose insert.

The image alignment styles are available from the WYSIWYG editor’s Styles drop down menu.

  1. Select the image you have placed on your page.
  2. Select the Styles drop down menu from they WYSIWYG editor’s top row.
  3. Select the left or right style.
  4. Submit the page.

The left and right styles automatically add the correct amount of vertical and horizontal spacing around the image so you don’t have to do anything extra to add that. The left and right styles do not however, add a border around the image. To add a border around your image you must edit the html.

  1. Take your page into edit mode
  2. Select the html button from the WYSIWYG toolbar to bring up the html editor
  3. Find the paragraph tag in front of the image tag – it should look like this: <p><img
  4. Edit the paragraph tag and insert the border information – it should look like this: <p><img
  5. Select the Update button to update the html
  6. Submit the page

 

Change page type

Page assets are associated with a set of configurations for each page type. The configuration set for the left navigation page type is different from the configuration set for the full page. To change the page type, the configuration set must be changed. Not all users in Cascade have a role that will allow them to change the configuration set of a page asset.

Contributors and Publishers:
Content managers who are in the Contributor or Publisher role do not have access to change the configuration set for the page assets they are building.

  • Copy the content from the current pageCreate a new page asset for the page type you desire
  • Paste the copied text into the content region of the new page asset
  • Enter the Display Name and Title
  • Enter a System Name
  • Submit
  • Delete the page asset you no longer need

Your site manager and the Office of Web Services can change the configuration set for you.

Managers:

  • Choose Edit and select the System tab
  • Choose the Configuration Set link
  • Navigate to the configuration set you are changing to and select it
  • Confirm that you have chosen the correct configuration set
  • Submit