How to set up Spektrix Link

Rachael Norris
Rachael Norris
  • Updated

Once you have registered for Spektrix Link, you’ll need to complete the following steps to initially get up and running with your new site.

TIP: If you’re completely new to Spektrix Link, take a look at our article What is Spektrix Link? to learn more.

 

Getting started

In this article, we’ll walk you through how to:

TIP: Make sure you follow all of the steps outlined in this article to complete the set-up of your Spektrix Link website.

 

Subdomains

The first step that must be completed before we can create your Spektrix Link is setting up two subdomains.

  1. The first subdomain will be your Spektrix Custom Domain that will host the Spektrix iframes. This won’t be visible to your customers. 

    For step by step instructions on how to set this up, take a look at our article Custom Domains.

    REMINDER: If you already have embedded Spektrix iframes on your existing website but are moving to Spektrix Link, you won't need to do this step as you should already have a custom domain in place.

  2. The second subdomain will be visible to your customers in the address bar that hosts your Spektrix Link pages and should be something like purchase.mywebsite.com or booking.mywebsite.com. Your selected subdomain must be different to the one you set up in the first step.

    You’ll need to ask whoever manages this subdomain to set up a CNAME record to app.spektrix-link.com.

Domain Specific Config

You’ll need to complete the Domain Specific Config set up for your new domain to be linked.

Domain Specific Config can be found in the Website Admin Interface and is where you can apply settings which relate to your website integration.

Follow the steps under the Domain Specific Config section in the Website Admin Interface article.

 

How to Log into the Spektrix Link Configuration Console

Once your subdomains are set up, a Spektrix team member will need to add your organisation and user profile to Spektrix Link.

After this, you’ll receive an account activation email. Follow the instructions in the activation email to set up your account. 

REMINDER: The activation email will expire after 24 hours. If you need a new activation email, contact Support.

Once your account has been activated, follow these steps below to log in:

  • Log into Spektrix Link with the information you entered during account activation.

Next, you can set up other members of your team who you’d like to grant access to Spektrix Link. 

 

User Access

Once you are logged in to Spektrix Link you’ll see two sections: Users and Websites.

The Users page will show all of the registered users on your account and their:

  • Full name: the User’s full name as entered when invited to join.
  • Email: the User’s email address.
  • Status: whether the User is invited or accepted.
  • Actions: here you can edit the full name, email address or delete Users from the the Configuration Console.

 

How to set up new Users

To add additional Users from your organisation to Spektrix Link follow these steps.

REMINDER: You’ll need to be the Administrator of your Spektrix Link account to add or edit users.

  • From the Configuration Console, navigate to Users from the menu on the left. Here you’ll see a list of all the Users and their status.

  • Click Add User.

  • Enter their full name and email address.


2.png

  • Once you have completed these details, that User will receive an activation email. To register, the User must complete the steps in the activation email.

REMINDER: If the User does not receive an activation email, please double check that the details you have entered are correct.

Your new User will have the status of Invited until they accept the invitation and have signed into Spektrix Link for their system. Their status will then change to Accepted.




Your Spektrix Link Website settings

The Websites tab is where you’ll find the details about your Spektrix Link site.

This page will show:

  • Website Name: the name of your website. If you have multiple websites they will be listed here.
  • Domain: the subdomain you created for your Spektrix Link site.
  • Status: whether your website is Active or Pending Validation.
  • Actions: select from actions including edit, style and settings and delete.

The Edit option is where you can edit the website name. Click Save to update this information.

The Delete option will remove your website and all the set up configuration in Spektrix Link. You’ll be asked to enter the website domain to confirm you want to delete it. 

To make changes to the look and feel of your Spektrix Link website and configure settings related to how information is displayed, continue to the next section. 

 

Style and Settings

To edit the Style and Settings of your website, select the cog icon alongside the website you wish to edit.

You can toggle between the Style and Settings menu using the buttons below your URL.

styles and settings.png

 

Synchronize Inventory

Under the websites menu, you’ll also see an option to Synchronize Inventory and information about when the inventory was last synced. 

By default, this runs every 15 minutes. You can click the refresh icon to update this manually if you have made any changes to styling or settings that you want to see immediately. 

 

Cancel / Save

At the bottom of this section, you will see a Cancel and a Save button. Make sure that you select Save after making any changes that you wish to keep. Changes will only apply once you have clicked Save, and after the system is synchronized. You can select Cancel at any time to abandon any changes you have made.

 

Preview

In the pane on the right side of the screen you’ll see a preview

In the preview pane, you’ll be able to view any visual changes you make. These changes will only apply once you have saved your changes and after the system is synchronized.

 

Website Styles

Under the Styles tab, there are a number of ways in which you can configure the visual display of your Spektrix Link site.

There are some ready made Themes which are shown in the preview screen on the right.

You also have the option to design a custom theme yourself. You can do this by updating the settings for the colours, logo and font styles manually. Using a custom theme means you can more closely match your Spektrix Link site to your existing website.

Next, we’ll go through each of the sections where you can edit the settings to create your custom theme.

This includes:

Once you are happy with the settings you’ve applied in your custom theme, you’ll be able to view any changes in the preview. These changes will only apply once you have saved your changes and then after the system is synchronized

 

Page Colours

In the page colour section, enter the HEX codes of the colours you’d like to use on your website. 

 

 

You can apply:

  1. Nav Background: The background of the top navigation bar
  2. Menu Background: The background of the bar for menu items underneath the navigation bar
  3. Page Background: The background colour of the web page.

 

REMINDER: You’ll be able to view any changes in the preview but these changes will only apply once you have saved your changes and after the system is synchronized.

 

Upload Logo

Here you can upload your organisation’s logo to the website. You can drag and drop your logo file or click upload image and choose your image from the file explorer.

Your logo will need to meet the following requirements:

  • Recommended image size 180 x 180px
  • Maximum file size 1MB
  • Supported image files: .svg, .PNG
  • Have a transparent background or a background colour which matches the Nav Background colour you have chosen.

REMINDER: You’ll be able to view any changes in the preview but these changes will only apply once you have saved your changes and then the next time the system is synchronized.

 

Font Styles

You can update font type, size and colour for the text that appears on your Spektrix Link website.

You can choose a different style for each of the pieces of text that appear on your site: Header, Body, Body Link and Menu Link.

  • From the drop down menu you can choose the font from the list of available fonts from the Google font library.
  • Enter the size of the text in the size box.
  • Enter the Hex code of the colour you’d like in the colour box.

Font styles icons.png

  1. Header: the header title of each page
  2. Body: the body text which shows event details on the Instance details page
  3. Body Link: the text in the footer which contains links such as your Terms and Conditions or Privacy Policy
  4. Menu Link: the menu items under the navigation bar
  5. Top Bar: the icons in the top left

preview text size.png

REMINDER: You’ll be able to view any changes in the preview but these changes will only apply once you have saved your changes and after the system is synchronized.

 

Button Styles

You can update button styles for the buttons that appear on your Spektrix Link website.

  • From the Button Style drop down menu you can choose from:  Contained, Outlined, Text.

Here’s how these buttons would display.

  • preview contained button.png

  • button outlined.png

  • button text.png

  • From the Size drop down menu you can choose from: Small, Medium or Large.

  • You can choose to change the text colour by entering the Hex code of the colour you want.

TIP: Make sure there is enough contrast between the Text Colour and Background Colour for your button to be read accessibly.

  • You can choose to change the background colour by entering the Hex code of the colour you want. 

REMINDER: You’ll be able to view any changes in the preview but these changes will only apply once you have saved your changes and then the next time the system is synchronized.

 

Download CSS

Within the Style and Settings page, you will also see an option in the top right to Download CSS:

After you have applied all of the styling to your Spektrix Link site, selecting this button will create a CSS version of the styling options you have applied. 

You then need to take this CSS file and upload it into your Spektrix system to apply this styling to your iframes.

To upload your CSS file, follow the steps outlined in the Website Admin Interface article.

 

Website Settings

Under the Settings tab, there are a number of ways in which you can configure the settings for your Spektrix Link website.

This includes:

Changes you make will only apply once you have saved your changes and the system is synchronized

 

Google Tag Manager ID

Add your Google Tag manager ID to be able to collect data about your Spektrix Link website. 

Once that is done, follow the instructions to add your Google Tag Manager container to the Spektrix Purchase Path and configure your Tags and Triggers.

This should be the same Tag you are using on your existing website.

 

Read more about Website Tracking and Spektrix.

 

Limited availability threshold

You can specify a percent in the Limited availability threshold. This will change the Book Now button to say Limited Availability when that threshold is reached. 

For example, if you set the limit at 10%, when 90% of the available tickets are sold the Book Now button will show Limited Availability instead. 

Tickets iframe domain

Under the Tickets iFrame Domain, you should see the URL of the first sub domain you created. This is the sub domain that the iframes use, and is not visible to your customers. This is added by the Spektrix team during set up.

 

Available Language

Under Available Languages there is a drop down selection box for available languages.

If you have more than one language selected the navigation bar in the website will show a globe icon and culture code with a drop down arrow to let users switch between languages. The languages will appear in the order they are selected. 

Website Navigation Bar

Each website has a navigation bar that contains: 

  1. Cart/Basket: this lets the customer see a summary of their Cart/Basket contents. When the customer clicks on this, it will take them to the Cart/Basket page.
  2. Log in status: this lets the customer see whether they are logged in or not.  When the customer clicks on this, it will take them to the Login or Logout page.
  3. The logo: clicking this will take the customer back to the website homepage. 
  4. Language icon: this will only show when there are multiple languages and lets the user switch between languages. 

You can also add some other optional items to the navigation by setting this under the Navigation Menu section.

TIP: We recommend adding a link to your primary website on the Navigation Menu so that your customers can go back to it.

 

To add a new menu item, click the + Add new menu button at the bottom left of the table

  • Type: from the Type column you can choose Custom or one of the iframes. 

You might use Custom for a What’s On link which takes the customer to the Event listings on your existing website, or any other URL which you’d like to link out to.

Choosing one of the iframes, (Fixed Series, Donations, Memberships, Merchandise, Gift Vouchers), will take the customer to a page on your Spektrix Link site which will display the selected iframe.

  • Label:  you can choose the name of the item in the menu.. For example, you may wish to decide to rename ‘Merchandise’ to say ‘Shop/Store’.
  • Query / Parameter / URL: you can enter the URL you want this menu item to link to. You can leave this blank if you choose an iframe.

TIP: You also have the optional ability to add a query string onto the end of the Page URL to filter an iframe.  For example, adding the query parameter ?Attribute_Type=Friend to the end of the Memberships URL could be used to filter only to Memberships that have an Attribute of “Friend”.   To learn more, take a look at Filtering iframes on the Support Centre or, for web Developers how to filter iframes by Attributes on the Integrate Portal.

 

You can also delete menu items using the trash icon.

To rearrange the order of the menu items, click and drag using the six dots icon.

 

Footer Menu

You may wish to add your Privacy Policy, Terms and Conditions or any other links into the footer of this site. 

footer menu Preview.png

 

To add a new menu item, click the button at the bottom left of the table which says + Add new menu:

You’ll need to add the following:

  • Label: enter the name of the item in the menu. 
  • Query / Parameter / URL: enter the URL you want to link to.

footer menu.png

You can also delete menu items using the trash icon. 

To rearrange the order of the menu items, click and drag using the six dots icon

Further Reading

Once you have completed the set up steps for Spektrix Link, read the next article, Configuring Spektrix Link, to start adding Events to your site.