Comment créer un calque avec OpenElement ?

Pour faire suite au précédent article : Comment créer un menu avec OpenElement ? Nous continuons notre série sur le logiciel de création de site OpenElement en abordant aujourd’hui le sujet : Comment créer un calque avec OpenElement ?

Pour une présentation générale du logiciel OpenElement rendez-vous sur notre article : OpenElement logiciel de création de site web gratuit et simple.

Qu’est ce qu’un calque ?

Un calque vous vous permet de dupliquer un ou plusieurs éléments d’une page afin d’éviter de la refaire entièrement si vous souhaitez intégrer les mêmes éléments qu’une autre page.

Imaginez par exemple que vous ayez 5 pages et que vous souhaitez leur attribuer le même fond et le même menu pour chacune. Sans calque le travail serait fastidieux car vous devrez recréer chaque élément pour chaque page.

OpenElement vous permet donc de créer des calques spécifiques afin de s’en servir comme base pour toutes vos pages.

Comment créer un calque avec OpenElement ?

Voici les différentes étapes à suivre pour créer des calques avec le logiciel OpenElement :

• Commencez par créer une nouvelle page vierge (flèche verte dans l’explorateur de site puis cliquez sur Page)

Cette nouvelle page s’ouvre automatiquement au centre de la zone de travail. Sauvegardez la en vous rendant dans le Menu > onglet Page > icône Enregistrer 

• Pour créer des calques, rendez-vous dans l’exporateur de site puis cliquez sur Calques 

• Pour définir les dimensions de votre calque rendez-vous dans le menu du haut > onglet Page > icône Responsive

• Pour cet exemple nous laissons la valeur par défaut

Par défaut la largeur d’un calque est de 900px. Afin de répondre au mieux aux nouveaux standards du web nous vous conseillons de choisir la résolution 1024px.

A savoir : Il est important de ne pas dépasser 1280px car votre site sera hors cadre lors d’une navigation sur un support smartphone; sa résolution maximale est de 1280 x 900 px.

• Pour modifier les dimensions de votre calque rendez-vous tout en bas de la zone de travail.

Après chaque modification pensez à effectuer des sauvegardes en vous rendant dans l’onglet Page > icône Sauvegarder 

• Pour spécifier un fond pour toute la page rendez-vous dans l’onglet Zone de style dans le menu du haut

• Cliquez sur l’icône Cadre principal puis sélectionnez Fond de la page. La Zone de style s’est modifiée automatiquement.

• Importez maintenant une image de fond en cliquant sur Image de fond > Ajouter. La fenêtre Bibliothèque d’images s’ouvre. Cliquez sur Ajoutez des fichiers puis sélectionnez votre image de fond. Important : choisissez une image de bonne qualité mais pas trop lourde ! Voici 5 étapes pour optimiser les images de votre site internet.

• Une nouvelle fenêtre s’ouvre avec les options d’optimisation. Cliquez sur OK

• Vous êtes de retour à la bibliothèque d’images. Sélectionnez votre fond puis cliquez sur Sélectionner en bas à droite pour importer votre fond à l’ensemble du calque.

Vous remarquerez que l’image ne remplie pas totalement le fond mais se répète. Il s’agit d’une fonction par défaut. Pour désactiver cette fonction, cliquez sur l’onglet Zone de style > Répétition puis cliquez sur Fixe

Votre calque de fond est désormais crée, vous pourrez l’utiliser sur toutes les pages de votre choix !

Retrouvez plus de détails sur la création de calques avec OpenElement sur notre rubrique d’aide en ligne LWS !