jQuery Uniform - Mura Docs v6
Mura Digital Experience Platform
Mura Docs v6
Return to getmura.com

jQuery Uniform

The purpose of this exercise is to demonstrate just how easy it is to integrate third-party JavaScript and CSS into your Mura CMS theme.

From time to time you may need to implement a design with a very specific treatment for forms. An easy way to accomplish this is to use the jQuery Uniform plugin (http://www.uniformjs.com).

Since we've already told Mura that we're loading jQuery manually to make sure it is available at all times, all we need to is follow the instructions in the Uniform docs.

  1. Download and place the Uniform files in the theme-specific assets directory


     
  2. Add links to the Uniform Javascript, CSS, and Uniform function to html_head.cfm located at /{SiteID}/includes/themes/{ThemeName}/templates/inc/html_head.cfm before the closing </head> tag, add the following code:
<script src="#$.siteConfig('themeAssetPath')#/assets/uniform/jquery.uniform.min.js" type="text/javascript"></script>
<!--- valid themes: default, agent, aristo, jeans --->
<link rel="stylesheet" href="#$.siteConfig('themeAssetPath')#/assets/uniform/themes/agent/css/uniform.agent.min.css" type="text/css" media="screen" charset="utf-8" />
<script type="text/javascript">
jQuery(document).ready(function($){
$("input, textarea, select, button, a.button").uniform();
});
</script>
  1. Load a page with a Form (e.g., Contact) on it to see the results