16 juillet

Créer un compteur de visiteurs

Inauguration d’une nouvelle catégorie sensiblement pareille que les portions PHP à la seule différence qu’ici, les codes sont plus développés, sont expliqués afin de permettre à ceux qui le souhaitent de comprendre son fonctionnement.

Donc ici nous allons voir comment créer un simple compteur de visiteurs connectés fonctionnant avec PHP et MySQL. Tout d’abord, on va un peu tuer les idées reçues … Un compteur « live » n’affiche pas réellement les visiteurs connectés à un instant T précis mais plutôt les personnes ayant visité la page dans un intervalle de temps relativement court (dans notre exemple, on va considérer qu’une personne est hors ligne à partir de 15 minutes d’inactivité. Cela peut bien évidemment être modifié, nous allons voir comment).

Lire la suite »



24 juin

Utiliser des polices personnalisées dans vos pages web

Hello ^^

Ce billet est en quelques sortes une réaction suite à un article lu sur le célèbre blog Presse-Citron (qui date quand même d’il y a deux ans mais on me pose encore souvent la question …).

Lors de la conception de pages Web que ce soit pour votre site perso ou celui de votre entreprise, bien souvent, vous en avez marre de voir encore et toujours les même styles d’écritures « basiques » pour vos titres. D’ailleurs, je me trouve également dans ce cas.

Voulant donner une meilleure gueule à mes pages, j’ai donc commencé une longue recherche sur une façon qui pouvait conduire à de nouveaux styles pour mes titres. Je suis d’abord tombé sur l’option « titre en image » mais je dois avouer que l’idée de devoir ouvrir Photoshop à chaque fois que je crée une page m’a quelque peu effrayé.

J’ai donc continué à chercher et je suis tombé sur un petit script JavaScript/PHP très sympa : FaceLift.

facelift

La configuration et l’installation sont, de plus, très simple ! Pour le téléchargement, cela se passe du coté de son site officiel, sur la page Downloads.

- Configuration et installation.

Pour commencer, uploadez vos fichiers .TTF dans le dossier « fonts » du répertoire d’installation de FaceLift. Ensuite, ouvrez avec votre éditeur préféré le fichier config-flir.php.

Repérez l’endroit où sont déclarés les autres fichiers de fontes (vers la ligne 40 – 41), puis procédez de façon analogue pour ajouter vos polices :

<?php
$fonts['votre_police'] = 'votre_fichier_font.ttf';
?>

Ensuite, vous n’aurez qu’a spécifier « votre_police » dans la propriété font-family de votre CSS pour l’élément que vous souhaitez remplacer.

Ajoutez maintenant le script comme un script javascript classique dans les en-têtes de vos pages HTML puis, juste avant la fermeture de la balise body, lancez la procédure de remplacement :

Note : Pensez à remplacer /repertoire/dinstallation/facelift/ par le chemin vers le répertoire d’installation de FaceLift (où se trouve le fichier generate.php) ainsi que h2 par l’élément que vous souhaitez remplacer.

Voila ^^
Nico :) .



22 juin

Emuler un sous-domaine avec le mod_rewrite

Hello !

Beaucoup me demande [et cela avait d'ailleurs donné lieu à un article sur mon ancien blog] comment faire pour créer des adresses Web à la Skyblog ou Over-Blog (du type : http://nomdutilisateur.votresite.com).

La solution est relativement simple mais nécessite quand même quelques pré-réquis :

  • Votre hébergeur doit accepter les htaccess. Pour tester si c’est bien le cas, entrez un texte simple (par exemple : « test ») dans un fichier appelé .htaccess que vous placerez à la racine de votre site. Si une erreur 500 apparait, les .htaccess sont acceptés.
  • Votre hébergeur doit avoir activé le mod_rewrite. La façon la plus simple et rapide de le vérifier est de regarder la section Apache Loaded Modules dans le phpinfo().
  • Note : si vous êtes en hébergement dédié, ou que vous avez accès au httpd.conf, vous pouvez l’activer vous même en ajoutant ces deux lignes de codes (n’oubliez pas de redémarrer Apache après avoir modifié le httpd.conf :) ) :
LoadModule rewrite_module modules/mod_rewrite.so
AddModule mod_rewrite.c

Ensuite, vous devez paramétrer votre http.conf ainsi que vos enregistrements DNS pour que tous les noms de domaines (en fait, ceux qui nous intéressent sont ceux qui n’existent pas réellement) pointent vers votre compte. Il vous faudra alors ajouter « *.mon-domaine.com » (où mon-domaine.com correspond à votre site) en alias de votre compte dans le fichier httpd.conf ainsi qu’en enregistrement DNS. Le caractère * est un caractère « joker » qui va prendre en compte tous vos sous domaines :) .

Si toutes les vérifications ci-dessus se sont avérées être positives, on va passer à la suite.  Créez un fichier .htaccess dans lequel vous allez mettre le code suivant :

RewriteEngine On
RewriteCond %{HTTP_HOST} !^www\.mon-domaine.com
RewriteCond %{HTTP_HOST} ([^.]+)\.mon-domaine.com
RewriteRule ^(.*)$ /index.php?user=%1

Veillez bien à y remplacer les deux occurences de mon-domaine.com par votre nom de domaine (sans les www) puis index.php?user= par le chemin réel de votre script.

Cette portion va vous permettre de transformer l’adresse http://nicolas.mon-domaine.com en http://www.mon-domaine.com/index.php?user=nicolas. Dès lors, vous allez pouvoir récupérer le nom d’utilisateur avec PHP (ou tout autre langage d’ailleurs) pour le traiter et afficher les infos correspondantes :) .

Pour aller plus loin, vous pouvez consulter le guide officiel dédié à l’URL Rewriting sur le site d’Apache ou encore ce texte (en anglais) pouvant vous apporter une aide sur les différentes façons de gérer les expressions régulières pour vos réécritures.

Nicolas.



20 juin

Quelques icônes pour webmasters

Hello !

Un des principaux calvaire de tout webmaster en train de conçevoir son design est de trouver des jolis petits icônes pour illustrer les items des menus ou des titres …

Voici quelques outils qui vous faciliteront un peu la vie à ce niveau :

1. Les moteurs de recherche d’icônes

Nombreux sur les web, les Google des logos vous permettent de trouver en trois clics l’icône que vous recherchez en différent styles. Seul inconvenient, ces modules sont édités par nos amis anglophones, ainsi, vos critères seront à entrer …. en Anglais !

Un peu moins orienté Web, le moteur PngFactory peut également vous permettre de trouver quelques icônes, bien qu’il dispose d’une collection moins importante que les sites présentés ci-dessus.

2. Les collections « navigables »

Si vous ne savez pas exactement ce que vous recherchez (ou que vous ne savez pas le traduire dans la langue de Shakespeare …) vous pourrez toujours naviguer dans des collections en espérant trouver LA perle rare qui va transformer votre design en réelle oeuvre d’art.

Le moteur IconFinder permet de naviguer entre les 144 collections qu’il indexe, de lister ces collections pour enfin vous permettre de télécharger l’icône désiré sous forme de fichier PNG ou ICO.

Peut être un peu plus interessant pour les webmaster étant donné que nous sommes très limités par la taille des icônes, IconLet permet de sélectionner la taille dont vous disposez pour qu’il vous liste tous les icônes qui y correspondent.

Le site IconsPedia, quant à lui, vous présente un classement par thèmes et catégories afin de vous guider dans votre recherche. Les icônes sont cependant plus gros que dans les sets dédiés au Web (64 pixels par 64).

3. Quelques collections …

Icones FamFamFam

La célèbre collection, qu’il n’est même plus nécessaire de présenter, est la collection disponible sur le site Famfamfam.com. Cette collection à déjà fait le tour du web et a été utilisée par des sites relativement important (Air France notamment).

pinkvoke

La dernière collection que j’ai découverte et que j’utilise presque à chaque fois que je souhaite insérer un icône est le set créé par PinkVoke. Un peu dans la même lignée que Famfamfam, on dispose ici d’une collection de plus de 1000 icônes pouvant être utilisé à toutes les sauces (grâce aux PSD fournis, permettant de les « combiner »).

Drapeaux

Idéale pour toutes vos applications multi-lingue, cette collection créée par Famfamfam présente les drapeaux de 247 pays du monde. Les images sont nommées grâce au code ISO 3166-1 alpha-2 des noms des pays. Cela permet notamment d’automatiser certaines tâches, comme par exemple la création d’une liste de tous les pays, avec leur drapeau.

Voila qui pourra vous faciliter la très longue tâche qu’est la recherche d’icônes ! :)

Nicolas.



18 juin

Calcul de l’âge en PHP

Hello !

Etant actuellement en plein développement de la seconde version de mon site, je suis ammené à réaliser des petits bouts de codes qui peuvent s’avérer bien utiles…

En voici un permettant de calculer l’âge en fonction de la date de naissance au format JJ/MM/AAAA :

<?php

$date_de_naissance = "15/10/1989";
$parties = explode('/', $date_de_naissance);
$timestamp_naissance = mktime(0, 0, 0, $parties[1], $parties[0], $parties[2]);
$depuis_ddn = time() - $timestamp_naissance;
$seconde_par_an = (1461*24*60*60)/4;
$age = floor(($depuis_ddn / $seconde_par_an));

echo $age;

?>

Nicolas.

PS : Ce billet permet également d’inaugurer le nouveau plugin que je viens d’installer : SyntaxHighlighter pour WordPress.



17 juin

Présentation

Bonjour à tous,

Tout d’abord, bienvenue sur ce blog. J’ai décidé de le créer afin de partager divers ressources qui peuvent s’avérer utiles dans le domaine de l’informatique, et plus particulièrement d’Internet et du Web 2.0. J’y publierai des tests de logiciels, des sources utiles pour vos sites Web, ou bien les dernières actualités concernant le monde d’Internet.

Petite présentation …

Je m’appelle Nicolas NUNGE, je suis actuellement créateur de sites Internet (sous le régime de l’auto-entreprise). Je suis en parallèle une formation à l’université de Limoges (87) dans le but d’obtenir un DEUST Webmaster et Gestionnaire d’Intranet. J’ai déjà participé à de nombreux projets Web (que vous pouvez retrouver dans la liste de mes réalisations). Si vous souhaitez un site Internet, n’hésitez pas à me contacter via mon site :) .

A bientôt !
Nicolas.