En el anterior post vimos como añadir fuera del editor de posts/páginas y widgets un shortcode en wordpress, por ejemplo en un archivo PHP del theme. Así que, para seguir con los “shortcodes” enganchamos hoy con algo que puede ser muy útil y es crear nuestros propios shortcodes.

Vamos a crear el shortcode “info” para darle estilos a un texto, sería algo así:
[shortcode]Texto dentro del shortcode[/shortcode]

Lo primero que haremos es abrir el archivo functions.php de nuestro theme y añadimos el siguiente código:


#Shortcode estilos texto
function textinfo( $atts, $content = null ) {
return '<div class="textinfo">' . $content . '</div>';
}
add_shortcode( 'info', 'textinfo' );

El código se compone de una función llamada “textinfo”, en este caso, que contiene un DIV con una clase a la que le daremos estilos en nuestro CSS “style.css”. Luego se indica el nombre que tendrá el shortcode (info) asociado a la función (textinfo).

Luego abrimos nuestro CSS, por lo general style.css y le damos los estilo que queramos a nuestro shortcode. Por ejemplo algo así:

.textinfo {
font-family: Georgia, "Times New Roman", Times, serif;
font size: 1.1em;
font-style:italic;
margin: 5px 0;
padding: 15px 10px;
text-align:center;
background: #0099FF;
color: #fff;
}

Y ya hemos terminado con nuestro shortcode utilizado en este ejemplo. Como ves, no es muy complicado y puedes crear los shortcodes que necesites, tanto para estilos como para otros usos como los de insertar vídeos, estilos para imágenes, listas, botones, etc.

Antes de terminar, veamos nuestro shortcode en funcionamiento. Resultado:
[info]Texto dentro del shortcode “info” [/info]

Deja un comentario

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.