Creating your first modification
Navigate to "Modifications", and click "New Modification".
You can then select which type of modification - at this stage we've limited you to the following:
- Title Tags are the most basic, but best to get you used to Spark - it's as simple as it sounds, Spark replaces the existing title (or adds one, if there is none).
- Meta Descriptions are as per titles, except for the meta description. Great if you want to bulk add descriptions where there are none (i.e. create a template and then use variables - more below).
- HTML Injection - The most complex of the starting modifications - but the most powerful. As the name suggests this enables you to inject custom HTML onto any page.
To keep things simple, we'll select the Title modification for now.
Firstly, name your change (something that you & others will recognise is ideal!), and then you can choose which pages this modification will be applied to. You can either use the page URI (the URL minus the hostname) or regex (Regular Expressions) if you want to select multiple pages.
In this test we've used ".*" which essentially means "match everything" in regex. If you're unsure about how to use Regex, you can read more here. If you're more familiar but want a way to test first, then Regex Pal can be very helpful.
Finally, we can select whether we want to apply this to 100% of the pages OR run a test - a 50/50 split test. Spark's A/B testing is still in the early phases, so in this instance, we will select 100% of pages within the page group - which in this case means the whole site.
NOTE: In the first screenshot you can see the title "This is my new title | Page Title".
DO NOT DEPLOY THIS TITLE TO THE .* PAGE GROUP - IT WILL REPLACE EVERY TITLE ON YOUR SITE WITH THIS ONE IF DEPLOYED.
When modifications are first created, they are put into "draft" mode. This means that they will not be deployed onto the site, even if other changes are.
If you want to deploy your title, change it to live (again, make sure you know a) what the test will do, and b) you want it live before changing this).
We are working on a more effective way to preview tests before deploying, but for the moment you need to ensure all modifications are tested thoroughly after deployment. We cannot take responsibility if there are any tests you have created which negatively impact your website.
If you are unsure, please get in touch before deployment, we'll help you out.
The deployment process
We created Spark's deployment process to ensure that no changes are launched to a live website without your intention AND that each deployment is documented - so anyone using it can see what is going on.
Once you've set up a modification, click back to "Overview". There you'll see how many unpublished changes (new modifications, or changes to existing ones) there are - along with the option to deploy them.
Below this notification, you'll also see a history of all the previous deployments.
Once you click deploy, you'll see this pop-up outlining what is to be deployed. This will develop as we iterate the process, but currently, you can see each of the modifications & the page group this will apply to.
This is your last chance to ensure these are correct before they are applied to the live site - check it again, be totally sure it does what you want it to.
Once this has been deployed you will see it detailed on the overview.
Variables are a powerful way of ensuring you can make meaningful modifications across large page groups - they also save time creating individual changes in a number of circumstances. If you are used to Google Tag Manager, you will be familiar with variables & what they do.
- Shortcode = the tag you use to include it in a modification.
- Name = a name for you to identify it with.
- Extraction Element = the element which contains the value you want to extract.
- Extraction Regex = a regex used to extract specific text from the extraction element.
This is a more advanced feature, but here's an example:
If we wanted to extract a specific detail (in this instance a location from a directory / listing site) which is already present in a h1 tag as follows;
<h1 class="title">Salons in Essex</h1>
We would create a variable as per the following;
The variable "location" for this particular page would return "Essex". To understand how/why this would be useful, we can use this variable to help us populate new meta descriptions for a specific page group which contains the above variable.
The meta description itself is just to illustrate how it is used, but it gives us a way to ensure that each description is relevant to the page itself using information which is extracted from that page.