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

je-evrard · 24/05/2017 11:47:43

Le widget raw html

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)

Les Shortcodes c'est quoi ?

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

Des shortcodes dans son thème

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]

shorcode 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 · 24/05/2017 13:29:49

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 · 24/05/2017 13:33:06

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

Dudy · 24/05/2017 13:36:44

Cool wink
merci le wizard tongue

je-evrard · 24/05/2017 15:23:02

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 · 24/05/2017 21:08:32

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 · 28/05/2017 22:23:23

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

GALLERY MASONRY BOX OVERLAY

wink

Dernière modification par Dudy (19/01/2018 14:56:54)

je-evrard · 30/05/2017 16:12:04

Beau boulot Dudy comme d'hab ! smile

PluXml.org

#1 24/05/2017 11:47:43