freelight'

chargement…

Design Section Editor

Tu peux adapter et modifier le design de chaque section pour trouver celui qui te convient le mieux. Dans ce tutoriel, nous allons passer en revue chaque option de modification afin de t'expliquer comment les utiliser.

N'hésite pas à explorer toutes les possibilités et à essayer différentes combinaisons pour trouver le design idéal. Tu pourras prévisualiser les modifications en temps réel et les ajuster selon tes préférences.

Nous sommes là pour t'accompagner tout au long du processus et répondre à toutes tes questions.

Alors lance-toi et laisse libre cours à ta créativité pour créer un design unique et professionnel qui reflète parfaitement ton style et tes aspirations.

Couleur du titre et du texte

Pour modifier le design d'une section, il te suffit de cliquer sur l'icône "Design de la Section".
Tu peux personnaliser chaque section indépendamment des couleurs par défaut du site.


"Title Color" (Couleur des titres)

  • modifie la couleur des titres** de ta section.

**les titres se réfèrent aux titres h2, sous-titres et descriptions disponibles pour chaque élément de ton site (encadrés en rouge ici).


"Text Color" (Couleur du texte)

  • modifie la couleur du texte de tous les modules contenus dans ta section.

Ici, encadrée en rouge, tu trouveras la description d'un module de type "multi" qui sera impactée par la modification de cette option.

Il est important de noter que l'interface d'administration du design peut varier en fonction du type de section que tu édites.

Background / arrière-plan

Tu as le choix entre une couleur de fond, une image ou une vidéo.


"Background image"

repeat et no-repeat permettent de définir si l'image de fond doit être répétée ou non. Cela s'applique uniquement lorsque l'image ne couvre pas entièrement la section.

free et fixed définissent si l'image de fond doit défiler librement avec le mouvement naturel du défilement (scroll) ou si elle doit rester fixe.

center center positionne par défaut l'image au centre en hauteur et en largeur. Avec ce paramètre, tu peux modifier sa position selon tes préférences.

Search for a picture (Rechercher une image), te permet de rechercher l'image dans ta base de données freelight'


Conseils : préfère une image de 1920 pixels de large, et pense aussi à bien nommer, compresser et convertir ton image !

"Background vidéo"

Search for a picture (Rechercher une image), te permet de définir l'image à afficher pendant le chargement de la vidéo.

Search for a video MP4 (Rechercher une vidéo au format MP4), te permet de définir la vidéo au format MP4.

Search for a video WEBM (Rechercher une vidéo au format WEBM), te permet de rechercher et sélectionner une vidéo au format WEBM à utiliser.

Conseil : Il est essentiel de prendre en compte que l'utilisation de vidéos en fond de section peut considérablement augmenter le temps de chargement de la page. Il est donc préférable d'opter pour une vidéo courte et aussi légère que possible en termes de taille de fichier.


**Si tu ne possèdes pas les deux formats (MP4 & WEBM) de la vidéo, tu peux renseigner deux fois la même vidéo. Cependant, il est important de noter que les deux formats sont souhaités, car l'ordinateur ou le téléphone choisira le format le plus approprié en fonction du support utilisé.



Il existe plusieurs sites gratuits en ligne pour convertir des vidéos. Voici quelques options populaires :

  1. Online Video Converter
  2. Clipchamp
  3. CloudConvert
  4. Convertio
  5. Zamzar

Assure-toi de vérifier les fonctionnalités et les limites de chaque site, car certains peuvent avoir des restrictions en termes de taille de fichier ou de nombre de conversions gratuite.


"Background color"

Liste of background color, te permet de choisir l'une des couleurs par défaut que tu as configurées pour ton site.

Module Background

Désign des module inerne


"Module Background"

Te permet de modifier la transparence et la couleur de fond des module interne qui compose ta section.

Tu as la possibilité de choisir l'une des couleurs générales par défaut que tu as prédéfinies pour ton site.

*Il est à noter que selon le type de section que tu édites,
cette option peut ne pas être disponible.


boutton color

Modifie l'apparence des boutons

"Button Background"

  • Cela te donne la possibilité d'ajuster la transparence et la couleur de fond des boutons qui composent ta section.

"Boutton text"

  • Te permet de modifier la couleur du texte des bouttons.

"Boutton hover"

  • Cela te permet de régler l'opacité et la couleur de fond des boutons lorsqu'ils sont survolés.



*Note que selon le type de section que tu édites,
cette option peut ne pas être disponible.

Comment compresser une image ?

Compresser une image est gratuit et accessible à tous ! Le poids des fichiers est l'ennemi numéro 1 du […]

Configurer son adresse e-mail professionnelle

Cette ressource complète vous guidera pas à pas dans le processus de paramétrage de votre adresse e-mail […]

Section event version Next Time

Découvre en détail la toute nouvelle version de la section Next Time de notre module […]

hashtag, c'est quoi ce truc ?

Un hashtag (mot-dièse en français) sert à catégoriser et regrouper des publications sur votre site web. […]

Section Animate by freelight

Le module Animate de freelight te permet d'afficher des informations de manière animée sur […]

Ponctuation & typographie

Cette section a pour but de vous expliquer comment écrire correctement un texte sur un ordinateur. […]

Ton moteur de recherche freelight

Découvrez le moteur de recherche freelight' !! Basé sur un algorithme avancé, ce moteur de recherche vous […]

Bien nommer ses images

Pourquoi est-il préférable d'éviter les accents et les majuscules dans le nom des […]

Convertir une image - Pourquoi ?

L'optimisation de vos images peut avoir un impact significatif sur le référencement de votre site web. […]

Les balises OG - Open Graph

Les balises Open Graph sont des éléments de balisage HTML qui permettent de décrire le contenu d'une page […]