v0.1.0 of The URL Params Plugin

Gruntfile.js

@@ -71,6 +71,13 @@ module.exports = function(grunt) {
                     pkg: grunt.file.readJSON('src/marketo-munchkin/version.json')
                 },
                 src: ['dist/plugins/marketo-munchkin/*.js']
+            },
+            "url-params": {
+                options: {
+                    prefix: '@version *',
+                    pkg: grunt.file.readJSON('src/url-params/version.json')
+                },
+                src: ['dist/plugins/url-params/*.js']
             }
         },
         watch: {
@@ -120,6 +127,15 @@ module.exports = function(grunt) {
                     out: './dist/plugins/highlander/main.js',
                     skipSemiColonInsertion: true
                 }
+            },
+            compile_url_params_plugin: {
+                options: {
+                    baseUrl: './src/url-params',
+                    include: ['url-params'],
+                    optimize: 'none',
+                    out: './dist/plugins/url-params/main.js',
+                    skipSemiColonInsertion: true
+                }
             }
         },
         md5: {
@@ -175,6 +191,13 @@ module.exports = function(grunt) {
                     verbose: true,
                     tag: 'marketo-munchkin-' + String(grunt.file.readJSON('src/marketo-munchkin/version.json').version)
                 }
+            },
+            tagUrlParams: {
+                options: {
+                    cwd: './',
+                    verbose: true,
+                    tag: 'url-params-' + String(grunt.file.readJSON('src/url-params/version.json').version)
+                }
             }
         },
         gitpush: {
@@ -237,7 +260,7 @@ module.exports = function(grunt) {
             branchFileModifier = '-' + grunt.option('branch').replace('/', '-');
         }
 
-        var plugins = ['eloqua', 'marketo-munchkin', 'soundjs', 'highlander'];
+        var plugins = ['eloqua', 'marketo-munchkin', 'soundjs', 'highlander', 'url-params'];
         _.each(plugins, function(type){
 
             var version = String(grunt.file.readJSON('src/' + type +'/version.json').version);

README.md

@@ -70,3 +70,23 @@ All lead associations will be based on the domain of the experience being viewed
 <script id="ceros-marketo-munchkin-plugin" src="//sdk.ceros.com/marketo-munchkin/main-v0.js" accountId="AAA-111-BBB"></script>
 ```
 2. Replace the value of the accountId attribute with your marketo munchkin Id
+
+## URL Params Plugin
+
+This plugin allows people using the Ceros Studio's SDK pallet to tag components to enable them to both control, and be controlled by, parameters in the Experience's URL. It can be used to show different layers, based on parameters in the URL, or even adjust the an Experience's control position.
+
+The plugin works by using the parameters in the URL to find hotspots with matching tags in the Experience and sending them click events to trigger any applied actions.
+
+### How to use this plugin:
+
+1. Paste the following code into the "Custom HTML" field of the Ceros experience inside Ceros Studio, or add it to the HTML page that you're embedding Ceros in.
+
+```
+<script id="ceros-url-params-plugin" src="//sdk.ceros.com/url-params/main-v0.js"></script>
+```
+
+2. Create a hot spot in the Studio that performs an action that you would like to trigger via a parameter in the URL.
+
+3. Use the SDK Inspector Pallet to tag the hot spot with a name and a value to be used as the URL parameter. For example if you wanted to show the second slide in a slide show, you could tag it `slide=2` - this would allow you to trigger this action by adding `#slide=2` to the end of the URL.
+
+4. If you would like to be able to update the URL based on user's actions in the Studio, tag components with `set-state` and set the payload to the name/value pair you would like to add to the URL. This will then be passed to other pages the user visits in your Experience. See [The Ceros Academy](https://www.ceros.com/academy/how-to/basic-concepts/#user-content-working-with-the-studio) for more information on working with tags and payloads.