{"id":2135,"date":"2019-01-02T16:08:38","date_gmt":"2019-01-02T15:08:38","guid":{"rendered":"https:\/\/www.profesionalhosting.com\/blog\/?p=2135"},"modified":"2023-04-25T13:35:25","modified_gmt":"2023-04-25T11:35:25","slug":"shortcodes-para-wordpress","status":"publish","type":"post","link":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/","title":{"rendered":"Shortcodes para WordPress"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_79_2 ez-toc-wrap-left-text counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Tabla de contenidos<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Alternar tabla de contenidos\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Que_son_los_shortcodes_para_WordPress\" >Qu\u00e9 son los shortcodes para WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Mejores_plugin_para_Shortcodes\" >Mejores plugin para Shortcodes<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_ultimate\" >Shortcodes ultimate<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_Pro\" >Shortcodes Pro<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#All_in_one_Shortcodes\" >All in one Shortcodes<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Creacion_de_shortcodes\" >Creaci\u00f3n de shortcodes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#La_API_de_shortcodes\" >La API de shortcodes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Sintaxis_formal_de_los_shortcodes_para_WordPress\" >Sintaxis formal de los shortcodes para WordPress<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Nombres\" >Nombres<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Atributos\" >Atributos<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Funcionamiento_de_los_shortcodes_para_WordPress\" >Funcionamiento de los shortcodes para WordPress<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_para_WordPress_simples\" >Shortcodes para WordPress simples<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#1-_Crear_la_funcion_callback\" >1.- Crear la funci\u00f3n callback<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#2-_Registrar_el_shortcode\" >2.- Registrar el shortcode<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#3-_Unir_la_funcion_a_una_accion_de_WordPress\" >3.- Unir la funci\u00f3n a una acci\u00f3n de WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#4-_Probar_el_shiortcode\" >4.- Probar el shiortcode<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_para_WordPress_avanzados\" >Shortcodes para WordPress avanzados<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Los_parametros_de_los_shortcodes\" >Los par\u00e1metros de los shortcodes<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Contenido_de_los_shortcodes_para_WordPress\" >Contenido de los shortcodes para WordPress<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-20\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Usar_shortcodes_para_WordPress_en_Widgets\" >Usar shortcodes para WordPress en Widgets<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-21\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Como_anadir_shortcodes_para_WordPress_sin_conocer_la_sintaxis_necesaria\" >C\u00f3mo a\u00f1adir shortcodes para WordPress sin conocer la sintaxis necesaria<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-22\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Crear_un_archivo_de_JavaScript_para_el_boton\" >Crear un archivo de JavaScript para el bot\u00f3n<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-23\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Registrar_el_boton_y_el_plugin_TinyMCE\" >Registrar el bot\u00f3n y el plugin TinyMCE<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-24\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Como_usar_el_boton\" >C\u00f3mo usar el bot\u00f3n<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-25\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Algunos_shortcodes_que_pueden_resultarte_utiles\" >Algunos shortcodes que pueden resultarte \u00fatiles<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-26\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Boton_de_enlaces\" >Bot\u00f3n de enlaces<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-27\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Menu_de_WordPress\" >Men\u00fa de WordPress<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-28\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Google_Maps\" >Google Maps<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-29\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Google_Charts\" >Google Charts<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-30\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Incrustar_un_PDF\" >Incrustar un PDF<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-31\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Plugins_de_Shortcodes_para_WordPress\" >Plugins de Shortcodes para WordPress<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-32\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_ultimate-2\" >Shortcodes ultimate<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-33\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#J_Shortcodes\" >J Shortcodes<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-34\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcode_Exec_PHP\" >Shortcode Exec PHP<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-35\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Shortcodes_UI\" >Shortcodes UI<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-36\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#Ventajas_y_desventajas_de_los_shortcodes\" >Ventajas y desventajas de los shortcodes<\/a><\/li><\/ul><\/nav><\/div>\n<p>Los shortocodes para WordPress se introdujeron en la versi\u00f3n 2.5 y desde entonces han demostrado ser una de las caracter\u00edsticas m\u00e1s \u00fatiles de la plataforma. El usuario medio que act\u00faa como editor tiene la capacidad de publicar contenido din\u00e1mico utilizando macros, sin la necesidad de conocimientos de programaci\u00f3n.<\/p>\n<p>Cuando se inserta un shortcode en una publicaci\u00f3n o p\u00e1gina de WordPress, se reemplaza con otro contenido. En otras palabras, le pedimos a WordPress que busque la macro que est\u00e1 entre corchetes ([]) y la reemplace con el contenido din\u00e1mico apropiado, que es producido por una funci\u00f3n de PHP.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Que_son_los_shortcodes_para_WordPress\"><\/span>Qu\u00e9 son los shortcodes para WordPress<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>En pocas palabras, <strong>un shortcode es un atajo<\/strong>. Son bloques de c\u00f3digo espec\u00edficos de WordPress que te permiten ahorrar tiempo y hacer cosas que de otro modo requerir\u00edan conocimientos t\u00e9cnicos m\u00e1s complejos y espec\u00edficos y posiblemente grandes cantidades de c\u00f3digo. Al a\u00f1adir c\u00f3digos cortos a tus temas o complementos, har\u00e1s que el uso sea mucho m\u00e1s f\u00e1cil e intuitivo.<\/p>\n<p>[bctt tweet=\u00bb&#x2b50;&#x2b50;&#x2b50;&#x2b50;&#x2b50; #ShortCodes, buenos, bonitos y r\u00e1pidos para dar color a tu web!!\u00bb username=\u00bbhostingyvps \u200f\u00bb]<\/p>\n<p><strong>Por ejemplo, podr\u00edas disponer de un shortcode que fuera [most_popular_post]<\/strong> y que, cuando se escribe exactamente as\u00ed, mostrar\u00eda la publicaci\u00f3n m\u00e1s popular de tu blog en el lugar exacto en el que lo hayas escrito.<\/p>\n<p>Si quisieras hacer esto manualmente, tendr\u00edas que escribir algo de c\u00f3digo HTML, as\u00ed como cambiarlo, tambi\u00e9n manualmente, cuando la popularidad de las publicaciones cambiara. Un shortcode <strong>elimina la necesidad de tanto trabajo y te simplifica mucho las cosas.<\/strong><\/p>\n<p>En resumen, <strong>un shortcode es un c\u00f3digo espec\u00edfico de WordPress que te da la posibilidad hacer cosas ingeniosas con poco esfuerzo<\/strong>. Los shortcodes para WordPress pueden insertar un archivo o crear objetos que normalmente requerir\u00edan un mont\u00f3n de c\u00f3digo complicado y lioso, en una sola l\u00ednea.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Mejores_plugin_para_Shortcodes\"><\/span>Mejores plugin para Shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>WordPress nos da la facilidad de <strong>incluir un Shorcode de forma r\u00e1pida y sencilla<\/strong>, a trav\u00e9s de plugins, <strong>sin necesidad de programar ni conocer la sintaxis<\/strong>. Solo buscamos el Shortcode que queremos usar para hacer X funci\u00f3n, y listo.<\/p>\n<p><strong>Nuestra selecci\u00f3n de estos plugins son:<\/strong><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Shortcodes_ultimate\"><\/span>Shortcodes ultimate<a href=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-2136 size-full\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59.png\" alt=\"\" width=\"970\" height=\"509\" srcset=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59.png 970w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59-300x157.png 300w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59-768x403.png 768w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59-696x365.png 696w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59-800x420.png 800w\" sizes=\"(max-width: 970px) 100vw, 970px\" \/><\/a><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Este es <strong>mi complemento favorito en cuanto a plugins de Shortcodes para WordPress<\/strong>. Con este plugin pondremos <strong>crear de forma muy sencilla muchos tipos diferentes de Shortcodes<\/strong> desde el propio editor de WordPress.<\/p>\n<p>Adem\u00e1s viene con <strong>dos versiones una gratuita y otra de pago<\/strong>. Con la versi\u00f3n gratuita es bastante completa pero siempre tendr\u00e1s la opci\u00f3n de tener la de pago.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Shortcodes_Pro\"><\/span>Shortcodes Pro<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><a href=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-15-57-24.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2137 size-full\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-15-57-24.png\" alt=\"\" width=\"595\" height=\"404\" srcset=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-15-57-24.png 595w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-15-57-24-300x204.png 300w\" sizes=\"(max-width: 595px) 100vw, 595px\" \/><\/a>Shortcodes PRO es <strong>otro fant\u00e1stico plugin que permite la creaci\u00f3n r\u00e1pida y sencilla de peque\u00f1os codes<\/strong> en nuestro WordPress.<\/p>\n<p>Podemos usarlo desde el propio editor de WordPress, por lo que es un perfecto <strong>sustituto de Shortcode Ultimate<\/strong><\/p>\n<h3><span class=\"ez-toc-section\" id=\"All_in_one_Shortcodes\"><\/span>All in one Shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><a href=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-16-04-18.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-2138 size-full\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-16-04-18.png\" alt=\"\" width=\"599\" height=\"374\" srcset=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-16-04-18.png 599w, https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-16-04-18-300x187.png 300w\" sizes=\"(max-width: 599px) 100vw, 599px\" \/><\/a>Este es nuestro tercer plugin ganador, de nuestros plugins de Shortcode para WordPress. Este viene de la mano de All In One, con este plugin <strong>podremos a\u00f1adir diversos Shorts con infinidad de colores y tama\u00f1os.<\/strong><\/p>\n<p>Adem\u00e1s claro est\u00e1, <strong>todo compatible con WordPress.<\/strong><\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Creacion_de_shortcodes\"><\/span>Creaci\u00f3n de shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>L<strong>a manera de crear shortcodes es utilizar la API dedicada de WordPress<\/strong>. Funcionan en gran medida del mismo modo que los filtros de WordPress. Debes definir una funci\u00f3n de controlador que analiza el shortcode y devuelve algunos resultados. Despu\u00e9s se registra el shortcode utilizando la funci\u00f3n add_shortcut (). Una funci\u00f3n de manejador de accesos directos acepta hasta tres argumentos:<\/p>\n<ol>\n<li>$atts: <strong>matriz de atributos de shortcode<\/strong><\/li>\n<li>$content: <strong>cualquier contenido albergado por el shortcode<\/strong><\/li>\n<li>$code: <strong>el nombre del shortcode (Por lo general se usa cuando el mismo controlador controla varios shortcodes)<\/strong><\/li>\n<\/ol>\n<p>Como esto puede resultar un poco confuso si no eres una persona familiarizada con este tipo de lenguaje, incluimos algunos ejemplos para identificar los<strong> tres tipos de argumentos mencionados<\/strong>. En los <strong>ejemplos los wputs son hipot\u00e9ticos.<\/strong><\/p>\n<p>[wptuts]<\/p>\n<p>$atts = array()<\/p>\n<p>$content = null<\/p>\n<p>1<\/p>\n<p>[wptuts]Lorem ipsum dolor sit amet[\/wptuts]<\/p>\n<p>$atts = array()<\/p>\n<p>$content = Lorem ipsum dolor sit amet<\/p>\n<p>1<\/p>\n<p>[wptuts id=&#8217;555&#8242; name=&#8217;some name&#8217;]<\/p>\n<p>$atts = array(&#8216;id&#8217; =&gt; &#8216;555&#8217;, &#8216;name&#8217; =&gt; &#8216;some name&#8217;)<\/p>\n<p>$content = null<\/p>\n<p>1<\/p>\n<p>[wptuts id=&#8217;555&#8242;]Lorem ipsum dolor sit amet[\/wptuts]<\/p>\n<p>$atts = array(&#8216;id&#8217; =&gt; &#8216;555&#8217;)<\/p>\n<p>$content = Lorem ipsum dolor sit amet<\/p>\n<p>Esto deber\u00eda darte una ligera idea de c\u00f3mo los argumentos se trasladan al controlador de shortcodes.<\/p>\n<p><strong>Recuerda que los shortcodes para WordPress son cerrados. <\/strong>As\u00ed que <strong>[wptuts] es lo mismo que [\/wptuts]<\/strong>. Solo necesitas a\u00f1adir estas etiquetas cuando hay contenido entre ambas.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"La_API_de_shortcodes\"><\/span>La API de shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>La API de shortcodes para WordPress es un conjunto simple de funciones que te ayuda a crear atajos de WordPress para su uso en publicaciones y p\u00e1ginas. Por ejemplo, el siguiente shortcode colocado en el cuerpo de una publicaci\u00f3n o p\u00e1gina, agregar\u00eda una galer\u00eda de fotos con im\u00e1genes adjuntas a esa publicaci\u00f3n o p\u00e1gina:<\/p>\n<div id='gallery-1' class='gallery galleryid-2135 gallery-columns-3 gallery-size-thumbnail'><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/attachment\/captura-de-pantalla-de-2019-01-02-13-37-59\/'><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-13-37-59-150x150.png\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" \/><\/a>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/attachment\/captura-de-pantalla-de-2019-01-02-15-57-24\/'><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-15-57-24-150x150.png\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" \/><\/a>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/attachment\/captura-de-pantalla-de-2019-01-02-16-04-18\/'><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/Captura-de-pantalla-de-2019-01-02-16-04-18-150x150.png\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" \/><\/a>\n\t\t\t<\/div><\/figure><figure class='gallery-item'>\n\t\t\t<div class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/attachment\/shortcodes-de-wordpress\/'><img loading=\"lazy\" decoding=\"async\" width=\"150\" height=\"150\" src=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress-150x150.jpg\" class=\"attachment-thumbnail size-thumbnail\" alt=\"\" \/><\/a>\n\t\t\t<\/div><\/figure>\n\t\t<\/div>\n\n<p>La API, adem\u00e1s, permite a los desarrolladores de plugins crear tipos especiales de contenido que los usuarios pueden adjuntar a ciertas p\u00e1ginas al a\u00f1adir el shortcode correspondiente en el texto de la p\u00e1gina.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Sintaxis_formal_de_los_shortcodes_para_WordPress\"><\/span>Sintaxis formal de los shortcodes para WordPress<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Los shortcodes para WordPress no emplean caracteres especiales de la mima manera que el lenguaje HTML. Puede que los corchetes te parezcan algo parecido, pero en realidad no forman parte de ning\u00fan idioma.<\/p>\n<p>Por ejemplo<\/p>\n<p><strong>[ gallery ]\u00a0<\/strong><\/p>\n<p>La API de shortcodes reconoce el shortcode galery como s\u00edmbolo especial porque es, de hecho, un shortcode registrado. Por otra parte, cuando los corchetes albergan un shortcode no registrado, la API directamente los ignora.<\/p>\n<p>Por ejemplo <strong>[randomthing]<\/strong><\/p>\n<p>El s\u00edmbolo randomthing con sus corchetes incluidos ser\u00e1n ignorados por la API porque no forman parte de ning\u00fan shortcode registrado.<\/p>\n<p>En un mundo perfecto, la API podr\u00eda manejar cualquier s\u00edmbolo [*]. Pero la realidad nos obliga a tener en cuenta considerar los siguientes desaf\u00edos:<\/p>\n<ul>\n<li>Se aceptan corchetes en HTML y no siempre son c\u00f3digos cortos<\/li>\n<li>Se permiten llaves angulares dentro de c\u00f3digos cortos solo en situaciones limitadas<\/li>\n<li>Adem\u00e1s, todo el c\u00f3digo debe ejecutarse a trav\u00e9s de m\u00faltiples capas de filtros y analizadores personalizables antes de la salida.<\/li>\n<\/ul>\n<p>La sintaxis de shortcode suele tener este aspecto:<\/p>\n<p><strong>[nombre atributos cierre]<\/strong><\/p>\n<p><strong>[nombre atributos]<\/strong>Cualquier HTML o shortcode puede ir aqu\u00ed.<strong>[\/nombre]<\/strong><\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Nombres\"><\/span>Nombres<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Los nombres de los shortcodes para WordPress no deben contener, jam\u00e1s, los siguientes caracteres<\/p>\n<ul>\n<li><strong>Corchetes:<\/strong> [ ]<\/li>\n<li><strong>Corchetes angulares:<\/strong> &lt; &gt;<\/li>\n<li><strong>Ampersand:<\/strong> &amp;<\/li>\n<li><strong>Barra:<\/strong> \/<\/li>\n<li>Espacio en blanco: marcado por la barra espaciadora o por la tecla tab. No se admite ninguno<\/li>\n<li><strong>Caracteres no imprimibles:<\/strong> \\x00 &#8211; \\x20<\/li>\n<li><strong>Comillas simples o dobles:<\/strong> &#8216; \u00ab<\/li>\n<\/ul>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Atributos\"><\/span>Atributos<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Los atributos son opcionales. Hace falta introducir un espcio entre el nombre del shortcode y el atributo. Cuando se usa m\u00e1s de un atributo, los mismos tambi\u00e9n deben estar separados por al menos un espacio.<\/p>\n<p>Cada atributo deber\u00eda corresponderse con uno de estos formatos:<\/p>\n<ul>\n<li>attribute_name = &#8216;valor&#8217;<\/li>\n<li>attribute_name = \u00abvalor\u00bb<\/li>\n<li>attribute_name = valor<\/li>\n<li>\u00abvalor\u00bb<\/li>\n<li>valor<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>Los nombres de los atributos son opcionales y, para garantizar su compatibilidad con todas las plataformas, solo deber\u00edan contener los siguientes caracteres:<\/p>\n<ul>\n<li>Letras de la A la Z en may\u00fascula o min\u00fascula.<\/li>\n<li>D\u00edgitos del 0 al 9<\/li>\n<li><strong>Gui\u00f3n bajo:<\/strong> _<\/li>\n<li><strong>Gui\u00f3n:<\/strong> &#8211; (no permitido antes de la versi\u00f3n 4.3.0)<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p>Los nombres de los atributos no permiten la presencia de espacios. Aunque se pueden usar espacios, de manera opcional, entre el nomre y el signo igual (=). Tambi\u00e9n entre el signo igual y el valor.<\/p>\n<p>Los valores de los atributos nunca deben contener los siguientes caracteres:<\/p>\n<ul>\n<li><strong>Corchetes:<\/strong> [ ]<\/li>\n<li><strong>Comillas:<\/strong> \u00bb &#8216;<\/li>\n<\/ul>\n<p>Los valores tampoco deben contener espacios.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Funcionamiento_de_los_shortcodes_para_WordPress\"><\/span>Funcionamiento de los shortcodes para WordPress<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Todos los temas de WordPress tienen un archivo functions.php- Esto es lo que debes editar para crear un shortcode de manera manual. Y debes hacerlo siguiendo dos pasos b\u00e1sicos:<\/p>\n<ol>\n<li><strong>Crear una funci\u00f3n PHP primaria<\/strong><\/li>\n<li><strong>Crear el conector add_shortcode para unir la funci\u00f3n PHP primaria a WordPress<\/strong><\/li>\n<\/ol>\n<p>Por ejemplo:<\/p>\n<p>function test_shortcode() {<\/p>\n<p>return &#8216;&lt;b&gt;Esto es un test de shortcode&lt;\/b&gt;&#8217;<\/p>\n<p>}<\/p>\n<p>add_shortcode( &#8216;test&#8217;, &#8216;test_shortcode&#8217; );<\/p>\n<p>function test_shortcode() {<\/p>\n<p>return &#8216;&lt;b&gt;Esto es un test de shortcode&lt;\/b&gt;&#8217;<\/p>\n<p>}<\/p>\n<p>add_shortcode( &#8216;test&#8217;, &#8216;test_shortcode&#8217; );<\/p>\n<p>mediante este c\u00f3digo creamos un c\u00f3digo muy simple. Al insertarlo en tu editor con el nombre entre corchetes : [test], har\u00e1 que el texto \u201cEsto es un test de shortcode\u201d aparezca en tu post de manera autom\u00e1tica.<\/p>\n<p>Por supuesto, esto es un ejemplo muy simple que puede complicarse hasta el infinito. Y personalizarse. La cuesti\u00f3n es que cuando creas shortcodes para WordPress, tu blog te devuelve el resultado que quieras, tan complejo como lo quieras. Pero t\u00fa solo tienes que escribir una palabra.<\/p>\n<p>Si no te f\u00edas de tu destreza y prefieres no tocar el archivo functions.php puedes usar el plugin Code Snippets. Se trata de un widget que hace m\u00e1s f\u00e1cil la edici\u00f3n del archivo. Y no se usa solo para shortcodes, sino para cualquier funci\u00f3n que se te ocurra a\u00f1adir al blog. Adem\u00e1s, si usas el Code Snippets, no perder\u00e1s las actualizaciones aunque cambies de tema.<\/p>\n<p><strong>Pongamos otro ejemplo:<\/strong><\/p>\n<p>Digamos que queremos mostrar las publicaciones m\u00e1s recientes en una publicaci\u00f3n determinada. Podr\u00edamos usar algo como esto:<\/p>\n<p align=\"center\">[recent-posts]<\/p>\n<p>Para un <strong>shortocode m\u00e1s avanzado<\/strong>, podr\u00edamos establecer la cantidad de publicaciones que se mostrar\u00e1n al establecer un par\u00e1metro dado, <strong>por ejemplo:<\/strong><\/p>\n<p>\u0007\b<\/p>\n<p align=\"center\">[recent-posts posts=\u00bb5&#8243;]<\/p>\n<p>Y, si vamos un paso m\u00e1s all\u00e1. Tambi\u00e9n podemos establecer un encabezado para lista de posts m\u00e1s recientes:<\/p>\n<p align=\"center\">[recent-posts posts=\u00bb5&#8243;]Posts Heading[\/recent-posts]<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Shortcodes_para_WordPress_simples\"><\/span>Shortcodes para WordPress simples<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Como hemos visto un poco m\u00e1s arriba, crear un shortcode para que tu blog muestre los posts m\u00e1s recientes en una entrada es muy sencillo y no requiere ning\u00fan conocimiento de PHP. Los pasos b\u00e1sicos son:<\/p>\n<ol>\n<li><strong>Crear la funci\u00f3n a la que WordPress acudir\u00e1 cuando encuentre un shortcode detrminado.<\/strong><\/li>\n<li><strong>Registre el shorcode d\u00e1ndole un nombre \u00fanico.<\/strong><\/li>\n<li><strong>Unir la funci\u00f3n de registro a una acci\u00f3n de WordPress.<\/strong><\/li>\n<\/ol>\n<p>Todos los c\u00f3digos que aparecen en este tutorial se pueden colocar en functions.php o en un archivo PHP separado que se incluir\u00e1 en functions.php.<\/p>\n<h4 class=\"western\"><span class=\"ez-toc-section\" id=\"1-_Crear_la_funcion_callback\"><\/span>1.- Crear la funci\u00f3n callback<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Cuando WordPress encuentra un shortcode, lo reemplaza por un fragmento de c\u00f3digo, que es la funci\u00f3n de devoluci\u00f3n de llamada o callback. Para que nuestro shortcode de muestra de posts recientes funcione, hay que crear una funci\u00f3n que recupera las publicaciones recientes de la base de datos.<\/p>\n<p>function recent_posts_function() {<\/p>\n<p>query_posts(array(&#8216;orderby&#8217; =&gt; &#8216;date&#8217;, &#8216;order&#8217; =&gt; &#8216;DESC&#8217; , &#8216;showposts&#8217; =&gt; 1));<\/p>\n<p>if (have_posts()) :<\/p>\n<p>while (have_posts()) : the_post();<\/p>\n<p>$return_string = &#8216;&lt;a href=\u00bb&#8216;.get_permalink().'\u00bb&gt;&#8217;.get_the_title().'&lt;\/a&gt;&#8217;;<\/p>\n<p>endwhile;<\/p>\n<p>endif;<\/p>\n<p>wp_reset_query();<\/p>\n<p>return $return_string;<\/p>\n<p>}<\/p>\n<p>Como se muestra en el ejemplo anterior, estamos consultando la base de datos para obtener la \u00faltima publicaci\u00f3n y devolver una cadena con un enlace a ella. Vale la pena se\u00f1alar que la funci\u00f3n de callback no imprime nada, sino que devuelve una cadena.<\/p>\n<h4 class=\"western\"><span class=\"ez-toc-section\" id=\"2-_Registrar_el_shortcode\"><\/span>2.- Registrar el shortcode<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Ahora, hay que decirle a WordPress que la funci\u00f3n anterior es en realidad un shortcode:<\/p>\n<p>function register_shortcodes(){<\/p>\n<p>add_shortcode(&#8216;recent-posts&#8217;, &#8216;recent_posts_function&#8217;);<\/p>\n<p>}Copy<\/p>\n<p>Si WordPress encuentra en un post el shortcode [recent-posts], entonces la funci\u00f3n recent posts () se pone en funcionamiento autom\u00e1ticamente. Para evitar conflictos es necesario asegurarse de que el nombre del shortcode es \u00fanico.<\/p>\n<h4 class=\"western\"><span class=\"ez-toc-section\" id=\"3-_Unir_la_funcion_a_una_accion_de_WordPress\"><\/span>3.- Unir la funci\u00f3n a una acci\u00f3n de WordPress<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Para que nuestra funci\u00f3n asignada a un shortcode se ejecute al usar ese shortcode, debemos unirla a una acci\u00f3n de inicializaci\u00f3n de WordPress.<\/p>\n<p>add_action( &#8216;init&#8217;, &#8216;register_shortcodes&#8217;);Copy<\/p>\n<h4 class=\"western\"><span class=\"ez-toc-section\" id=\"4-_Probar_el_shiortcode\"><\/span>4.- Probar el shiortcode<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Nuestro shortcode simple deber\u00eda estar listo, as\u00ed que el siguiente paso es probar que funciona correctamente. Para hacerlo puedes crear una nueva prublicaci\u00f3n en tu blog o usar una ya existente. Lo \u00fanico que tienes que hacer es colocar la siguiente l\u00ednea en alg\u00fan lugar del post:<\/p>\n<p>[recent-posts]Copy<\/p>\n<p>Publica el post y accede a \u00e9l a trav\u00e9s del buscador. Deber\u00edas ver, dentro del post, un enlace a los posts m\u00e1s recientes.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Shortcodes_para_WordPress_avanzados\"><\/span>Shortcodes para WordPress avanzados<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<h4 class=\"western\"><span class=\"ez-toc-section\" id=\"Los_parametros_de_los_shortcodes\"><\/span>Los par\u00e1metros de los shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>Los shortcodes para WordPress son flexibles porque nos permiten agregar par\u00e1metros personalizados para hacerlos m\u00e1s funcionales. Digamos que queremos mostrar un cierto n\u00famero de publicaciones recientes. Para hacer esto, necesitamos a\u00f1adir una opci\u00f3n adicional a nuestro c\u00f3digo corto que especifique cu\u00e1ntas publicaciones recientes se mostrar\u00e1n.<\/p>\n<p>Tenemos que usar dos funciones. La primera es la funci\u00f3n shortcode_atts () incorporada de WordPress, que combina los atributos de shortcode del usuario con atributos nativos y completa los valores predeterminados donde sea necesario. La segunda funci\u00f3n es la funci\u00f3n de extracci\u00f3n () PHP, que hace lo que su nombre sugiere: extrae los atributos de c\u00f3digo corto.<\/p>\n<p>Ampliando nuestra funci\u00f3n de callback, agregamos un argumento, que es una matriz de atributos de la que extraemos el par\u00e1metro para el n\u00famero de publicaciones. Luego consultamos la base de datos para obtener el n\u00famero deseado de publicaciones y creamos una lista HTML para mostrarlas. Algo as\u00ed:<\/p>\n<p>function recent_posts_function($atts){<\/p>\n<p>extract(shortcode_atts(array(<\/p>\n<p>&#8216;posts&#8217; =&gt; 1,<\/p>\n<p>), $atts));<\/p>\n<p>$return_string = &#8216;&lt;ul&gt;&#8217;;<\/p>\n<p>query_posts(array(&#8216;orderby&#8217; =&gt; &#8216;date&#8217;, &#8216;order&#8217; =&gt; &#8216;DESC&#8217; , &#8216;showposts&#8217; =&gt; $posts));<\/p>\n<p>if (have_posts()) :<\/p>\n<p>while (have_posts()) : the_post();<\/p>\n<p>$return_string .= &#8216;&lt;li&gt;&lt;a href=\u00bb&#8216;.get_permalink().'\u00bb&gt;&#8217;.get_the_title().'&lt;\/a&gt;&lt;\/li&gt;&#8217;;<\/p>\n<p>endwhile;<\/p>\n<p>endif;<\/p>\n<p>$return_string .= &#8216;&lt;\/ul&gt;&#8217;;<\/p>\n<p>wp_reset_query();<\/p>\n<p>return $return_string;<\/p>\n<p>}Si omitimos escoger una opci\u00f3n, 1 es el valor predeterminado. De la misma manera, podemos agregar m\u00e1s atributos, permitiendo que los c\u00f3digos cortos acepten m\u00faltiples par\u00e1metros. Gracias a esta funci\u00f3n mejorada, podemos establecer cu\u00e1ntas publicaciones mostrar:<\/p>\n<p>[recent-posts posts=\u00bb5&#8243;]<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Contenido_de_los_shortcodes_para_WordPress\"><\/span>Contenido de los shortcodes para WordPress<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Podemos llevar nuestro shortcode un paso m\u00e1s all\u00e1 y agregar la capacidad de pasar alg\u00fan contenido como argumento, que en este caso ser\u00e1 un encabezado de la lista de publicaciones recientes. Para hacer esto, usamos un segundo par\u00e1metro, $ contenido en la funci\u00f3n de callback y lo agregamos como un encabezado h3 antes de la lista. La nueva funci\u00f3n es la siguiente:<\/p>\n<p>function recent_posts_function($atts, $content = null) {<\/p>\n<p>extract(shortcode_atts(array(<\/p>\n<p>&#8216;posts&#8217; =&gt; 1,<\/p>\n<p>), $atts));<\/p>\n<p>$return_string = &#8216;&lt;h3&gt;&#8217;.$content.'&lt;\/h3&gt;&#8217;;<\/p>\n<p>$return_string .= &#8216;&lt;ul&gt;&#8217;;<\/p>\n<p>query_posts(array(&#8216;orderby&#8217; =&gt; &#8216;date&#8217;, &#8216;order&#8217; =&gt; &#8216;DESC&#8217; , &#8216;showposts&#8217; =&gt; $posts));<\/p>\n<p>if (have_posts()) :<\/p>\n<p>while (have_posts()) : the_post();<\/p>\n<p>$return_string .= &#8216;&lt;li&gt;&lt;a href=\u00bb&#8216;.get_permalink().'\u00bb&gt;&#8217;.get_the_title().'&lt;\/a&gt;&lt;\/li&gt;&#8217;;<\/p>\n<p>endwhile;<\/p>\n<p>endif;<\/p>\n<p>$return_string .= &#8216;&lt;\/ul&gt;&#8217;;<\/p>\n<p>wp_reset_query();<\/p>\n<p>return $return_string;<\/p>\n<p>}<span style=\"color: #777777;\">\u00a0<\/span><\/p>\n<p>\u0007\b<\/p>\n<p>Este tipo de c\u00f3digo abreviado es similar a una etiqueta HTML. Adjuntamos el contenido en un shortcode de apertura y cierre:<\/p>\n<p>[recent-posts posts=\u00bb5&#8243;]This is the list heading[\/recent-posts]Copy<\/p>\n<p>The result is the same that in the last example, except for the new heading for the list of posts:<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Usar_shortcodes_para_WordPress_en_Widgets\"><\/span>Usar shortcodes para WordPress en Widgets<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Los shortcodes se ignoran en los widgets de la barra lateral de WordPress por defecto.<\/p>\n<p>Aunque la plataforma nos da la posibilidad de habilitar esta funcionalidad con una sola l\u00ednea de c\u00f3digo. Para poder agregar c\u00f3digos cortos en los widgets, hay que a\u00f1adir lo siguiente:<\/p>\n<p>add_filter(&#8216;widget_text&#8217;, &#8216;do_shortcode&#8217;);Copy<\/p>\n<p>Ahora, sin tener que cambiar nada m\u00e1s, el shortcode se mostrar\u00e1 correctamente en los widgets:<\/p>\n<p>Del mismo modo, podemos habilitar c\u00f3digos cortos en los comentarios:<\/p>\n<p>add_filter( &#8216;comment_text&#8217;, &#8216;do_shortcode&#8217; );Copy<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Como_anadir_shortcodes_para_WordPress_sin_conocer_la_sintaxis_necesaria\"><\/span>C\u00f3mo a\u00f1adir shortcodes para WordPress sin conocer la sintaxis necesaria<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Es cierto que los shortcodes para WordPress son una forma \u00fatil de a\u00f1adir contenido din\u00e1mico a las publicaciones. Pero crearlos desde cero puede ser un poco confuso para el usuario medio. Sobre todo el caso de los shortcodes m\u00e1s avanzados que incluyen varios par\u00e1metros. La mayor\u00eda de los usuarios no est\u00e1n familiarizados con la sintaxis, que se parece mucho al lenguaje HTML. Pero, lamentablemente, para trabajar con shortcodes es necesario emplear la sintaxis exacta y los atributos adecuados. De hecho, el m\u00e1s m\u00ednimo error de sintaxis har\u00e1 que el c\u00f3digo no funcione en absoluto o que funcione mal.<\/p>\n<p>Para resolver esto, podemos agregar un bot\u00f3n a la interfaz del editor de TinyMCE, permitiendo al usuario crear un shortcode con un simple clic. Hay dos pasos b\u00e1sicos para crear este bot\u00f3n:<\/p>\n<ul>\n<li><strong>Crear el archivo JavaScript para el bot\u00f3n.<\/strong><\/li>\n<li><strong>Registrar el bot\u00f3n y el archivo JavaScript<\/strong><\/li>\n<\/ul>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Crear_un_archivo_de_JavaScript_para_el_boton\"><\/span>Crear un archivo de JavaScript para el bot\u00f3n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>El archivo JavaScript se utiliza para registrar el plugin TinyMCE a trav\u00e9s de la API TinyMCE. Creamos un nuevo archivo llamado recent-posts.js en el directorio js de nuestro tema, y luego escribimos el siguiente fragmento de c\u00f3digo:<\/p>\n<p>(function() {<\/p>\n<p>tinymce.create(&#8216;tinymce.plugins.recentposts&#8217;, {<\/p>\n<p>init : function(ed, url) {<\/p>\n<p>ed.addButton(&#8216;recentposts&#8217;, {<\/p>\n<p>title : &#8216;Recent posts&#8217;,<\/p>\n<p>image : url+&#8217;\/recentpostsbutton.png&#8217;,<\/p>\n<p>onclick : function() {<\/p>\n<p>var posts = prompt(\u00abNumber of posts\u00bb, \u00ab1\u00bb);<\/p>\n<p>var text = prompt(\u00abList Heading\u00bb, \u00abThis is the heading text\u00bb);<\/p>\n<p>if (text != null &amp;&amp; text != \u2019){<\/p>\n<p>if (posts != null &amp;&amp; posts != \u2019)<\/p>\n<p>ed.execCommand(&#8216;mceInsertContent&#8217;, false, &#8216;[recent-posts posts=\u00bb&#8216;+posts+'\u00bb]&#8217;+text+'[\/recent-posts]&#8217;);<\/p>\n<p>else<\/p>\n<p>ed.execCommand(&#8216;mceInsertContent&#8217;, false, &#8216;[recent-posts]&#8217;+text+'[\/recent-posts]&#8217;);<\/p>\n<p>}<\/p>\n<p>else{<\/p>\n<p>if (posts != null &amp;&amp; posts != \u2019)<\/p>\n<p>ed.execCommand(&#8216;mceInsertContent&#8217;, false, &#8216;[recent-posts posts=\u00bb&#8216;+posts+'\u00bb]&#8217;);<\/p>\n<p>else<\/p>\n<p>ed.execCommand(&#8216;mceInsertContent&#8217;, false, &#8216;[recent-posts]&#8217;);<\/p>\n<p>}<\/p>\n<p>}<\/p>\n<p>});<\/p>\n<p>},<\/p>\n<p>createControl : function(n, cm) {<\/p>\n<p>return null;<\/p>\n<p>},<\/p>\n<p>getInfo : function() {<\/p>\n<p>return {<\/p>\n<p>longname : \u00abRecent Posts\u00bb,<\/p>\n<p>author : &#8216;Konstantinos Kouratoras&#8217;,<\/p>\n<p>authorurl : &#8216;http:\/\/www.kouratoras.gr&#8217;,<\/p>\n<p>infourl : \u2019,<\/p>\n<p>version : \u00ab1.0\u00bb<\/p>\n<p>};<\/p>\n<p>}<\/p>\n<p>});<\/p>\n<p>tinymce.PluginManager.add(&#8216;recentposts&#8217;, tinymce.plugins.recentposts);<\/p>\n<p>})();<\/p>\n<p>De esta manera, creamos un nuevo complemento al que asignamos el nombre del plugin y sus atributos mediante el m\u00e9todo tinymce.create (). La parte m\u00e1s importante de este c\u00f3digo es la funci\u00f3n init (), donde definimos un nombre, un archivo para el icono y un controlador para el bot\u00f3n que usa la funci\u00f3n onclick ().<\/p>\n<p>En las dos primeras l\u00edneas de la funci\u00f3n onclick (), se le solicita al usuario que ingrese los par\u00e1metros para el n\u00famero de publicaciones y el encabezado de la lista del c\u00f3digo corto. Luego, dependiendo de los valores de estos par\u00e1metros, se inserta en el editor el formulario de shortcode apropiado.<\/p>\n<p>Finalmente, nuestro complemento TinyMCE se agrega al PluginManager mediante la funci\u00f3n add (). As\u00ed, hemos integrado con \u00e9xito el shortcode [posts recientes] en un tema de WordPress.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Registrar_el_boton_y_el_plugin_TinyMCE\"><\/span>Registrar el bot\u00f3n y el plugin TinyMCE<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Despu\u00e9s de crear el archivo JavaScript, necesitamos registrarlo junto con el bot\u00f3n de shortcode. Por lo tanto, creamos dos funciones y las vinculamos a los filtros de WordPress correspondientes.<\/p>\n<p>La primera funci\u00f3n se llama register_button () y coloca el shortcode en la barra de botones, agregando un divisor entre el nuevo bot\u00f3n y los existentes:<\/p>\n<p>function register_button( $buttons ) {<\/p>\n<p>array_push( $buttons, \u00ab|\u00bb, \u00abrecentposts\u00bb );<\/p>\n<p>return $buttons;<\/p>\n<p>}<\/p>\n<p>The second function, add_plugin(), is related to the path and name of the JavaScript file:<\/p>\n<p>function add_plugin( $plugin_array ) {<\/p>\n<p>$plugin_array[&#8216;recentposts&#8217;] = get_template_directory_uri() . &#8216;\/js\/recent-posts.js&#8217;;<\/p>\n<p>return $plugin_array;<\/p>\n<p>}<\/p>\n<p>El siguiente paso es agregar un filtro con las funciones anteriores. La funci\u00f3n register_button () est\u00e1 vinculada al filtro mce_buttons, que se ejecuta cuando el editor carga los complementos, y add_plugin () est\u00e1 vinculada al filtro mce_external_plugins, que se ejecuta cuando los botones est\u00e1n a punto de cargarse:<\/p>\n<p>function my_recent_posts_button() {<\/p>\n<p>if ( ! current_user_can(&#8216;edit_posts&#8217;) &amp;&amp; ! current_user_can(&#8216;edit_pages&#8217;) ) {<\/p>\n<p>return;<\/p>\n<p>}<\/p>\n<p>if ( get_user_option(&#8216;rich_editing&#8217;) == &#8216;true&#8217; ) {<\/p>\n<p>add_filter( &#8216;mce_external_plugins&#8217;, &#8216;add_plugin&#8217; );<\/p>\n<p>add_filter( &#8216;mce_buttons&#8217;, &#8216;register_button&#8217; );<\/p>\n<p>}<\/p>\n<p>}<\/p>\n<p>La funci\u00f3n anterior no lleva a cabo ninguna acci\u00f3n si el usuario no tiene permiso para editar publicaciones o p\u00e1ginas o si el usuario no est\u00e1 en modo de editor visual.<\/p>\n<p>Finalmente, enganchamos la funci\u00f3n en la acci\u00f3n de inicializaci\u00f3n de WordPress para que se ejecute cuando se carga una p\u00e1gina:<\/p>\n<p>add_action(&#8216;init&#8217;, &#8216;my_recent_posts_button&#8217;);Copy<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Como_usar_el_boton\"><\/span>C\u00f3mo usar el bot\u00f3n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Para comprobar que el bot\u00f3n desde el que crear\u00e1s los shorcodes para WordPress funciona correctamente, hay que crear una nueva publicaci\u00f3n o editar una existente. Al hacerlo, deber\u00eda aparecer un nuevo bot\u00f3n, con el \u00edcono que establecimos antes, a la izquierda de la primera l\u00ednea de los botones de TinyMCE.<\/p>\n<p>Si hacemos clic en ese bot\u00f3n, aparecer\u00e1 un cuadro de di\u00e1logo que nos solicita que escribamos el par\u00e1metro para el n\u00famero de publicaciones que necesita nuestro shortcode. En otras palabras, si queremos que aparezcan cinco publicaciones, escribiremos un 5 en ese cuadro de di\u00e1logo.<\/p>\n<p>Despu\u00e9s de insertar el n\u00famero de publicaciones, aparece un segundo cuadro de di\u00e1logo que nos solicita que escribamos en el encabezado de la lista.<\/p>\n<p>No pasa nada si no escribimos nada en esos espacios. Si los dejamos en blanco, Si cualquier par\u00e1metro se deja en blanco, no aparecer\u00e1n en el resultado devuelto por el shortcode. Recuerda que, si no ponemos nada en \u201cn\u00famero de publicaciones\u201d, aparecer\u00e1 una sola por defecto.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Algunos_shortcodes_que_pueden_resultarte_utiles\"><\/span>Algunos shortcodes que pueden resultarte \u00fatiles<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>A partir de aqu\u00ed encontrar\u00e1s los c\u00f3digos para algunos shortcodes para WordPress que llevar\u00e1n tu blog un paso m\u00e1s all\u00e1.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Boton_de_enlaces\"><\/span>Bot\u00f3n de enlaces<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>function linkbutton_function( $atts, $content = null ) {<\/p>\n<p>return &#8216;&lt;button type=\u00bbbutton\u00bb&gt;&#8217;.do_shortcode($content).'&lt;\/button&gt;&#8217;;<\/p>\n<p>}<\/p>\n<p>add_shortcode(&#8216;linkbutton&#8217;, &#8216;linkbutton_function&#8217;);Copy<\/p>\n<p>Use this shortcode as follows:<\/p>\n<p>[linkbutton]Click Me![\/linkbutton]Copy<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Menu_de_WordPress\"><\/span>Men\u00fa de WordPress<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Es m\u00e1s complicado, pero puedes copiarlo directamente desde aqu\u00ed.<\/p>\n<p>function menu_function($atts, $content = null) {<\/p>\n<p>extract(<\/p>\n<p>shortcode_atts(<\/p>\n<p>array( &#8216;name&#8217; =&gt; null, ),<\/p>\n<p>$atts<\/p>\n<p>)<\/p>\n<p>);<\/p>\n<p>return wp_nav_menu(<\/p>\n<p>array(<\/p>\n<p>&#8216;menu&#8217; =&gt; $name,<\/p>\n<p>&#8216;echo&#8217; =&gt; false<\/p>\n<p>)<\/p>\n<p>);<\/p>\n<p>}<\/p>\n<p>add_shortcode(&#8216;menu&#8217;, &#8216;menu_function&#8217;);Copy<\/p>\n<p>Cuando ejecutes este shorcode debes a\u00f1adir el nombre del men\u00fa que quieres usar. Y aparecer\u00e1 en el contenido que escojas (posts, widgets o comentarios, como vimos m\u00e1s arriba.<\/p>\n<p>[menu name=\u00bbmain-menu\u00bb]<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Google_Maps\"><\/span>Google Maps<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Es verdaderamente \u00fatil disponer de un shortcode para Google Maps, porque podemos insertar un mapa sin necesidad de editar el c\u00f3digo fuente.<\/p>\n<p>function googlemap_function($atts, $content = null) {<\/p>\n<p>extract(shortcode_atts(array(<\/p>\n<p>\u00abwidth\u00bb =&gt; &#8216;640&#8217;,<\/p>\n<p>\u00abheight\u00bb =&gt; &#8216;480&#8217;,<\/p>\n<p>\u00absrc\u00bb =&gt; \u2019<\/p>\n<p>), $atts));<\/p>\n<p>return &#8216;&lt;iframe width=\u00bb&#8216;.$width.'\u00bb height=\u00bb&#8216;.$height.'\u00bb src=\u00bb&#8216;.$src.&#8217;&amp;output=embed\u00bb &gt;&lt;\/iframe&gt;&#8217;;<\/p>\n<p>}<\/p>\n<p>add_shortcode(\u00abgooglemap\u00bb, \u00abgooglemap_function\u00bb);<\/p>\n<p>Cuando escribas este c\u00f3digo, recuerda que debes usar el ancho, el alto y el link de Google Maps como par\u00e1metros:<\/p>\n<p>[googlemap width=\u00bb600&#8243; height=\u00bb300&#8243; src=\u00bbhttp:\/\/maps.google.com\/maps?q=Heraklion,+Greece&amp;hl=en&amp;ll=35.327451,25.140495&amp;spn=0.233326,0.445976&amp; sll=37.0625,-95.677068&amp;sspn=57.161276,114.169922&amp; oq=Heraklion&amp;hnear=Heraklion,+Greece&amp;t=h&amp;z=12&#8243;]Copy<\/p>\n<p>El link del ejemplo existe y es el que se encuentra dentro del \u00faltimo par de comillas.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Google_Charts\"><\/span>Google Charts<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Google Charts (gr\u00e1ficos de Google) es un servicio muy \u00fatil porque permite un alto grado de personalizaci\u00f3n. A continuaci\u00f3n te dejamos un ejemplo de shortcode con m\u00faltiples atributos:<\/p>\n<p>function chart_function( $atts ) {<\/p>\n<p>extract(shortcode_atts(array(<\/p>\n<p>&#8216;data&#8217; =&gt; \u2019,<\/p>\n<p>&#8216;chart_type&#8217; =&gt; &#8216;pie&#8217;,<\/p>\n<p>&#8216;title&#8217; =&gt; &#8216;Chart&#8217;,<\/p>\n<p>&#8216;labels&#8217; =&gt; \u2019,<\/p>\n<p>&#8216;size&#8217; =&gt; &#8216;640&#215;480&#8217;,<\/p>\n<p>&#8216;background_color&#8217; =&gt; &#8216;FFFFFF&#8217;,<\/p>\n<p>&#8216;colors&#8217; =&gt; \u2019,<\/p>\n<p>), $atts));<\/p>\n<p>switch ($chart_type) {<\/p>\n<p>case &#8216;line&#8217; :<\/p>\n<p>$chart_type = &#8216;lc&#8217;;<\/p>\n<p>break;<\/p>\n<p>case &#8216;pie&#8217; :<\/p>\n<p>$chart_type = &#8216;p3&#8217;;<\/p>\n<p>break;<\/p>\n<p>default :<\/p>\n<p>break;<\/p>\n<p>}<\/p>\n<p>$attributes = \u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chd=t:&#8217;.$data.\u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chtt=&#8217;.$title.\u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chl=&#8217;.$labels.\u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chs=&#8217;.$size.\u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chf=&#8217;.$background_color.\u2019;<\/p>\n<p>$attributes .= &#8216;&amp;chco=&#8217;.$colors.\u2019;<\/p>\n<p>return &#8216;&lt;img title=\u00bb&#8216;.$title.'\u00bb src=\u00bbhttp:\/\/chart.apis.google.com\/chart?cht=&#8217;.$chart_type.\u2019.$attributes.'\u00bb alt=\u00bb&#8216;.$title.'\u00bb \/&gt;&#8217;;<\/p>\n<p>}<\/p>\n<p>add_shortcode(&#8216;chart&#8217;, &#8216;chart_function&#8217;);<\/p>\n<p>Para crear un gr\u00e1fico de quesitos con cuatro tipos de datos insertaremos la siguiente l\u00ednea:<\/p>\n<p>[chart type=\u00bbpie\u00bb title=\u00bbExample Pie Chart\u00bb data=\u00bb41.12,32.35,21.52,5.01&#8243; labels=\u00bbFirst+Label|Second+Label|Third+Label|Fourth+Label\u00bb background_color=\u00bbFFFFFF\u00bb colors=\u00bbD73030,329E4A,415FB4,DFD32F\u00bb size=\u00bb450&#215;180&#8243;]Copy<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Incrustar_un_PDF\"><\/span>Incrustar un PDF<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Se puede usar el visor de PDF de Google Documents para incrustar un PDF en neustro sitio web de WordPress mediante un shortcode. En concreto, mediente el siguiente:<\/p>\n<p>function pdf_function($attr, $url) {<\/p>\n<p>extract(shortcode_atts(array(<\/p>\n<p>&#8216;width&#8217; =&gt; &#8216;640&#8217;,<\/p>\n<p>&#8216;height&#8217; =&gt; &#8216;480&#8217;<\/p>\n<p>), $attr));<\/p>\n<p>return &#8216;&lt;iframe src=\u00bbhttp:\/\/docs.google.com\/viewer?url=&#8217; . $url . &#8216;&amp;embedded=true\u00bb style=\u00bbwidth:&#8217; .$width. &#8216;; height:&#8217; .$height. &#8216;;\u00bb&gt;Your browser does not support iframes&lt;\/iframe&gt;&#8217;;<\/p>\n<p>}<\/p>\n<p>add_shortcode(&#8216;pdf&#8217;, &#8216;pdf_function&#8217;);Copy<\/p>\n<p>To embed a PDF, in this situation type the shortcode [pdf], and pass in the URL as the content argument:<\/p>\n<p>[pdf width=\u00bb520px\u00bb height=\u00bb700px\u00bb]http:\/\/static.fsf.org\/common\/what-is-fs-new.pdf[\/pdf]Copy<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Plugins_de_Shortcodes_para_WordPress\"><\/span>Plugins de Shortcodes para WordPress<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Gracias a los plugins de WordPress, agregar un shortcode a un sitio web no requiere la edici\u00f3n del c\u00f3digo fuente. Si echas un vistazo al directorio de complementos de WordPress, ver\u00e1s una gran cantidad de plugins o widgets de este tipo con los que podr\u00e1s dise\u00f1ar publicaciones y p\u00e1ginas.<\/p>\n<p>Aqu\u00ed te recomendaremos algunos de los mejores widgets de shortcode, sobre todo gratuitos, para satisfacer todas tus necesidades.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Shortcodes_ultimate-2\"><\/span>Shortcodes ultimate<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Sin lugar a dudas, este es el mejor plugin de shortcode que existe. Te permite crear f\u00e1cilmente botones, pesta\u00f1as, cuadros, controles deslizantes, informaci\u00f3n sobre herramientas y muchos m\u00e1s elementos.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"J_Shortcodes\"><\/span>J Shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>El plugin J Shortcodes es similar a Shortcodes Ultimate en cuanto que ofrece una colecci\u00f3n de elementos \u00fatiles para dise\u00f1ar un sitio web, incluidos botones, cuadros, pesta\u00f1as y acordeones. J Shortcodes te permite establecer atributos personalizados en elementos, como color, tama\u00f1o y forma, y definir dise\u00f1os de columna personalizados en cualquier p\u00e1gina o publicaci\u00f3n.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Shortcode_Exec_PHP\"><\/span>Shortcode Exec PHP<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Permite ejecutar c\u00f3digo arbitrario y lo hace mediante la reutilizaci\u00f3n de PHP tanto en posts como en comentarios o p\u00e1ginas. Su uso es sencillo y seguro.<\/p>\n<h3 class=\"western\"><span class=\"ez-toc-section\" id=\"Shortcodes_UI\"><\/span>Shortcodes UI<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Mediante este plugin se a\u00f1ade una nueva interfaz de usuario a tu wordpress que te permite crear shortcodes sin necesidad de conocer el c\u00f3digo necesario y sin necesidad de editar.<\/p>\n<h2 class=\"western\"><span class=\"ez-toc-section\" id=\"Ventajas_y_desventajas_de_los_shortcodes\"><\/span>Ventajas y desventajas de los shortcodes<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Como hemos visto, el beneficio m\u00e1s evidente de <strong>los shortcodes para WordPress es que ofrecen un ampl\u00edsimo abanico de posibilidades.<\/strong> Gracias a ellos, y cuando aprendas a manejarlos a tu antojo, podr\u00e1s personalizar tu sitio web sin dificultad.<\/p>\n<p>Al fin y al cabo, se trata de crear un peque\u00f1o c\u00f3digo. Peque\u00f1o en cuento a elementos, aunque <strong>las combinaciones de los mismos pueden ser casi infinitas.<\/strong> Unas pocas l\u00edneas te permiten insertar botones, cajas con informaci\u00f3n relevante, formularios\u2026<\/p>\n<p>Y el hecho es que no necesitas un conocimiento exhaustivo de lenguaje de programaci\u00f3n. Sobre todo si usas plugins de shortcodes o, directamente, temas de WordPress que ya los incluyen por defecto.<\/p>\n<p>Como contrapartida, <strong>existen dos desventajas<\/strong>. La primera es que la curva de aprendizaje para aprender a crear shortcodes para WordPress desde cero es muy empinada. Al principio, so no est\u00e1s familiarizado con ning\u00fan tipo de lenguaje de programaci\u00f3n, es posible que te pierdas y te desesperes. Por eso es mejor empezar con la creaci\u00f3n de shortcodes simples e ir complic\u00e1ndolos a medida que te sientas seguro.<\/p>\n<p>La segunda desventaja es que, en el momento en que le cojas el tranquillo, crear shortcodes para WordPress te solucionar\u00e1 tantas cosas que probablemente llenes tu web de ellos. Y si luego quieres quitarlos, esta tarea puede ser un tanto engorrosa.<\/p>\n<p>En cualquier caso, esperamos que esta gu\u00eda te haya ayudado a comprender los shortcodes para WordPress y a empezar a usarlos. <u><\/u><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Los shortocodes para WordPress se introdujeron en la versi\u00f3n 2.5 y desde entonces han demostrado ser una de las caracter\u00edsticas m\u00e1s \u00fatiles [&hellip;]<\/p>\n","protected":false},"author":30,"featured_media":2139,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"image","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[126,6],"tags":[],"class_list":["post-2135","post","type-post","status-publish","format-image","has-post-thumbnail","hentry","category-cms","category-wordpress","post_format-post-format-image"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Shortcodes para WordPress - ProfesionalHosting | blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Shortcodes para WordPress - ProfesionalHosting | blog\" \/>\n<meta property=\"og:description\" content=\"Los shortocodes para WordPress se introdujeron en la versi\u00f3n 2.5 y desde entonces han demostrado ser una de las caracter\u00edsticas m\u00e1s \u00fatiles [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"ProfesionalHosting | blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/profesionalhosting\" \/>\n<meta property=\"article:published_time\" content=\"2019-01-02T15:08:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-04-25T11:35:25+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"533\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Antonio Mu\u00f1oz\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/antofmunoz\" \/>\n<meta name=\"twitter:site\" content=\"@hostingyvps\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Antonio Mu\u00f1oz\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"24 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\"},\"author\":{\"name\":\"Antonio Mu\u00f1oz\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/e344eb0ffedade40222b623156723309\"},\"headline\":\"Shortcodes para WordPress\",\"datePublished\":\"2019-01-02T15:08:38+00:00\",\"dateModified\":\"2023-04-25T11:35:25+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\"},\"wordCount\":4692,\"publisher\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg\",\"articleSection\":[\"CMS\",\"WordPress\"],\"inLanguage\":\"es\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\",\"url\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\",\"name\":\"Shortcodes para WordPress - ProfesionalHosting | blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg\",\"datePublished\":\"2019-01-02T15:08:38+00:00\",\"dateModified\":\"2023-04-25T11:35:25+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage\",\"url\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg\",\"contentUrl\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg\",\"width\":800,\"height\":533},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.profesionalhosting.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Shortcodes para WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#website\",\"url\":\"https:\/\/www.profesionalhosting.com\/blog\/\",\"name\":\"ProfesionalHosting | blog\",\"description\":\"Blog sobre Hosting, Ecommerce, PrestaShop, Magento, WordPress, Joomla y Drupal.\",\"publisher\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.profesionalhosting.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#organization\",\"name\":\"Profesional Hosting\",\"url\":\"https:\/\/www.profesionalhosting.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2023\/04\/2x-logo.png\",\"contentUrl\":\"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2023\/04\/2x-logo.png\",\"width\":360,\"height\":82,\"caption\":\"Profesional Hosting\"},\"image\":{\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/profesionalhosting\",\"https:\/\/x.com\/hostingyvps\",\"https:\/\/www.youtube.com\/channel\/UCGm-8k07wzutzxT6Upvw5tQ\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/e344eb0ffedade40222b623156723309\",\"name\":\"Antonio Mu\u00f1oz\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7bf6e1903619f42ff8dd4f45d68761d0?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7bf6e1903619f42ff8dd4f45d68761d0?s=96&d=mm&r=g\",\"caption\":\"Antonio Mu\u00f1oz\"},\"description\":\"Antonio Mu\u00f1oz, Si quieres puedes visitar mi blog y saber un poco m\u00e1s sobre m\u00ed en antoniofmunoz\",\"sameAs\":[\"https:\/\/antoniofmunoz.com\",\"https:\/\/x.com\/https:\/\/twitter.com\/antofmunoz\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Shortcodes para WordPress - ProfesionalHosting | blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/","og_locale":"es_ES","og_type":"article","og_title":"Shortcodes para WordPress - ProfesionalHosting | blog","og_description":"Los shortocodes para WordPress se introdujeron en la versi\u00f3n 2.5 y desde entonces han demostrado ser una de las caracter\u00edsticas m\u00e1s \u00fatiles [&hellip;]","og_url":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/","og_site_name":"ProfesionalHosting | blog","article_publisher":"https:\/\/www.facebook.com\/profesionalhosting","article_published_time":"2019-01-02T15:08:38+00:00","article_modified_time":"2023-04-25T11:35:25+00:00","og_image":[{"width":800,"height":533,"url":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg","type":"image\/jpeg"}],"author":"Antonio Mu\u00f1oz","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/antofmunoz","twitter_site":"@hostingyvps","twitter_misc":{"Escrito por":"Antonio Mu\u00f1oz","Tiempo de lectura":"24 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#article","isPartOf":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/"},"author":{"name":"Antonio Mu\u00f1oz","@id":"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/e344eb0ffedade40222b623156723309"},"headline":"Shortcodes para WordPress","datePublished":"2019-01-02T15:08:38+00:00","dateModified":"2023-04-25T11:35:25+00:00","mainEntityOfPage":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/"},"wordCount":4692,"publisher":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg","articleSection":["CMS","WordPress"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/","url":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/","name":"Shortcodes para WordPress - ProfesionalHosting | blog","isPartOf":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg","datePublished":"2019-01-02T15:08:38+00:00","dateModified":"2023-04-25T11:35:25+00:00","breadcrumb":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#primaryimage","url":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg","contentUrl":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2019\/01\/shortcodes-de-wordpress.jpg","width":800,"height":533},{"@type":"BreadcrumbList","@id":"https:\/\/www.profesionalhosting.com\/blog\/cms\/shortcodes-para-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.profesionalhosting.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Shortcodes para WordPress"}]},{"@type":"WebSite","@id":"https:\/\/www.profesionalhosting.com\/blog\/#website","url":"https:\/\/www.profesionalhosting.com\/blog\/","name":"ProfesionalHosting | blog","description":"Blog sobre Hosting, Ecommerce, PrestaShop, Magento, WordPress, Joomla y Drupal.","publisher":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.profesionalhosting.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/www.profesionalhosting.com\/blog\/#organization","name":"Profesional Hosting","url":"https:\/\/www.profesionalhosting.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2023\/04\/2x-logo.png","contentUrl":"https:\/\/www.profesionalhosting.com\/blog\/wp-content\/uploads\/2023\/04\/2x-logo.png","width":360,"height":82,"caption":"Profesional Hosting"},"image":{"@id":"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/profesionalhosting","https:\/\/x.com\/hostingyvps","https:\/\/www.youtube.com\/channel\/UCGm-8k07wzutzxT6Upvw5tQ"]},{"@type":"Person","@id":"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/e344eb0ffedade40222b623156723309","name":"Antonio Mu\u00f1oz","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.profesionalhosting.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7bf6e1903619f42ff8dd4f45d68761d0?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7bf6e1903619f42ff8dd4f45d68761d0?s=96&d=mm&r=g","caption":"Antonio Mu\u00f1oz"},"description":"Antonio Mu\u00f1oz, Si quieres puedes visitar mi blog y saber un poco m\u00e1s sobre m\u00ed en antoniofmunoz","sameAs":["https:\/\/antoniofmunoz.com","https:\/\/x.com\/https:\/\/twitter.com\/antofmunoz"]}]}},"_links":{"self":[{"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/posts\/2135"}],"collection":[{"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/users\/30"}],"replies":[{"embeddable":true,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/comments?post=2135"}],"version-history":[{"count":0,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/posts\/2135\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/media\/2139"}],"wp:attachment":[{"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/media?parent=2135"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/categories?post=2135"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.profesionalhosting.com\/blog\/wp-json\/wp\/v2\/tags?post=2135"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}