Easy setup & access to CDN versioning.
To begin using Canon, start with this basic HTML template that includes everything we mentioned in the App Layout section.
<!DOCTYPE html>
<html>
<head>
<title>Canon Starter Template</title>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="https://eafdbc63c97ce6bec9ef-b0a668e5876bef6fe25684caf71db405.ssl.cf1.rackcdn.com/v1-latest/canon.min.css">
<script type="application/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script type="application/javascript" src="https://eafdbc63c97ce6bec9ef-b0a668e5876bef6fe25684caf71db405.ssl.cf1.rackcdn.com/v1-latest/canon.min.js"></script>
</head>
<body class="rs-responsive">
<div class="rs-wrapper">
<div class="rs-nav-utility">
<div class="rs-container">
<ul class="rs-nav rs-pull-right">
<li class="rs-nav-item"><a class="rs-nav-link" href="#">Account: Username123</a></li>
</ul>
</div>
</div>
<div class="rs-nav-primary">
<div class="rs-container">
<div class="rs-nav-brand">
<a href="index.html"></a>
</div>
<ul class="rs-nav">
<li><a href="#">Link One</a></li>
<li><a href="#">Link Two</a></li>
<li><a href="#">Link Three</a></li>
<li><a href="#">Link Four</a></li>
</ul>
</div>
</div>
<div class="rs-nav-secondary">
<div class="rs-container">
<ul class="rs-nav">
<li><a href="#">Subnav One</a></li>
<li><a href="#">Subnav Two</a></li>
<li><a href="#">Subnav Three</a></li>
</ul>
</div>
</div>
<div class="rs-body">
<div class="rs-container">
<div class="rs-main">
<div class="rs-content rs-panel">
<div class="rs-inner">
<h2 class="rs-page-title">Product Name</h2>
</div>
</div>
</div>
</div>
</div>
<div class="rs-push"></div>
</div>
<div class="rs-nav-footer">
<div class="rs-container">
<ul class="rs-nav">
<li class="rs-nav-item">© Rackspace, US</li>
<li class="rs-nav-item"><a class="rs-nav-link" href="http://www.rackspace.com/information/legal/websiteterms" target="blank">Website Terms</a>
<li class="rs-nav-item"><a class="rs-nav-link" href="http://www.rackspace.com/information/legal/privacystatement" target="blank">Privacy Policy</a>
</ul>
</div>
</div>
</body>
</html>
Or, find more detail on our demo site.
Most users will want to pull the latest Canon release directly off CDN:
By consuming Canon using these URLs, you will automatically receive bug fixes and other forward-compatible changes. We also provide the ability to link to a specific version from the CDN. See the versioning section for more information on our versioning strategy and links to additional downloads.
Canon uses Semantic Versioning. In a nutshell, changes are divided into three categories:
Canon distributes a build to CDN that includes all backwards compatible bug fixes and functionality for the latest major version. We strongly recommend that you consume Canon in this manner so that you will automatically receive critical bug fixes. If you would rather link to a specific version or serve Canon yourself, the table below provides links to all Canon versions.
See the changelog for more information about the changes contained in each release.