In this article, you will learn:
How to create and configure a studio website
- Introduction
- Configure studio websites
- Basic settings
- Appearance
- Legal links
- Fonts
- Facebook Pixel ID
- Studio pages
- Facilities overview page
- Trial training page
- Memberships page
- Individual CSS
- Activate configuration
- Configure membership offers for the studio websites
Quick guide:
Configuring a studio website—this is how to do it:
- go to: settings / Magicline websites
- basic settings
- adjusting the parameters
Introduction
Previously only available as an individual solution, we have integrated studio websites as a new feature in Magicline. With the studio websites, you can create individual websites for membership contract conclusion and trial training bookings via Magicline with minimal effort. Various possibilities for individualization allow you to have the pages appear in the CI of your studio with just a few clicks. The studio websites are very user-friendly and can thus help to increase the number of new memberships.
Configure studio websites
At Settings / studio pages, you will find the menu items “Basic settings” and “Studio pages”. Since we will be offering other page types in addition to the studio pages in the future, such as “Landing pages”, you can define the visual appearance and other details once in the basic settings and then use this configuration for all page types. This way, you do not have to enter these settings again for each new page type.
Basic settings
First, create a configuration for the basic settings of your studio websites by clicking on “Create configuration” and then assigning a name for the configuration. On the details page, you can now make settings for the appearance, legal links, fonts and Facebook ID.
Appearance
Click on "Edit configuration" and first upload an image of your studio logo. We recommend a cropped logo with a transparent background, file format "PNG". We recommend a resolution of at least 400×400 pixels.
Next, you can choose between a light and a dark appearance. In the light look, the background is a light grey, the header and the content tiles with studio information or contract offers are white. In the dark look, these elements appear in black and dark shades of grey.
If you prefer rounded corners on the content tiles and buttons, check "Round off the corners of edges".
Finally, you can set the values for the primary color, secondary color and text color. For a consistent appearance, it is best to use the colors of your CI.
Legal links
Here you can create all necessary legal links such as imprint or data protection. Click on "Add new link”. Enter the title of the link as it should be displayed on the page, e.g., “Imprint”. You now have the choice of entering a free text or a URL. A URL makes sense if there is already a corresponding page, e.g., on your own studio website. Then you can enter exactly this link in Magicline. If you do not want to refer to an existing page, simply insert the content as text.
You can decide where the legal links should be displayed: in the header area or in the footer.
Fonts
In the font widget, you can choose from a variety of fonts for the primary and secondary font. In addition to the standard web fonts, we offer a selection of different, popular Google Fonts. To give you a direct impression of the selected fonts, we show a preview in each case.
Facebook Pixel ID
Enter your Facebook Pixel ID here if you want to send data from website visitors to Facebook to better target your advertising campaigns.
Studio pages
Now that you have configured your basic settings, you can start creating the studio web pages. To do this, select the menu item “Studio pages” and click on “Create configuration”. Now enter a name for your configuration. You will now see a preview of the directory path as well as a preview of the URL of your studio pages below it. In the next step, select the basic configuration you created earlier. Finally, you can decide whether you want to display the respective studio address on the studio pages. The address will then appear with a link to Google Maps in the same line as the legal links defined in the basic settings. Click on “Create” to create the configuration and access the detail page. Here you can now configure the pages in detail.
Facilities overview page
Click on “Edit configuration” via the three dot icon in the “Overview of facilities” widget and select a background image with another click on “Upload image”. The background image is displayed prominently in the upper area of the page and extends across the entire width of the browser window. It is therefore best to choose an image with a resolution of at least 1024 × 768 pixels. In the next step, you can upload a social sharing image. This is the preview image that is displayed on WhatsApp or Facebook, for example, when a user shares the URL. Next, you can assign a headline for your page. This will be displayed prominently on the previously uploaded background image. If you tick "Find studios nearby", you activate a function that, when clicked by the user, displays all studios in their geographical vicinity. Finally, you can decide whether a click on the studio logo should remain without action or link to a URL of your choice (e.g., the “Home” page of your own studio website).
After completing the configuration by clicking on “Save”, you must then activate the facilities overview page. To do this, click on “Activate” in the widget in the line with the red status symbol in the three-dot menu. The status display now changes to green. Directly below you will see the URL to the facilities overview page, to which you can link from your website, for example. Important: Before you can see your page behind the URL, you must also activate the entire configuration. More information on this can be found further down in the article under “Activate configuration”.
Trial training page
If you would like to offer the booking of trial trainings, you can configure the page as follows:
As with the facilities overview page, you can upload a background image and a social sharing image for the trial training page and assign a heading.
You can optionally display a "Book an appointment now for free" badge in the header to inform visitors to the page about the free trial training. The badge appears in the header. When clicked, the page scrolls down to the booking area.
Asking about the most essential fitness goal of your lead is also optional. If you activate this option, you can add as many entries as you like by clicking in the field and just typing the possible answers. Confirm your entry with “Enter”. You can delete entries you have already made by clicking on the “x”. Visitors to your website can then select their most essential fitness goal when booking a trial training session. After leads booked a trial training, you can then view what goals they chose in the Leads' area in the Quick View under “Info” as well as in the description of the detailed view of the appointment in the calendar.
Furthermore, you can offer a "Bring a friend" option. If this is selected when booking the trial training, you will also find the information (2 participants) in the Leads area and in the description of the appointment in the calendar.
For the trial training page, you can also define what a click on the logo should do: no action, forwarding to a URL or linking to the facilities overview page. The latter can make sense if you have several facilities and assume that the user reached the trial training page via the facilities overview page.
In the following, you define what should happen after a successful trial booking: You can show the visitor a success message in the form of a pop-up. For this, you can define a headline, a description text and a button text for the pop-up. In addition, you can optionally display a "Share on WhatsApp" link. As an alternative to the pop-up, you can redirect to a separate page by entering a URL.
Finally, save your configuration and activate the page via the three-dot menu.
Memberships page
If you want to offer memberships on the studio pages, you can also configure and customize the page for this purpose.
As with the other pages, you can upload a background image and a social sharing image for the memberships page and assign a heading.
You can optionally display a “Cheapest Membership” badge in the header. Then the price of the cheapest membership for the respective facility is automatically displayed there.
To attract visitors who may be hesitant to sign up for a membership, you can display a pop-up in the upper-right corner of the browser window and inform them about the possibility of booking a trial training. You can use an individual text for the headline, description text and button fields. A click on the button opens the trial training page.
Next, you determine which action is to be carried out when you click on the logo and what happens after the lead has signed up for the membership (identical to the trial training page).
Save your configuration and activate the page via the three-dot menu.
Individual CSS
If you want to make individual adjustments to the appearance via CSS, you can upload your own CSS file here.
Activate configuration
Once you have completed the configuration for all pages, click on “Manage activation” in the three-dot menu in the top-right corner of the detail page. Tick all the facilities that you want to include in your studio page configuration. Note: Only one configuration can be active for each facility. If you select studios here for which an alternative configuration is activated, the previous configuration will be deactivated for these studios and the new one activated.
Now click on the preview link in the facilities overview widget. Here you can see and test the pages you have configured. If you change settings in the Magicline, remember to reload open web pages to make the changes visible.
Configure membership offers for the studio pages
Which membership offers are displayed on the memberships' page depends on the settings under Settings / Membership signing / Offer configuration. You can add all the memberships that you want to be displayed on your studio page via the “Connect API” tab.
Important: The configuration of the membership offers always takes place at studio level! If, for example, you have created studio pages that contain several facilities, then you must create a separate offer configuration with membership offers for each of these facilities. In this way, you can bring together several studios on one overview page, but still enable individual contract offers for each individual studio.