Template pour Blogger avec grille, date perso, responsive et plus

J'ai construit un modèle pour des sites types Blogger, idéal pour les journaux, des sites d'information mais peut être pour autre. J'ai intégré plusieurs éléments qui sont très recherchés sur le net : grille (grid) avec les hauteurs égales, chaque article avec une date personnalisable (et en format français), avec un bouton "haute de page", avec des pages numérotées, avec ou sans une troisième colonne et tout est adapté aux portables (smartphones, tablettes : responsive design).

Lire la suite

Types de pages Blogger

Pour afficher/placer un élément sur une page spécifique (on veut montrer le widget Archives par exemple seulement sur la page d'accueil), il faut comprendre la structure et connaitre les types de pages Blogger, puis on peut mettre l'élément à la place spécifique avec l'aide de "if condition".

Lire la suite

Date pour tous les articles de Blogger et sa personnalisation

Avez vous un problème avec la date des articles dans un blog Blogger ? Voulez vous une date qui s'affiche en haut de tous les articles mais en format français ?

Le problème avec le système Blogger c'est qu'on ne peut pas avoir beaucoup de choix : ou on choisie le format des en-têtes de date (<data:post.dateHeader/> mais qui n'apparait que dans le premier article de la journée, ou on choisie le format de date et d'heure (<data:post.timestamp/>) mais le menu offre seulement une date à l'américaine (m/jj/aaaa ou nom de jour, mois jour, an).

Ici, je vous propose une date à la française et pour tous les articles, même pour ceux qui sont écrits au même jour. On le fait avec une modification du code xml et à l'aide d'un script, puis on peut changer son style à un type calendrier ou en rond par exemple.

Lire la suite

Codage UTF-8 et caractères spéciaux (français) dans HTML

utf-8-caracteres-speciaux-htmlJ'ai cherché désespérément une solution à mon problème de codage, sans résultat pendant quelques années. Les caractères spéciaux comme le "é", "à", "ç", "î", etc. s'affichaient un � au coté HTML, surtout quand la page HTML a été générée par PHP (WordPress).

En essayant valider ma page avec W3C, il dit :

Lire la suite

Widget Commentaires Récents pour Blogger

widget-commentaires-recents-pour-blogger
Nous pouvons facilement installer un widget de Blogger pour les commentaires récents publiés dans les articles. Le widget affiche le nom de l'auteur, un extrait du commentaire et un avatar arrondi de l'utilisateur. En plus, on peut donner un avatar personnalisé pour les commentateurs anonymes. Vous pouvez voir l'exemple sur le blog Politi-kaka en bas de la barre latérale droite.

Lire la suite

Animer avec jQuery - types easing et effets

Avec jQuery, on peut animer un site HTML similairement au Flash et le rendre très dynamique. Même si vous ne connaissez pas javascript comme un expert, avec l'aide de jQuery et quelques recherches sur le net, vous pouvez intégrer des scripts d'animation facilement.

Dans notre exemple on va faire défiler un objet sur la scène à l'ouverture du site, puis on rajoute un bouton avec lequel on peut animer des objets et à la fin on va faire tout disparaitre de la scène. L'exemple vient du site Zen It.

Lire la suite

Détecter et rediriger les versions d'Internet Explorer en utilisant JavaScript

Qui souffre encore de la cruauté des anciennes versions l'Internet Explorer ? Si douloureux quand on passe des jours et des semaines avec des extra codages et encore...

Pour avoir une bonne résultat de l'affichage de votre site dans les versions antérieures de IE9, il faut :
- lire des tutoriels et faire des recherches dans les pages qui parlent chinois quelque fois et dans les forums pour étudier les moyens de l'amélioration de IE.
- télécharger un logiciel, appelé IETester pour voir les changements car moi, je n'ai plus, je ne peux plus et je ne veux plus installer les versions démodées.
- télécharger le script de Modernizr, et compléter avec Boilerplate et les lier à tous mes pages pour détecter les fonctionnalités de HTML5 et CSS3 et améliorer l'affichage des effets et des éléments graphiques plus modernes dans l'ancien IE.
- rajouter les commentaires conditionnels (voir ici) dans la page html.
- rajouter une extension (plugin) de Modernizr dans mon blog WordPress qui met des scripts et codes nécessaires à tous les pages du blog, générées par le système php.

Lire la suite