Widget raw html (brut html) la trousse à outil pour shortcodes

je-evrard · mai 2017

[h]Le widget raw html[/h]

Le widget raw html ou brut html permet l'insertion de code html mais pas que.

En effet Visual Wizard intègre comme spxshortcodes les memes fonctions. (pas besoin donc d'installer spxshortcodes avec visual wizard)

[h]Les Shortcodes c'est quoi ?[/h]

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. 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.

Pour plus de détail sur les shorcodes : http://codex.wordpress.org/Shortcode_API

[h]Des shortcodes dans son thème[/h]

Ainsi, il est possible de déclarer des shortcodes dans son thème :

Comment faire ?

A la racine du thème vous créez un fichier config.php dans lequel vous déclarez votre shortcode :

Ici on déclare un shortcode pour afficher un pdf via google.

[== Indéfini ==]
<?php
/* [viw_display_pdf]http://maurras.net/pdf/divers/Histoire-de-France-Jacques-Bainville.pdf[/viw_display_pdf] */
    function viw_display_pdf_func($atts, $content) {
        extract( shortcode_atts( array(
   
        'width'		=> '100%', 
	'height'	=> '500px' 
	
	
	), $atts ) );	
	
       return '<iframe src="http://docs.google.com/viewer?url=' . $content . '&embedded=true" style="width:' .$width. '; height:' .$height. ';" frameborder="0">Your browser should support iFrame to view this PDF document</iframe>';
    }

add_shortcode('viw_display_pdf', 'viw_display_pdf_func');

?>

Et maintenant dans visual wizard on créé un widget raw html et on insert son shortcode dedans :

[== Indéfini ==]
[viw_display_pdf]http://maurras.net/pdf/divers/Histoire-de-France-Jacques-Bainville.pdf[/viw_display_pdf]

Coté site on a un beau pdf sans code html !

Je ferais une explication plus détaillée au fil de l'eau.

Dudy · mai 2017

ciao jerome
merci pour le widget, juste une question, dans le fichier config.php en peux mettre tous les shortcodes ensemble en changeant juste le nom de la function?
viw_display_pdf_func
merci

je-evrard · mai 2017

C'est tout a fait Ça ! Ou le nom que tu veux.

Dudy · mai 2017

Cool

merci le wizard :P

je-evrard · mai 2017

Hello mon bon Dudy,

Voici un exemple a suivre pour ton template fashion (la box overlay)

[== Indéfini ==]
/* 
http://giannidicaprio.com/Templates/Wizard/index.php?static3/fashion
[viw_display_boximage img="toto.jpg" ][/viw_display_boximage] */
function viw_display_boximage_func($atts, $content) {
extract( shortcode_atts( array(
   
        'img'	=> '',
	
	), $atts ) );	
	
   return '<div class="box-top">
		<img src="data/medias/'.$img.'" alt="Avatar" class="image">
		<div class="overlay-top">
			<div class="text">'.$content.'</div>
		</div>
	</div>';
}

add_shortcode('viw_display_boximage', 'viw_display_boximage_func');

Et pour l'usage :

[== Indéfini ==]
[viw_display_boximage img="toto.jpg" ]MY TITLE[/viw_display_boximage]

L'avantage pas de duplication html. Si tu modifies ta fonction, toutes les instances de raw html avec ce shortcode vont en hériter ! De plus on peut mettre du code php dans la fonction bien entedu ($plxmotor...) !

Ca permet de fournir des gabarits html sous forme de macro code, l'idée étant de centraliser l'html spécifique dans le thème.

Dudy · mai 2017

Parfait c'est justement ce que je voulais essayer
Je vais voir tout ca lundi je ne serais pas là tout le week-end j'ai une grande soirée à Zurich samedi, et demain je vais partir, alors à la prochaine
Merci je je

Dudy · mai 2017

Bonsoir Jerome
voici le résultat de ton exemple de script, genial

GALLERY MASONRY BOX OVERLAY

je-evrard · mai 2017

Beau boulot Dudy comme d'hab !

Widget raw html (brut html) la trousse à outil pour shortcodes

Réponses