Un petit truc pour donner un effet de changement de ton d’une image sur l’évenement hover de la souris. Il suffit de placer l’image à l’intérieur d’un élement DIV auquel on va donner un background de couleur, dans l’exemple ci dessour la couleur est le noir. Code HTML : <div class= »fond_image »> <img src= »img/image1.jpg » alt= »effet sympa sur le survol […]
Pour customizer son template et afficher l'image à la une d'un article ou d'une page WordPress comme background d'un élément DIV, utilisez la propriété wp_get_attachment_image_src <?php if (has_post_thumbnail( 'single-post-thumbnail' )) : ?> <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID )); ?> <div id="div-background" style="background-image: url('<?php echo $image; ?>')"> </div> <?php endif; ?>
Un petit mémo pour avoir sous la main une boucle WordPress de base qui parcours un custom post type que l'on aura préalablement défini. Soit donc mon custom post type : temoignage, le code suivant parcours les 10 derniers articles de ce type et affiche leur titre ainsi que leur contenu <?php $loop = new […]
Un petit bout de code qui permet de parcourir les catégories de nos articles WordPress en utilisant la fonction native get_categories() Boucle sur les catégories : $args = array( 'type' => 'post', 'child_of' => 0, 'parent' => '', 'orderby' => 'name', 'order' => 'ASC', 'hide_empty' => 1, 'hierarchical' => 1, 'exclude' => '', 'include' => '', […]
Un Shortcode WordPress est une fonctionnalité complexe qui va pouvoir être appelée directement depuis l'éditeur de contenu Wordpress sous la forme [nom-de_mon_shortcode]. Très pratique pour ajouter des fonctionnalités particulières et complexes à l'intérieur du contenu d'une page. Un Shortcode connu des utilisateurs de WordPress est celui qui affiche une galerie de photos Comment créer un ShortCode […]
Il est possible de customiser les permaliens des custom post type grâce (entre autres) au paramètre "rewrite" de la fonction register_post_type. Voici ci dessous un exemple de déclaration de custom post type "temoignage" add_action('init', 'CT_temoignage'); function CT_temoignage() { register_post_type('temoignage', array( 'label' => __('Témoignages'), 'singular_label' => __('Témoignage'), 'public' => true, 'has_archive' => true, 'show_ui' => true, 'capability_type' […]
Il est possible de garder la valeur d’une variable de session même après que l’internaute ait fermé son navigateur. Il faut comprendre que les sessions utilisent les cookies pour être sauvegardées sur votre machine. La fonction session_get_cookie_param() vous donne les propriétés du cookie de session : lifetime : durée de vie de la session en secondespath : Le […]
Par défaut dans WordPress, les fonctions the_excerpt() ou get_the_excerpt() affichent : Soit le contenu indiqués dans le champs Extrait de l'administration d'un article, Soit si le champs Extrait n'est pas rempli, the_excerpt() affichera les n (n=55 par défaut) premiers mots du contenu de l'article correspondant. En passant, je signale qu'il est aussi possible de changer le nombre […]
Pour parcourir tous les éléments d’un document HTML ayant une classe définie, nous pouvons utiliser la propriété javascript getElementsByClassName Pour parcourir tous les éléments HTML d’une classe donnée en Jquery, se référer à ce Mémo
Voici comment parcourir un simple tableau en JavaScript.Notez la variable longeur du tableau déclarée avant la boucle afin de ne pas avoir à recalculer cette valeur à chaque itération.
Soit un élement HTML de type DIV et étant affecté de 3 classes Code JavaScript : ? Cliquez moi pour parcourir mes classes
Internet Explorer pour ses version antérieures à la 9 ne prend pas en charge l’événement javascript addEventListener, qui permet d’assigner un événement javascript à un élément HTML. On peut remplacer cette fonction sous IE par la fonction attachEvent Remarquez que le nom de l’évément passé en paramètre pour addEventListener doit être nommée sous la form click, mouseover, keydown, keypress … tandis que pour attachEvent, ses […]
Création d’un élément HTML en Javascript Affectation des attributs de l’élément : var new_elt= document.createElement(‘img’); new_elt.id = ‘mon_img’ new_elt.src = ‘http://www.monsite/images/monimage.jpg’; new_elt.title = ‘Title de mon imag’; new_elt.setAttribute(‘alt’, ‘Attribut Alt de mon image’); A ce stade, l’objet image a été crée mais il n’a pas encore été inseré dans le document HTML. Pour ce faire […]
Pour imposer la saisie d'un couple identifiant / mot de passe afin de rentrer dans un répertoire de votre site Internet, une des solutions est d'utiliser le fichier .htpasswd. Pour cela il convient d'ajouter 2 fichiers au répertoire dont vous souhaitez limiter l'accès : .htaccess et .htpasswd. Dans l'exemple suivant, nous supposeront que nous voulons […]
Il est possible de rajouter les formulaire de recherche natif de WordPress en dur dans un des fichiers de votre thème si vos zones de Widget ne vous conviennent pas. Ajouter pour cela le code suivant à l'endroit souhaitez, dans le fichier header.php par exemple si vous souhaitez ajouter le champs de recherche WordPress dans l'en-tête […]
Voici comment rajouter une image avant ou après un élément HTML, en utilisant les pseudo éléments CSS :before ou :after Le code suivant va afficher l’image url(img/facebook.png) avant le div d’identifiant mon_div Code HTML : <div class= »mon_div »> Mon div </div> Code CSS : .mon_div:before{ content:url(img/image.jpg) ; position:relative; left:-3px; top:10px; } .mon_div {background-color: #eaeaea;}
TaraZa est un thème WordPress tout nouveau, cuvée 2014. Un thème WordPress Simple et Sobre =====> DEMO <==== ==> DOWNLOAD : Téléchargez gratuitement le Thème WordPress TaraLi sur le site officiel de WordPress<== Page d’accueil de votre blog Wordpress paramétrable : Affichage d’un diaporama à deux images avec lien vers une autre page + commentaire Liste des derniers articles publiés. […]
Si votre thème WordPress comporte des élements positionnés en absolute, il y a de grandes chances pour que vous constatiez un décalage de 28px (hauteur de la barre d'administration) dans le positionnement de ces éléments lorsque vous êtes connecté à l'administration WordPress sur votre navigateur et que cette barre supérieure de gestion de l'administration apparaît. Si votre […]
C'est une erreur qui m'est apparu plusieurs fois après une installation d'extension ou changement de thème. Je n'ai jamais vraiment compris l'origine mais voici quelques manips qui pourront vous aider, et qui ont marché pour moi : Si le fichier incriminé est wp-config.php, ouvrez ce fichier avec un editeur de texte tel que Notpad ++ […]
Pour aider les administrateurs de sites WordPress à saisir articles et posts, on peut leur rajouter des commentaires dans les pages d'administrations des posts, post type ou page. Code à ajouter dans le fichier functions.php de votre thème Le code ci dessous rajouter une meta box dans le corps de la fenêtre de saisie des posts function […]
Il est malheureusement souvent nécessaire de mettre en place une feuille de style spéciale pour certains navigateurs qui ne supportent pas les propriétés CSS modernes. Prenons un exemple complètement au hasard, disons que IE répond mal à certaines propriétés CSS et que vous voulez affecter à vos éléments un style particulier lorsque votre site est visualisé sous ce […]
Traduire un thème ou un plugin WordPress, est laborieux mais somme toute assez facile. En utilisant le logiciel poedit, et en remplacant tous vos textes sous la forme : <?php __( 'texte', 'domain-theme' ); ?> vous afficherez votre texte traduit selon la langue choisie dans votre installation WordPress. Vous trouverez plus d'information sur le site […]
Afin d'optimiser son site WordPress, il est bon d'utiliser les déclarations conditionnelles de fichier javascript. Dans le fichier functions.php de notre thème WordPress, nous n'allons déclarer notre script à l'aide de la fonction WordPress wp_enqueue_script, que si nous sommes en train d'afficher une page reliée à un template précis. Ici par exemple, le script contact-form.js […]
Un favicon, c’est le petit sigle correspondant à un site Internet, et qui s’affiche sur l’onglet de votre navigateur. Un favicon est une image dont l’extension est .ico, elle peut être générée par des outils en ligne à partir d’une image jpg ou png. Pour l’afficher sur votre site personnel WordPress, le code suivant doit […]
TaraLi est un thème WordPress tout nouveau, cuvée 2014. Un thème WordPress Simple et Sobre =====> DEMO <==== ==> DOWNLOAD : Téléchargez gratuitement le Thème WordPress TaraLi sur le site officiel de WordPress<== Page d’accueil de votre blog Wordpress paramétrable : Affichage d’un diaporama avec lien + commentaire Affichage de blocs de liens vers un contenu de votre choix. Liste […]
WordPress permet d'afficher un résumé / extrait d'un article grâce à la fonction <?php the_excerpt(); ?> L'extrait affiché représente soit les premiers mots de l'article, soit si on l'a saisit, le champs extrait de l'article. Par défaut ce sont les 55 premiers mots de l'extrait de l'article WordPress qui sont affichés, il est possible de […]
Ca paraît fou, mais j'ai mis du temps à comprendre comment désactiver l'affichage des commentaires dans une page WordPress. J'ai pris l'habitude de régler rapidement le problème en supprimant purement et simplement la ligne d'affichage des commentaires dans le template PHP de la page. Solution radicale, mais pas très propre. Supprimer les commentaires des pages […]
La fonction javascript isNaN(number) est bien utile pour vérifier que vous avez affaire à un nombre. Elle vous renvoie FALSE si vous lui passez un nombre en paramètre et TRUE sinon. Exemple : isNaN(27) renvoit FALSEisNaN(’27’) renvoit TRUEisNaN(‘lsdjfjksh’) renvoit TRUEvar m=27;isNaN(m) renvoit FALSE
Une méthode simple pour récupérer l'adresse URL de la page courante en jQuery : $(location).attr('href'); En javascript, la fonction équivalente est : window.location.pathname;
Créer un ebook à partir d'un fichier pdf avec le logiciel calibre Télécharger le logiciel calibre Cliquez sur le menu "Ajoutez des livres" et sélectionnez votre fichier pdf. Sélectionnez sur le livre que vous venez d'ajouter et cliquez sur le menu "convertir les livres" Une fenêtre apparaît qui vous permet de paramétrer les principales données de […]
Si vous changez le nom de domaine d'un site WordPress, un simple export de la base de données ne vous permettra pas de récupérer la configuration des menus, des widgets et d'éventuelles autres extensions que vous avez intégré. Pourquoi je perds ces informations lors d'un export WordPress ? Ces données stockées en base de données […]
Configuration du serveur : Limiter la taille des fichiers chargés sur le serveur avec le fichier php.ini Le chargement des fichiers sur un serveur, et en particulier la taille des fichiers uploadés, est soumis à plusieurs limitations au niveau de la configuration dudit serveur. Ces paramètres limitatifs sont modifiables dans le fichier php.ini et peuvent […]
Code pour convertir des octets (Bytes en anglais), Ko (kilos-octet), Mo (Méga-octet), Go (Giga-octet) en utilisant Javascript/Ajax. Grossières estimations : Une image pèse entre quelques ko et quelques Mo. Un film pèse entre plusieurs centaines de Mo et quelques Go Formulaire de conversion d’octets A noter que j’ai utilisé le plugin JQuery joliSelect pour styliser l’élément […]
Pour déclarer un fichier javascript ou une image contenus dans un répertoire du thème enfant, il convient d’utiliser la fonction WordPress get_stylesheet_directory_uri(); … et non pas get_template_directory_uri() qui fait lui appel au répertoire du thème parent. Exemple : <script src= »<?php echo get_stylesheet_directory_uri(); ?>/js/mon_fichier.js »></script> De même, TEMPLATEPATH (déprecié ) donne le répertoire du thème parent, alors que STYLESHEETPATH renvoit […]
Trouver la date précédente et la date suivante d’une date au format SQL
Pour sauter des lignes dans le texte des fenêtres d’alerte javascript il faut rajouter les caractères : \n
Pour soumettre un formulaire sur un évenement javascript on utilise la fonction submit() javascript, appliquée sur notre formulaire.Cette technique permet de faire des vérifications sur la validité des champs avant de soumettre le formulaire. Déclaration du formulaire en HTML : Code Javascript : Fonction appelée sur l’évenement onclick de l’input de type button. Le formulaire est soumis sous condition.
Script de création de formulaire pour convertir Bitcoins en Euros ou Dollars Voici un script PHP / HTML / Javascript pour convertir un montant donné en Dollars ou en Euros en montant Bitcoins au taux de conversion en temps réel. Le calcul se fait en allant interroger l’URL officielle https://blockchain.info/ de calcul du taux de conversion bitcoin. […]
Pour vérifier que le format d’une adresse internet est correct en javascript, utilisons les expressions régulières. En paramètres, l’URL a tester, suivi d’un boolean qui détermine si ‘http://’ est facultative ou pas pour valider l’URL.
Méthodes pour déterminer si un élément est visible en JQuery : <script> if ($("#monelement").is(":visible")){alert ("#monelement est visible");} if ($("#monelement").is(":hidden")){alert ("#monelement est caché"); } </script> boucle sur tous les div visibles enfants de l'élement d'id 'monelement' : $("#monelement div:visible").each( function() { });
Si vous tombez sur cette erreur, c'est que la propriété jQuery.browser a été dépreciée dans la version Query 1.9. Pas glop … Cette propriété pourtant bien utile permettait de connaitre l'identité du navigateur ainsi que sa version. Aucun remplacement facile à mettre en place apparemment pour l'instant. Vous pouvez régler le problème en déclarant le plugin jQueryMigrate après […]
jQuery propose quelques méthodes faciles d’utilisation pour ajouter des éléments dynamiquement dans notre code HTML après que la page se soit chargée. Soit notre code HTML : insertAfter : Insérer du code après un autre élément Le paragraphe sera inséré après la balise de fermeture de l’élément ma_classe insertAfter() : Déplacer un élément dans le DOM La […]
Les éléments HTML peuvent être identifiés par un id unique. Un attribut de type identifiant doit commencer par une lettre ([A-Za-z]), suivie d’un nombre quelconque de lettres, chiffres ([0-9]), traits d’union (« -« ), soulignements (« _ »), deux-points (« : »), et points (« . ») Affecter l’identifiant entier de l’enregistrement de ma BDD à un élément HTML Or, il peut être utile […]
Les éléments HTML peuvent être identifiés par un id unique. <div id="mon_id"> </div> Un attribut de type identifiant doit commencer par une lettre ([A-Za-z]), suivie d'un nombre quelconque de lettres, chiffres ([0-9]), traits d'union ("-"), soulignements ("_"), deux-points (":"), et points (".") Affecter l'identifiant entier de l'enregistrement de ma BDD à un élément HTML Or, il […]
Afin de s’assurer que les champs obligatoires d’un formulaire sont bien renseignés, vous pouvez utiliser cette fonction javascript qui vérifie, avant de soumettre le formulaire, que le ou les champs obligatoires sont bien remplis. Code HTML : Création du formulaire Code PHP pour récupérer la valeur du champs après soumission du formulaire : Fonction javascript de […]
Même si les navigateurs présentent une commande pour imprimer la page, le fait d’ajouter une bouton Imprimer sur votre page, peut faciliter l’expérience utilisateur. Code HTML : <form> <input id= »impression » name= »impression » type= »button » onclick= »imprimer_page() » value= »Imprimer cette page » /> </form> Fonction d’impression de page en javascript avec window.print() Code Javascript <script type= »text/javascript »> function imprimer_page(){ window.print(); } </script> […]
Lorsque l'internaute tape une adresse erronée sur votre site Internet, votre serveur l'envoie sur une page d'erreur. Vous pouvez la personnonaliser en créant un fichier 404.html et en le déclarant dans votre fichier .htaccess après la commande ErrorDocument Déclaration de votre fichier 404.php dans le .htaccess ErrorDocument 404 https://memo-web.fr/404.php Votre fichier s'affichera avec votre design […]
On récupère le texte affiché dans un textarea en JQuery avec la fonction val() On peut aussi modifier le contenu grâce à la même fonction val(« mettre du text dans le textarea ») Code HTML : <form> <textarea id= »mon_textarea »> Mon texte ici </textarea> <input type= »button » value= »Afficher le texte » id= »afficher_texte »/> </form> Afficher le texte contenu dans un textarea en JQuery Insérer du […]
Pour afficher une carte google Map sur son site Internet et ajouter des lieux sur la carte (vous savez, ces petits pins plantés dans la carte), nous allons utiliser l’API google Map ainsi que la technologie AJAX. Nous supposeront que les coordonnées GPS des points à indiquer sur la carte sont stockés dans une table […]
Voici un petit tutoriel pour apprendre à afficher sur son site Internet une carte Google Map et y insérer un marqueur de lieu. Le lieu à insérer étant tapé dans un formulaire de recherche sur le site Internet (Voir exemple sur cette page), c’est l’API Google map qui cherche ses coordonnées latitude longitude pour ensuite afficher […]
