background preloader

Shortcodes WordPress, la simplicité et la puissance du code

Shortcodes WordPress, la simplicité et la puissance du code
Le Shortcode, l'une des grandes avancées de l'histoire du développement WordPress et une des raisons principales de son succès. Qu'il est loin le temps ou si vous vouliez un code, vous deviez l'écrire vous-même... Des morceaux de code entre crochets que vous pouvez littéralement "poser" dans vos articles, vos pages, votre footer ou dans vos barres latérales. Les Shortcodes ont été introduits dans la version 2.5 de WordPress, ils sont généralement très courts et écrits dans un langage intuitif. Utiliser des shortcodes n'implique généralement pas beaucoup d'efforts, en revanche, cela apporte une multitude de fonctionnalités, plus utiles les unes que les autres. Vous les avez sans doute déjà utilisé auparavant sans vraiment vous poser de questions ! Insertion d' images avec légendeInsertion de vidéoGalerie d’imageset bien d'autres... Des exemples de Shortcodes [ gallery ] [ gallery columns="2" size="medium" ] Et vous, vous en avez des shortcodes ? Vous êtes en manque de Shortcodes ? En conclusion Related:  blog

Divi 2 Le Thème hybride WordPress par Elegant Themes Je connaissais les Frameworks, les thèmes premium aux nombreuses options et les plugins "constructeur de pages", en revanche, je ne connaissais pas DIVI 2, le petit dernier de chez Elegant Themes. Force est de constater que c'était une erreur que je vais m'empresser de corriger avec cet article;) Framework ou Constructeur de pages ? On sait que de plus en plus d'utilisateurs veulent un maximum de simplicité. On a ainsi vu fleurir d'excellents plugins de mise en page, citons par exemple l'excellent Visual Composer ou bien encore Live Composer. Du côté des thèmes nous pourrions citer les framework tels que Genesis ou Canvas mais aussi certains thèmes premium comme Avada, Salient ou Enfold qui offrent de nombreuses options. Pourtant en utilisant DIVI, j'ai découvert autre chose... DIVI 2 Thème WordPress par Elegant Themes Le principe de fonctionnement de DIVI est similaire à n'importe quel thème. Le epanel DIVI Customiser DIVI Pour le header, c'est également dans Apparence>> Personnaliser.

Vous pouvez à nouveau intégrer des images Street View et PhotoSphere sur votre site Web Parfois Google nous présente de nouvelles fonctionnalités qui en réalité ne sont pas réellement nouvelles. C’est le cas de l’annonce qu’il est possible d’intégrer des images provenant de Street View, Business View et PhotoSphere à un site ou blogue. Avec l’arrivée de la nouvelle version de Maps, Google avait laissé de côté plusieurs fonctionnalités. C’était le cas des images Street View et PhotoSphere qui n’offrait plus le code d’intégration. Cette fonctionnalité a été finalement réintégrée à Google Maps. Vous pouvez donc à nouveau intégrer une image Street View, Business View et PhotoSphere sur votre site. Comment intégrer une image Street View à votre site Web: Une fois que vous avez atteint l’image que vous désirez intégrer à votre site, appuyez sur la roue d’engrenage qui se trouve dans le coin inférieur droit de la fenêtre. Benoit Descary

Jetpack le plugin WordPress qui booste votre blog Jetpack est un super mega plugin qui connecte et ajoute de nombreuses fonctionnalités à votre site WordPress auto-hébergé via la plateforme WordPress.com Les plugins sont une composante importante du succès de WordPress, il en existe des milliers à ce jour, certains sont bons, d'autres beaucoup moins, certains sont payants (cf: CodeCanyon) et d'autres gratuits. Jetpack le plugin qui booste votre blog Quand Automattic (société fondée en 2005 par Matthew Mullenweg, qui développe et distribue entre autres WordPress), lance un plugin, on se doit de s'y intéresser ! Automattic a donc lancé en 2011, le plugin Jetpack, destiné à apporter à tous les sites utilisant WordPress (quel que soit le serveur sur lequel ils sont hébergés), certaines fonctionnalités jusqu’ici réservées aux seuls utilisateurs de WordPress.com. J'avoue n'avoir pas été convaincu la première fois, je trouvais ce plugin trop lourd et sans grand intérêt. Les fonctionnalités du plugin Jetpack Utilité Fonctionnalités Recommandé

Formatting text pt. 1: blank lines, alignment, wrap-around, two columns Paragraph breaks and blank lines Pressing return in the visual editor gives a line break plus a blank line. If you want a line break only, you press shift-return. In the html editor, pressing return once gives a line break, pressing it twice gives a line break plus a blank line. If you want more blank space between paragraphs, you cannot do it by pressing return repeatedly, because the HTML web standard is no multiple line breaks (no multiple spaces either). <p style="padding-top:14px;">TEXT HERE</p> o <p style="padding-bottom:14px;">TEXT HERE</p> <p style="padding-top:14px;padding-bottom:12px;">TEXT HERE</p> (Or write margin in place of padding). For extra space above and below an image, you add this to the image code, after “img” (again, adjust by changing the numbers): style="margin-top:12px;margin-bottom:10px;" Or, in the visual editor: click image, click edit button (mountain icon), click Advanced Settings, type number in the “Vertical space” box, click Update, update post or page.

Personnaliser WordPress - DIV, Plugins & CSS pour le rendre unique Personnaliser son blog WordPress, c'est le rendre unique... Les thèmes WordPress sont en général plutôt soignés et bien finis (dans l'ensemble;), cependant il arrive que l'on ait besoin d'effectuer quelques retouches, améliorations ou modifications pour l'adapter à nos besoins/envies. C'est là qu'intervient la personnalisation, qu'elle soit faite à partir de Plugins, Shortcodes, CSS ou bien encore à l'aide de DIV, c'est assurément un moyen de personnaliser votre WordPress. N'oubliez pas les balises DIV Les balises DIV sont utilisées pour appliquer un style à un contenu, si les balises SPAN permettent également d'appliquer un style CSS , les DIV sont plutôt utilisées pour la mise en page. On a souvent tendance à les oublier pourtant elles permettent de mettre en avant du texte ou des éléments, d'ajouter une vraie touche de personnalisation. Utilisation d'une balise Div simple : Voyons tout d'abord l'ajout d'une DIV simple de largeur 80%, centrée avec une couleur de fond et une bordure :

5 chaînes pour apprendre à faire des sites internet en vidéo On peut tous apprendre à construire des sites internet. Le tout est de trouver les bons tutos. Il vous est peut-être déjà arrivé d’avoir envie d’apprendre à construire des sites internet. Aussi, je me suis dit que certains d’entre vous sont peut-être à la recherche de formations ou tutoriels gratuits en français (et en vidéo). Voilà pourquoi j’ai décidé de proposer cette sélection (loin d’être exhaustive et pas forcément la meilleure) de chaînes YouTube et Daylimotion qui vous permettrons d’au moins acquérir les bases (voir plus). Bien sûr, je ne prétendrais pas que ces vidéos pourront remplacer une formation traditionnelle mais, si vous êtes un autodidacte ou si vous êtes à la recherche de compléments pour une « vraie » formation, je pense que vous êtes tombé sur la bonne page. #1 OpenClassrooms (anciennement Site du Zéro) Que ferions-nous sans cette plateforme de MOOC ? #2 Team8Tuto Là c’est déjà un peu moins « académique » qu’OpenClassrooms, ce qui n’est pas forcément une mauvaise chose.

Développer et utiliser les « shortcodes » WordPress Qu'est-ce qu'un « shortcode » ? Un « shortcode » WordPress, c'est un petit bout de code (non, sans blague ;-)) qui est exécuté lorsqu'une série de caractères donnée est rencontrée. La série de caractères sera toujours entourée de crochets carrés (ex : [gallery]). Dans les faits, c'est cette série de caractères entourée de crochets carrés qui s'appelle « shortcode ». Lorsqu'on entre le « shortcode » dans une page, un article, un pied de page, etc., l'API WordPress se chargera de l'interpréter et le remplacera par l'information générée par le petit bout de code qui lui est associé. Le « shortcode » peut afficher un simple texte. Par exemple, si vous entrez le « shortcode » [gallery] dans le texte d'un article ou d'une page, WordPress affichera les images associées à l'article ou à la page. Il est parfois possible de personnaliser le « shortcode » en lui indiquant certaines valeurs, comme par exemple : [gallery columns="2" size="medium"]. Où sont programmés les « shortcodes » ? Ex : Lorem ipsum

Modifier le code couleur des articles dans l'admin WordPress Cette astuce permet d’identifier les articles par un code couleur dans l’administration en fonction de leur statut. Dans le code que je fournis ci-dessous, j’ai coloré en jaune les articles en brouillon, en vert les articles programmés, en rouge les articles privés et en bleu les articles en attente de relecture. Les autres les articles publiés apparaissent avec la couleur par défaut. Cette astuce peut s’avérer utile pour les personnes qui planifient leurs articles et qui souhaitent voir d’un coup d’oeil le nombre d’articles sont programmés. De même, si vous êtes un éditeur d’un blog, vous pouvez savoir si vous avez des articles en attente de relecture. Copiez le code ci-dessous et collez-le dans votre fichier functions.php à la racine de votre thème. Évidemment, si vous souhaitez le personnaliser, vous pouvez changer les couleurs !

Fabrice Ducarme: Les Constructeurs de Page pour WordPress Published February 27, 2015 La tendance est de plus en plus marquée pour 2015, les utilisateurs veulent du simple, du rapide et du facile, tout en obtenant de très bons résultats sur le rendu visuel de leur WordPress. Les constructeurs de page sont en plein essor, avec les meilleurs on peut très rapidement créer des pages aux mises en formes complexes (colonnes, onglets tabulaires, filtres, etc), et ce, sans aucune connaissance particulière! Oui mais… que valent-ils ? Autant de questions auxquelles nous allons essayer de répondre lors de cette conférence. Event WordCamp Paris 2015 33 Speakers Fabrice Ducarme 1 Tags page builders 1 Language French/Français 97 Download Subtitles Subtitle this video →

Ui Tiles la ressource pour préparer vos web designs Cette semaine une ressource très intéressante à découvrir avec Ui Tiles qui propose un véritable kit pour réaliser des wireframes en toute simplicité ! Un kit complet pour préparer vos sites web Si vous avez l'habitude de réaliser en amont de vos web designs des wireframes ou croquis pour imaginer l'ensemble des pages et fonctionnalités de votre projet, vous devrez aimer Ui Tiles. Cette ressource regroupe une grande diversité de pages et d'éléments afin de composer facilement et rapidement vos idées. Ce travail peut s'avérer très utile pour valider avec un client son site web avant d'entamer la partie graphique, mais également poser à plat un site complexe. Une ressource complète, libre de droits et gratuite ! Ui Tiles propose 72 modèles de bases, ensuite vous êtes libre de pouvoir composer les vôtres selon vos idées et besoins. Si vous êtes webdesigner, chef de projet, ergonome ou simplement passionné par le web, cette ressource devrait vous servir.

SimpleMag - Stylish Magazine WordPress Theme | Themeshaker.com SimpleMag is a stylish magazine WordPress theme ideal for online journals, news websites, magazines, gossip blogs and other similar types of websites. The theme features sliders for presenting your content and different categories layouts. The theme includes a built-in review system and a unique layout for native WordPress gallery with Swipebox support. This news and journal theme includes 10 custom widgets: featured posts, latest comments, latest posts, most commented, authors, about the site, top rated, video, image ad and code ad. This journal WP template is fully responsive and retina-ready so it looks great on all types of devices.

15 free vector art resources You know that feeling when you're busy in the office or working from home but that piece of work just isn't coming together? You don't have the time to sort something from scratch so you decide to search for some free vector art online – but it's not always easy to find what you're looking for. A good selection of free resources – including free fonts and free vector art – can be a lifesaver for any designer. But more often than not, the process of finding what you need amidst cluttered, confusing pages just adds to the mounting deadline stress. To help you avoid that experience, we've put together a hand-picked guide to the best free vector art resources, including various useful designs you can download in preparation for future projects. 01. Previously known as VectorOpenStock, Vexels still features thousands of free vector graphics and designs, organised into easy-to-browse categories. 02. 03. After a properly retro look and feel for your work? 04. 05. 06. 07. 08. 09. 10. 12. 13.

Comparatif des outils pour creer son site internet en ligne Parait-il qu’on peut créer son site internet en ligne facilement aujourd’hui. Vous avez sans doute entendu parler de CMS ou de Créateurs de Site internet en ligne gratuits et super facile à utiliser, même sans avoir de connaissances techniques. Et bien c’est vrai, de tels solutions existent, mais… Vous ne savez pas lequel choisir ? Il y a plein (trop) d’éditeurs qui proposent des solutions tout-en-un : hébergement + nom de domaine + CMS (Système de gestion de contenu). Certains sortent vraiment du lot, d’autres sont à éviter. Ça tombe bien, j’ai fait le tour des outils les plus populaires sur le Net en ce moment, pour vous aider à choisir celui qui correspond la mieux à votre projet. Je tiens à vous préciser que je connais et j’utilise personnellement certains outils ci-dessous plus que d’autres. Mais comme j’ai voulu être le plus objectif possible dans ce comparatif, j’ai fais un mix de mon expérience personnelle avec d’autres sources d’informations que je cite à la fin de l’article.

Les règle d'or du web design - Wix.com Alors que Ridley Scott nous balance du Batman déguisé en Moïse qui traverse la mer sur son valeureux canasson dans son nouveau Blockbuster, nous avons décidé de consacrer un article à dix commandements susceptibles de susciter votre intérêt : ceux du web design. Nous ne prétendons pas qu’ils vous permettront d’accomplir des miracles – laissons les fantaisies à Hollywood – mais nous pensons sincèrement qu’ils vous aideront à améliorer considérablement vos résultats sur la Toile. Comme vous le savez, le web design impose certaines règles et fonctionne selon des standards établis suivis par la plupart des créateurs de sites professionnels. Trêve de cinéma. Tu créeras un site à ton image Quelle que soit votre activité, votre site doit refléter vos valeurs et véhiculer l’image de marque de votre entreprise. Lecture complémentaire : Comment construire l’image de marque de votre entreprise ? Tu contrôleras ta navigation Tu chériras tes visuels Vos images en disent long sur votre entreprise.

Related: