Les derniers articles :

Centrer un svg dans son container

Par défaut, les svg sont des éléments en ligne.

CSS
1
2
3
4
div {
display: block;
margin: auto;
}

Il suffit donc de changer leurs types et ainsi nous pouvons les centrer facilement.

Modifier votre css selon la langue utilisé sur votre site

CSS selon la langue
CSS
1
2
3
4
5
6
7
8
9
10
html[lang="nl-NL"]{
.uk-article-title {
font-size: 28px;
{
}
html[lang="de-DE"]{
.uk-article-title {
font-size: 28px;
}
}

Mettre à jour l’heure de votre serveur WordPress

Lorsque vous publiez un articles, une page ou n’importe quel type de contenu, WordPress enregistre automatique l’heure de publication. En France, le changement d’heure impacte votre WordPress puisque nous utilisons l’heure d’été et l’heure d’hiver.

Pour mettre à jour l’heure de votre WordPress :
¤ Rendez-vous dans votre Back-Office.
¤ Dans le menu de droite cliquer sur Réglages/Général.
¤ Dans la fenêtre qui s’affiche, repérez la ligne Timezone.
¤ Dans la liste déroulante affichez choisissez UTC+1 pour l’heure d’été, UTC+2 pour l’heure d’hiver.

 

Ajouter une favicon personnalisée à son site WordPress

Commencer par créer vos favicon :

¤ Une image au format favicon.ico de dimensions 32x32 pixels*.
¤ Une image au format apple_touch_icon.png de dimensions 114x114 pixels*.

Maintenant placez-vous dans le répertoire /wp-content/themes/votre_theme :

wp-content/themes/votrethème 

Écrasez maintenant les favicon initiaux de Wordpress avec vos propres favicon.

* Nous reprenons les dimensions initial utilisées par wordpress pour maximiser la compatibilité entre les différents navigateurs.

Configurer le fichier wp-config.php en local

PHP
1
2
3
4
5
6
7
8
9
10
11
/** Nom de la base de données de WordPress. */
define('DB_NAME', 'campinglarouteblanche_com');
 
/** Utilisateur de la base de données MySQL. */
define('DB_USER', 'root');
 
/** Mot de passe de la base de données MySQL. */
define('DB_PASSWORD', '');
 
/** Adresse de l'hébergement MySQL. */
define('DB_HOST', 'localhost');

 

Comparer deux fichiers dans Sublime Text

Sublime_Text

La création d’un site internet passe par la création, l’édition et la correction de nombreux fichiers. Il est souhaitable de toujours mettre en place un système de versioning (version de fichier). Cette bonne pratique de développement nous permet de revenir sur d’anciennes version de fichier et de les comparer avec ceux en ligne.

Lire la suite

Feuilles types HTML5 + CSS3

Une feuille HTML5 type :

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Page HTML5</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
</head>
<body>
<header></header>
 
<nav></nav>
 
<section>
<article></article>
<aside></aside>
</section>
 
<footer></footer>
</body>
</html>

 Une feuille CSS3 type avec @media query :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/* MOBILE PORTRAIT */
@media only screen and (min-width: 320px) {
}
 
/* MOBILE LANDSCAPE */
@media only screen and (min-width: 480px) {
}
 
/* SMALL TABLET */
@media only screen and (min-width: 600px) {
}
 
/* TABLET/NETBOOK */
@media only screen and (min-width: 768px) {
}
 
/* LANDSCAPE TABLET/NETBOOK/LAPTOP */
@media only screen and (min-width: 1024px) {
}
 
/* LAPTOP Medium resolution*/
@media only screen and (min-width: 1280px) {
}
 
/* LAPTOP Hight resolution */
@media only screen and (min-width: 1400px) {
}
 
/* PRINT */
@media print {
}

 

Diminuer la luminosité au passage de la souris sur une image

Le filtre britghtness est une propriété introduite par le CSS3. Il faut donc appliquer le CSS correspondant pour chaque navigateurs.

CSS
1
2
3
4
5
6
7
img:hover {
filter: brightness(50%);
-webkit-filter: brightness(50%);
-moz-filter: brightness(50%);
-o-filter: brightness(50%);
-ms-filter: brightness(50%);
}

 

Charger des fonctions depuis un autre fichier en js

JavaScript
1
2
3
4
5
function max_color(color){
$('body').css("background-color", color);
}
 
window.max_color = max_color ;

// Permet a la fonction d’etre accessible depuis n’importe quelle fichier js charger par votre page web.

1 … 6 7 8 9 10 … 12  
Réalisé par M.Defachelle.