Voici un tutoriel pour migrer un site WordPress en local vers o2switch grâce au plugin Duplicator. Voici un récapitulatif des 5 étapes clés : Installation du plugin Duplicator Création du paquet Duplicator (sauvegarde du site actuel) Création et configuration de la base de données sur o2switch Chargement du paquet et du fichier d’installation Copie du…Continue reading Migrer son site WordPress avec Duplicator
Auteur/autrice : Pascal Furlan
Animation Sprite
La propriété CSS steps() est une fonction temporelle permettant de contrôler le déroulement d’une animation en la découpant en plusieurs étapes. Elle est efficace pour créer des animations basées sur un système de sprite. Le fonctionnement est le suivant : La propriété (animation: animation .9s steps(8) infinite, avance 5s linear infinite;) permet d’indiquer le nombre…Continue reading Animation Sprite
Les animations CSS
Les animations CSS sont un module CSS qui définit la façon dont les valeurs des propriétés CSS peuvent être animées au fur et à mesure d’une période via des étapes intermédiaires (keyframes en anglais). Le comportement de ces animations séquencées peut être défini en termes de durée, de nombre de répétitions et de la façon dont elles sont…Continue reading Les animations CSS
Les transitions CSS
Les transitions CSS permettent de contrôler la vitesse d’animation lorsque les propriétés CSS sont modifiées. Plutôt que le changement soit immédiat, on peut l’étaler sur une certaine période. Ainsi, si on souhaite passer un élément de blanc à noir, on pourra utiliser les transitions CSS afin que cette modification soit effectuée progressivement, selon une courbe d’accélération donnée.…Continue reading Les transitions CSS
La propriété ClassList
La propriété classList permet d’accéder à la liste des classes appliquées à un élément HTML, de manière simple et efficace via les méthodes suivantes : length : retourne le nombre de classes add(nom_classe) : ajoute une classe contains(nom_classe) : retourne true si une classe est présente et false sinon remove(nom_classe) : supprime une classe toggle(nom_classe) : ajoute ou supprime une classe, si elle est présente initialement ou non…Continue reading La propriété ClassList
Javascript
Une définition de Wikipedia : JavaScript est un langage de programmation de scripts principalement employé dans les pages web interactives mais aussi pour les serveurs. Le langage JavaScript permet des pages web interactives, et à ce titre est une partie essentielle des applications web. Une grande majorité des sites web l’utilisent, et la majorité des navigateurs web disposent d’un moteur JavaScript dédié pour l’interpréter. Premiers pas en JavaScript JavaScript est…Continue reading Javascript
Collection Bootstrap
I. Extraits de codes Bootstrap Une bibliothèque organisée d’extraits de code Bootstrap >> Start Bootstrap Snippets II. Templates Bootstrap Des templates Bootstrap gratuits qui constituent une mise en page idéale pour son prochain projet Web. >> ColorLib Templates >> Get.Bootstrap Custom Components >> Start Bootstrap Templates III. Thèmes Bootstrap Thèmes Bootstrap gratuits prêts à être…Continue reading Collection Bootstrap
Comment utiliser Font Awesome pour Bootstrap
Font Awesome est une police composée de symboles, d’icônes ou de pictogrammes que l’on peut utiliser dans une page Web, tout comme une police. Pour configurer la Font Awesome sur sa page web, inclure cette ligne dans le <head> : Comment ça marche ? Pour ajouter une icône à sa page Web, utiliser une simple balise…Continue reading Comment utiliser Font Awesome pour Bootstrap
Bootstrap – Les composants
Bootstrap propose des composants pratiques à mettre en œuvre : barres de navigation, effets typographiques, panneaux, boutons, etc. Boutons [button] Bootstrap comprend plusieurs styles de boutons prédéfinis, chacun servant son propre but sémantique, avec quelques extras ajoutés pour plus de contrôle. Barre de navigation [navbar] Les navbars Bootstrap sont des menus de navigation responsives, ils…Continue reading Bootstrap – Les composants
Bootstrap – Les contenus
Images Image responsive Les images dans Bootstrap sont réactives avec .img-fluid. max-width: 100%;et height: auto;sont appliqués à l’image pour qu’elle soit redimensionnée avec l’élément parent. Vignette d’image On peut utiliser .img-thumbnail pour donner à une image une apparence arrondie de bordure 1px.