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:
  • Click here to access the management of your product on the Infomaniak Manager (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click the Edit my site button to start the editor:
    

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 manage the logo, header, and footer (footer) section in Site Creator Infomaniak.

Prerequisites

• Access Site Creator:
  • Click here to access the management of your product on the Infomaniak Manager (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click the Edit my site button to start the editor:
    

Add a website logo

Once in Site Creator:

1. Click on the Settings button, then Logo in the left sidebar.‍‍
2. Upload an image and choose whether the site name should also be displayed next to it.
   ‍

Logo settings

1. Click on the Design button in the left sidebar.
2. Click on Menu Designer‍ then Title/logo to adjust spacing and colors.

Center the logo display

In the same place as above, activate the option to display the logo on a separate line, which will center the site's logo:

Hide the logo (+ header and footer)

To create a page without a logo that will have neither a header (so no menu displayed) nor a footer, you need to define it as a Homepage (that is, a "Landing page"; note that this does not change the order of the pages) using a button that is located here:

1. Click on the Settings button in the left sidebar.
2. Click on Page List.
3. Hover over a page in the existing tree and click on the gear icon that appears on hover.
4. ‍Enable the "Landing page" option at the bottom to hide headers and footers:
   

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:
  • Click here to access the management of your product on the Infomaniak Manager (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click the Edit my site button to start the editor:
    

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 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 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 explains how to customize the source code, modify the CSS, or change the HEAD or BODY section of a website created with Site Creator Infomaniak.

Prerequisites

• Access Site Creator:
  • Click here to access the management of your product on the Infomaniak Manager (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click on the Edit my site button to start the editor:
    

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:
  • Click here to access the management of your product on the Manager Infomaniak (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click the Edit my site button to start the editor:
    

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

Select the "Email address" type 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 the favicon in Site Creator

Prerequisites

• Access Site Creator:
  • Click here to access the management of your product on the Infomaniak Manager (need help?).
  • Click directly on the name assigned to the relevant Site Creator.
  • Click the Edit my site button to start the editor:
    

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 explains how to embed video/audio files imported into a VOD/AOD service on web pages.

Introduction

• This VOD / AOD integration code is unique and corresponds to the parameters you are currently specifying on the page.
• It allows you to embed the same video with different display configurations according to your needs.
• Later, you will be able to modify the parameters of this integration by adjusting them from the integration history page on the Infomaniak Manager.
• You can also share a media in various ways.

Generate and copy the integration code

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

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 product in question.
3. Click on Media in the left sidebar.
4. Click on Media Management in the left sidebar.
5. Click on the relevant media in the displayed table.
6. Click on the blue Integrate button.
7. Click on Create an integration:
   
8. Customize the media integration (timestamp, loop playback, autoplay, …).
9. Click the button to Generate the integration code:
   
10. Copy the code to integrate it at your desired location:
    

The media will be inserted with the default Player, but you have the option to choose from your created Players the one that should be offered during integration.

Modify a previous integration

To customize the integration of your media that has already been done, and in order to keep the corresponding code without having to insert it again:

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 product in question.
3. Click on Media in the left sidebar.
4. Click on Media Management in the left sidebar.
5. Click on the media in question in the table that appears.
6. Click on the blue Integrate button.
7. Click on Edit integration:
   
8. Click on the action menu ⋮ to the right of the relevant item in the displayed table.
9. Click on the desired element to obtain/modify the integration codes:
   

Paste the integration code…

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

... on Infomaniak Site Creator

• For Site Creator, you need to generate a “Fixed” integration code (not “Responsive”):
  
• Paste this code into Site Creator within a “Custom HTML Code” block.

• Here is an example of copy-pasting from a media integration page: