Embedding Instructions

From Career Pathways Tutorial

Contents 1 Introduction 2 Embedding Published Drawings 3 Embedding an Unpublished Version 4 ADA Compliance

Introduction

The purpose of this document is to provide some examples of embedding Career Pathways drawings into existing web sites. Several examples are provided to illustrate the different possibilities for integrating these drawings.

Embedding Published Drawings

You can embed a drawing by inserting an <iframe> tag into your website. You can customize the height and width of the iframe in your document, as well as the frameborder and whether or not you want scroll bars by changing the values highlighted in red below.

<iframe width="800" height="600" src="http://oregon.ctepathways.org/c/published/cocc_emt_basic" frameborder="0" scrolling="no"></iframe>

You can find the URL for this drawing on the Drawing Info page. It will always look like this: http://oregon.ctepathways.org/c/published/drawing_code

This is the best method of embedding a drawing. When a new version of this drawing is published, this link will link to the new version. This link will always link to the published version of the drawing specified by the drawing code, in this case, cocc_emt_basic.

Note: If you ever change the name of the drawing, the drawing code will change as well, breaking any links on external sites to this drawing. For this reason, it is a good idea never to change the names of drawings once they are used in external sites.

Embedding an Unpublished Version

If you wish, you can also embed an unpublished version of a drawing. In this case, you provide the version number in addition to the drawing code. You can find the full URL to include on the Version Info page.

<iframe width="800" height="600" src="http://oregon.ctepathways.org/c/version/cocc_emt_basic/3.html" frameborder="0" scrolling="no"></iframe>

When embedding a drawing this way, you will ALWAYS be linking to this specific version. If a new version is created and published, this content will not be modified. This has the disadvantage of not automatically updating when a new version is created. This method is not recommended except for special cases.

ADA Compliance

A URL to an "accessible" (text-only) version of your drawing is available in the drawing's information page, accessed by clicking the drawing title from the drawing menu.

<a href="http://oregon.ctepathways.org/c/text/cocc_emt_basic.html">Accessible version</a>

The Accessible URL will always link to the published version of that drawing. Include a link to this URL on your web page where you have embedded the full drawing so that visitors can access a version of your drawing that will be compatible with screen readers.