This guide for Site Creator Infomaniak covers the subject of browser cookies.

Introduction

• By default, when your website is new, no cookies should be stored on your visitors' devices, there is no tracking feature for advertisements or marketing.
• As a website administrator, some data is stored in your own cookies (such as information indicating that you are a website administrator).
• If you add applications/modules integrated into your website, cookies may be used; for example with the Poll Form: if you add a poll module to your website, it will use cookies when the website visitor votes (to remember that they have already voted).

Notification for the visitor

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Infomaniak Manager (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

You can activate a cookie consent message that will appear in a small pop-up window at the bottom of the screen for all new visitors to your site:

1. Click on the Settings button in the left sidebar.
2. Click on Contact details under Website configuration.
3. Enable the cookie information option to set up the brief message and the URL for additional information.
4. Set the display type to expanded or not (read below).
5. Save the changes at the bottom of the page:
   ‍

Additional settings

The consent message can be set to default or extended when you click on Display. The result obtained is as follows:

• by default:
  
• expanded:
  

This guide explains how to temporarily take offline a site created with Site Creator Infomaniak.

Preamble

• The maintenance page will only appear on visitors' devices:
  
• Your device will continue to display your site without the maintenance page, only for your internet connection.
• Being logged in, you will always be able to edit the site with Site Creator.

Put Site Creator into maintenance mode

To temporarily disable Site Creator:

1. Click here to access the management of your product on the Infomaniak Manager (need help?).
2. Click directly on the name assigned to the relevant product.
3. Click on Manage ‍ at the top of the page.
4. Click on Enable maintenance.
   • Perform the same operation to disable it:
     
   • You can also disable maintenance from the preview block of your site:
     

This guide details the use of media in Site Creator Infomaniak.

Note that it is also possible to insert other elements such as for example a formulaire d'inscription à la Newsletter Infomaniak.

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Infomaniak Manager (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

Add an image

Media are managed in the file library:

1. Add a new content block containing images that you can then replace or complete.
2. Click on the Content button in the left sidebar.
3. Click on Objects in the list to insert a single image.
4. Click on the IMAGE block on the right.

Once the image is added, you can also make it clickable or change its size:

You can also add images as a Photo Gallery module.

Change image

To replace an inserted image:

1. Click on an image to edit it.
2. Click on the button of type Photo Frame on the image thumbnail to be able to select a new image that will replace the previous one:
   

Add a video

To add a video:

1. Click on the Content button in the left sidebar.
2. Click on Objects in the list.
3. Click on the VIDEO block on the right to insert a full-width video.

You can also apply a link to an image using a YouTube video as the URL: this will automatically create a PLAY icon that, when clicked, will open the video in a lightbox window.

Add an audio file

To add an audio file:

1. Click on the Content button in the left sidebar.
2. Click on Applications at the bottom.
3. The **content** available displays on the right.
4. Click on the audio player to insert it into the page.

You can customize it in an advanced way via the HTML editing.

Add a file for download

To easily offer a file for download:

1. Click on the Content button in the left sidebar.
2. Click on Applications at the bottom.
3. The **content** available displays on the right.
4. Click on the File Download widget to insert it into the page.
5. Select the file from the library that your visitors will be able to download.

This guide details the behavior of Site Creator Infomaniak and the site created with it, facing different screen formats and resolutions.

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Infomaniak Manager (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

View the site on different devices

Sites created with Site Creator are automatically adapted to browsers regardless of their support (computer, mobile device, tablet, large and small screen, etc.). But they may react differently according to certain parameters that you can adjust. To preview the site version according to the reading support, click on the blue … button located at the very bottom of the left sidebar to expand the publishing and preview options:

Click on Preview then at the top of the page, click on the action menu to the right of Preview to change the reading device type.

Display your site in reduced width

You can reduce the width of your site. But this display within a "container" or "box" will only be visible on large screens like desktop computers:

1. Click on the Design button in the left sidebar.
2. Click on More settings:
   ‍
3. Save the changes at the bottom of the page.

Hide a content block based on the device type

In the options of a content block, you can set it to display only on certain types of devices (e.g., mobiles):

This guide explains how to customize the source code, modify the CSS, modify the HEAD or BODY section of a website created with Site Creator Infomaniak.

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Infomaniak Manager (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

Add custom code

Once in Site Creator:

1. Click on Design in the left sidebar.
2. Click on More settings.
3. Click on Custom Code at the bottom:
   
4. Enter HTML, JavaScript (with its scriptor custom CSS (with its tags style) - read below for a few examples.
5. Save the changes at the bottom of the page.

Metadata in HEAD & BODY

To add JavaScript code or any other code in the HEAD or BODY of your site's source code:

1. Click on Settings in the left sidebar.
2. Click on SEO & Metadata in the Website Configuration section.
3. Scroll down to Custom Code.
4. Choose to add under the tabs HEAD or under BODY.
5. Save the changes at the bottom of the page:
   

CSS customization examples

These examples allow you to start the advanced customization of the website pages. However, there is a risk that, depending on the changes made, you may no longer be able to access the editor itself, which will force you to start over from scratch.

Customize the website's background

To set your chosen image (to be uploaded to the file library) as the background and customize its display:

1. Go to point 3 visible on the first image at the top of this guide.
2. Insert the code <style> to indicate that you want to modify the CSS code,
3. then body { to indicate that you want to modify the body of the page and the "{" to open the space allowing to insert the commands,
4. then background-image: url("../data/files/fond01.jpg"); with the exact path & name of the image uploaded to the library, don't forget the semicolon to be able to insert the next command.
5. background-repeat: repeat; to repeat the inserted image.
6. background-attachment: fixed; so that the background image remains fixed even if the visitor scrolls the page up or down to read its content.
7. } to close the previously opened insertion space.
8. </style> to indicate that the code ends here.

Space out the letters of all the site's links

To space out the letters significantly in clickable words (links):

1. Go to point 3 visible on the first image at the top of this guide.
2. Insert the code (if not already present) <style> to indicate that you want to modify the CSS code,
3. then .container div a { to indicate that you want to modify the page blocks and more particularly the links ("a") and the "{" to open the space allowing to insert the commands,
4. then letter-spacing:1em; by decreasing the value (0.9em for example) without forgetting the semicolon to be able to insert the next command or finish.
5. } to close the previously opened insertion space.
6. </style> to indicate that the code ends here.

Take note of these other CSS code examples to insert on your site.

This guide explains how to connect a site created with Site Creator Infomaniak to a domain name present in your Manager.

Connect Site Creator to a domain name

To connect Site Creator to an existing domain name in your Infomaniak account:

1. Click here to access the management of your product on the Infomaniak Manager (need help?).
2. Click directly on the name assigned to the relevant product.
3. Click on Connect my site to a domain to start the configuration assistant below:
   

Manage the Site Creator domain(s)

To manage the domain name(s) used with Site Creator:

1. Click here to access the management of your product on the Infomaniak Manager (need help?).
2. Click directly on the name assigned to the relevant product.

At the top of the page, any messages regarding issues with Site Creator and domains are displayed.

Below, you can manage your domains if there are any:

Temporary address, preview URL

Several domain names can be linked to Site Creator, deleted or swapped and reversed if necessary:

However, the preview URL, of type abcd.infomaniak.site and distinct in the list of Site Creator domains, can never be deleted for the proper functioning of your site:

This guide helps you understand how to create and edit pages in Site Creator Infomaniak.

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Manager Infomaniak (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

Simple page editing

Editing a page happens in real-time and your changes are saved as you go while you edit the content of your blocks. You can undo your changes if necessary.

Create a link

Create a link from an image or text, directly by selecting the object.

Click next on the chain icon to open the section that will allow you to specify the link type and associated options:

Turn a link into a button

In your link settings, you can choose its style (rounded button, solid, etc.), the associated icon, etc.:

 

Edit a link

Edit a link by clicking on it:

Create a link to a file

To allow your visitors to download a file from a link on an object, choose the type "File" in your link settings:

Create a link to an email

Choose the type "Email address" in your link settings. Clicking on the link will open the visitor's default email application and start drafting an email with the pre-written email address.

To prevent the email address from being permanently displayed on your page, insert a contact form.

Create a link to a specific section

To direct the visitor to a specific section of your site or another, use the anchor system.

Create a link from an image

When you click on an image to edit it, simply activate the button "This is a link" below the image to specify the URL that will be displayed when a visitor clicks on it:

You can also apply a link to an image using a YouTube video as the URL: this will automatically create a PLAY icon that, when clicked, will open the video in a lightbox window.

Create a list, insert an emoticon...

The various text formatting options are located above the text selection, and additional options (bullet lists, alignment, emojis, etc.) are accessible with the arrow:

This guide is about setting up, in Site Creator Infomaniak, the icon displayed in a web browser's favorites bar, the favicon.

Preamble

• The formats recommended by Microsoft for its browsers are 16 x 16, 32 x 32 and 48 x 48.
• Apple, for its part, recommends that the favicon dimension be 180 x 180.

Set up the favicon in Site Creator

Prerequisites

• Access Site Creator:
  1. Click here to access the management of your product on the Infomaniak Manager (need help?).
  2. Click directly on the name assigned to the relevant product.
  3. Click on Customize my site:
     

To set a new favicon:

1. Click on the Settings button in the left sidebar.
2. Click on General Settings.
3. Scroll down to the Favicon section:
   
4. Select the favicon from your hard drive.
5. Save the changes at the bottom of the page.
6. Preview the result in your browser (if necessary in a new private browsing window, for example):
   

This guide details the limits of Site Creator Infomaniak.

Site Creator Limits

Content

• There is no limit to the number of pages or store articles that can be added with Site Creator.
• The total volume available to you depends on the size of the hosting where the site created with Site Creator is located; a standard Web Hosting plan comes with 250 GB of disk space.
• Also refer to this other guide.

FTP Management

• You cannot access your site's files on the server, neither by FTP nor by any other means than the manager provided by the Infomaniak Manager.

Website Export

• It is not possible to import or export the website (to another host or another hosting plan, for example).
• Themes or modules are not exportable.

This guide explains how to integrate imported video/audio files on web pages on a VOD/AOD service Infomaniak.

Preamble

• This VOD / AOD integration code is unique and corresponds to the settings you are specifying on the page.
• It allows you to integrate the same video with different display configurations according to your needs.
• Subsequently, you can change the settings of this integration by adjusting them from the Integration History page on the Infomaniak Manager.

Generate and copy the integration code

The integration code is on your VOD interface; here is an example with a Player default:

1. Click here in order to access the management of your product on the Manager Infomaniak (Need help?).
2. Click directly on the nameallocated to the product concerned.
3. Click on Media in the left side menu.
4. Click on Media management in the left side menu.
5. Click on the appropriate media in the table that appears.
6. Click the blue button Share.
7. Click on Create integration.
8. Customize media integration.
9. Click on the button for Generate the integration code.
10. Copy the code to include it in the location of your choice:

The media will in this case be inserted with the default Player but you have the option to choose among your created Players the one to be proposed at the time of integration.

Edit previous integration

To re-personalise the integration already made of your media, and with the aim of keeping the corresponding code without having to insert it again:

1. Click here in order to access the management of your product on the Manager Infomaniak (Need help?).
2. Click directly on the nameallocated to the product concerned.
3. Click on Media in the left side menu.
4. Click on Media management in the left side menu.
5. Click on the appropriate media in the table that appears.
6. Click the blue button Share.
7. Click on Edit Integration:
   
8. Click on the action menu ⋮ to the right of the object concerned in the array that appears.
9. Click on the desired item to get/change the integration/sharing codes:
   

Paste the integration code...

On the web page of your choice, paste the code at the desired location.

... on Site Creator Infomaniak

For Site Creator, it is necessary to generate an integration code --Fixed (and not --Reactive) :

Then paste this code into Site Creator within a custom HTML code block.

Here is an example of copy-paste from the media integration page: