{"id":261026,"date":"2022-11-04T11:23:52","date_gmt":"2022-11-04T10:23:52","guid":{"rendered":"https:\/\/divimundo.com\/blog\/como-crear-enlaces-de-anclaje-en-divi-paso-a-paso\/"},"modified":"2022-11-14T13:30:38","modified_gmt":"2022-11-14T12:30:38","slug":"como-crear-enlaces-de-anclaje-en-divi-paso-a-paso","status":"publish","type":"post","link":"https:\/\/divimundo.com\/es\/blog\/como-crear-enlaces-de-anclaje-en-divi-paso-a-paso\/","title":{"rendered":"C\u00f3mo crear enlaces de anclaje en Divi \u2013 paso a paso"},"content":{"rendered":"<p>[et_pb_section fb_built=\u00bb1&#8243; admin_label=\u00bbsection\u00bb _builder_version=\u00bb4.16&#8243; global_colors_info=\u00bb{}\u00bb][et_pb_row admin_label=\u00bbrow\u00bb _builder_version=\u00bb4.16&#8243; background_size=\u00bbinitial\u00bb background_position=\u00bbtop_left\u00bb background_repeat=\u00bbrepeat\u00bb custom_padding=\u00bb||0px|||\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.16&#8243; custom_padding=\u00bb|||\u00bb global_colors_info=\u00bb{}\u00bb custom_padding__hover=\u00bb|||\u00bb][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<p><strong>Es muy f\u00e1cil crear enlaces de anclaje en Divi. El enlace de anclaje permite a sus visitantes saltar a diferentes secciones en la misma p\u00e1gina sin salir de ella. Es muy \u00fatil en p\u00e1ginas y publicaciones largas de Divi.<\/strong><\/p>\n<p><a href=\"https:\/\/html.com\/anchors-links\/\" target=\"_blank\" rel=\"noopener\">HTML.COM define los enlaces de anclaje de<\/a> una manera integral:<\/p>\n<blockquote>\n<p>El elemento anchor se utiliza para crear hiperv\u00ednculos entre un anclaje de origen y un anclaje de destino. El origen es el texto, la imagen o el bot\u00f3n que enlaza con otro recurso y el destino es el recurso al que se vincula el anclaje de origen.<\/p>\n<\/blockquote>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row disabled_on=\u00bboff|off|off\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_padding=\u00bb||0px|||\u00bb hover_enabled=\u00bb0&#8243; global_colors_info=\u00bb{}\u00bb sticky_enabled=\u00bb0&#8243;][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.16&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_video src=\u00bbhttps:\/\/youtu.be\/jM_5IGz5CdU\u00bb image_src=\u00bbhttps:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-links-in-divi-yt.jpg\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][\/et_pb_video][et_pb_button button_url=\u00bbhttps:\/\/www.youtube.com\/c\/divimundo?sub_confirmation=1&#8243; url_new_window=\u00bbon\u00bb button_text=\u00bbSuscr\u00edbete en YouTube\u00bb button_alignment=\u00bbcenter\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_button=\u00bboff\u00bb custom_margin=\u00bb||9px|||\u00bb global_module=\u00bb259694&#8243; saved_tabs=\u00bball\u00bb locked=\u00bboff\u00bb global_colors_info=\u00bb{}\u00bb custom_css_main_element_last_edited=\u00bbon|desktop\u00bb custom_css_main_element_tablet=\u00bbfont-size:10px !important;\u00bb custom_css_main_element_phone=\u00bbfont-size:10px !important;\u00bb][\/et_pb_button][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb text_font=\u00bb||||||||\u00bb text_text_color=\u00bb#595959&#8243; text_font_size=\u00bb13px\u00bb text_orientation=\u00bbcenter\u00bb hover_enabled=\u00bb0&#8243; global_module=\u00bb259833&#8243; saved_tabs=\u00bball\u00bb global_colors_info=\u00bb{}\u00bb sticky_enabled=\u00bb0&#8243;]<\/p>\n<p>Join 1740+ subscribers!<\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_margin=\u00bb||||false|false\u00bb custom_padding=\u00bb0px||||false|false\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_margin=\u00bb||8px||false|false\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h2>Dos ejemplos de enlaces de anclaje en Divi<\/h2>\n<p>[\/et_pb_text][et_pb_video src=\u00bbhttps:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-demo.mp4&#8243; module_class=\u00bbvideo-autoplay\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][\/et_pb_video][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<p>Como puede ver en el video anterior, los enlaces de anclaje se pueden usar tanto en los <strong>men\u00fas de navegaci\u00f3n<\/strong> como en <strong>los botones de<\/strong> una p\u00e1gina o en una publicaci\u00f3n.<\/p>\n<p>Tambi\u00e9n puede usar el m\u00f3dulo Divi Text o los editores predeterminados de WordPress (Gutenberg Block Builder y Classic Editor) para <strong>agregar enlaces de anclaje en texto plano<\/strong>.<\/p>\n<h2>\u00bfCu\u00e1ndo es apropiado usar enlaces de anclaje?<\/h2>\n<p>Los enlaces de anclaje se utilizan mejor en p\u00e1ginas y publicaciones<strong> largas y densas<\/strong> . Tambi\u00e9n son una buena opci\u00f3n para <em>sitios web de una p\u00e1gina<\/em>. Una buena secci\u00f3n de <strong>tabla de contenido<\/strong> a menudo se basa en enlaces de anclaje, as\u00ed como en <strong>ingeniosos botones de volver al principio<\/strong>.<\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdb924512-b34a-4a4b-b9bc-50634828c4cd\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bb791db523-72dc-4b57-b534-1ebf723a7830&#8243; global_colors_info=\u00bb{}\u00bb]<\/p>\n<h3>Tabla de contenidos<\/h3>\n<p>Los enlaces a continuaci\u00f3n son en realidad <em>enlaces de anclaje<\/em> que lo llevar\u00e1n directamente a los diferentes cap\u00edtulos de esta publicaci\u00f3n.<\/p>\n<ol>\n<li><a href=\"#create-anchor-in-divi\">Crea tu destino ancla en Divi<\/a><\/li>\n<li><a href=\"#add-anchor-link-in-divi-divi-menu\">Agregar un enlace de anclaje en un men\u00fa Divi<\/a><\/li>\n<li><a href=\"#add-anchor-link-in-divi-button\">Agregar un enlace de anclaje en un bot\u00f3n Divi<\/a><\/li>\n<li><a href=\"#add-anchor-link-in-divi-text\">Agregar un enlace de anclaje en cualquier elemento de texto<\/a><\/li>\n<li><a href=\"#add-back-to-top-link-in-divi\">Agregar un enlace de anclaje de volver al principio en Divi<\/a><\/li>\n<li><a href=\"#common-anchor-link-mistakes\">Soluci\u00f3n de problemas: errores comunes de enlace de anclaje<\/a><\/li>\n<\/ol>\n<p>\u00a1Vamos!<\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_margin=\u00bb||||false|false\u00bb custom_padding=\u00bb||||false|false\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_text module_id=\u00bbcreate-anchor-in-divi\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_margin=\u00bb||8px||false|false\u00bb custom_padding=\u00bb||9px|||\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h2>Paso 1: Crea tu destino de anclaje en Divi<\/h2>\n<p>El primer paso es \u00absoltar su ancla\u00bb en el lugar donde desea que lleguen sus visitantes. Para hacer esto, debe agregar un <strong>ID \u00fanico<\/strong> (identificador) a una secci\u00f3n, fila o m\u00f3dulo. En el siguiente paso, crearemos enlaces dirigidos a este ID.<\/p>\n<p>[\/et_pb_text][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb custom_margin=\u00bb||0px||false|false\u00bb custom_padding=\u00bb||9px|||\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<ol>\n<li>Habilite <strong>Divi Visual Builde<\/strong>r en la p\u00e1gina donde desea agregar el anclaje.<\/li>\n<li><strong>Haga clic en la rueda dentada<\/strong> para editar el elemento (una secci\u00f3n, fila o m\u00f3dulo) donde desea agregar el anclaje.<\/li>\n<li>Vaya a Advanced <strong>ta<\/strong>b y abra la <strong>pesta\u00f1a CSS ID &amp; Classes<\/strong>.<\/li>\n<li>Agregue un nombre claro para su ancla (por ejemplo, <em>blog<\/em> o <em>cont\u00e1ctenos<\/em>) en el campo ID de CSS.<br \/>\n\u26a0\ufe0f <em>No uses espacios o caracteres especiales como # en tu ID CSS.<\/em><\/li>\n<li>Haga clic en el bot\u00f3n verde para guardar la configuraci\u00f3n y, a continuaci\u00f3n, guarde la p\u00e1gina.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=\u00bbhttps:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/css-id-anchor-link-divi.jpg\u00bb alt=\u00bbAgregar un anclaje de ID CSS en Divi\u00bb title_text=\u00bbAgregar un anclaje de ID CSS en Divi\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][\/et_pb_image][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]Ahora ha dejado caer su ancla y ha creado el destino para sus enlaces de anclaje.[\/et_pb_text][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h2>Paso 2: Crea tus enlaces de anclaje en Divi<\/h2>\n<p>Ahora es el momento de agregar los enlaces que enviar\u00e1n a sus visitantes a su nuevo destino de anclaje. El principio es simple: simplemente agregue un enlace a su ID CSS con un hash (#) delante de \u00e9l, por ejemplo, <em>#blog<\/em> o <em>#contact-us.<\/em> Por supuesto, puede vincular a un ancla en una p\u00e1gina espec\u00edfica en su sitio web Divi agregando primero la, por ejemplo, \/ <em>about-us\/#contact-us<\/em>. Incluso puede vincular profundamente a un ancla en su sitio web desde una fuente externa como un correo electr\u00f3nico o redes sociales agregando su URL completa seguida de la identificaci\u00f3n #css, por ejemplo, <em><a href=\"https:\/\/mysite.com\/about-us\/#contact-us\" rel=\"nofollow\">https:\/\/mysite.com\/about-us\/#contact-us<\/a><\/em>.<\/p>\n<p>Estos son los casos de uso m\u00e1s comunes.<\/p>\n<p>[\/et_pb_text][et_pb_text module_id=\u00bbadd-anchor-link-in-divi-divi-menu\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h3>Agregar un enlace de anclaje en un men\u00fa divi<\/h3>\n<p>Agregar enlaces de anclaje a su men\u00fa Divi es una excelente manera de referir a los visitantes a un \u00e1rea espec\u00edfica de su p\u00e1gina web.<\/p>\n<ol>\n<li>Vaya a su panel de WordPress y dir\u00edjase a <strong>Apariencia<\/strong> \u00bb <strong>Men\u00fas<br \/><img loading=\"lazy\" decoding=\"async\" class=\"screenshot wp-image-260546 size-full alignnone\" src=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/edit-your-divi-menu.jpg\" alt=\"Edita tu men\u00fa Divi\" width=\"608\" height=\"516\" srcset=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/edit-your-divi-menu.jpg 608w, https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/edit-your-divi-menu-480x407.jpg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 608px, 100vw\" \/><\/strong><\/li>\n<li>Seleccione el men\u00fa que desea editar<\/li>\n<li>Vaya a <strong>Agregar elementos de men\u00fa<\/strong> y expanda <strong>V\u00ednculos personalizados<\/strong><\/li>\n<li>Agregue el <strong>ID CSS<\/strong> (desde el paso 1) al campo <strong>URL<\/strong> e inserte un hash delante de \u00e9l, por ejemplo, <em>#blog<\/em> o <em>#contact-us<\/em><br \/><img loading=\"lazy\" decoding=\"async\" class=\"screenshot aligncenter wp-image-260531 size-large\" src=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-menu-1024x493.jpg\" alt=\"A\u00f1ade el enlace de anclaje en tu men\u00fa Divi\" width=\"1024\" height=\"493\" srcset=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-menu-980x472.jpg 980w, https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-menu-480x231.jpg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) and (max-width: 980px) 980px, (min-width: 981px) 1024px, 100vw\" \/><\/li>\n<li>Haga clic en el bot\u00f3n azul <strong>Guardar men\u00fa<\/strong> .<\/li>\n<\/ol>\n<p>Ahora puede obtener una vista previa del enlace de anclaje de su men\u00fa en la interfaz. Es posible que primero deba borrar la memoria cach\u00e9 del navegador y la cach\u00e9 del sitio web.<\/p>\n<p>[\/et_pb_text][et_pb_text module_id=\u00bbadd-anchor-link-in-divi-button\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h3>Agregar un enlace de anclaje en un bot\u00f3n Divi<\/h3>\n<p>Un bot\u00f3n de llamada a la acci\u00f3n en el \u00e1rea de h\u00e9roe puede usar un enlace de anclaje para enviar al visitante a una secci\u00f3n espec\u00edfica de su p\u00e1gina web.<\/p>\n<ol>\n<li>Habilite el <strong>Divi Visual Builder<\/strong>.<\/li>\n<li>Inserte un <strong>m\u00f3dulo de bot\u00f3n<\/strong>.<\/li>\n<li>Agregue el texto del bot\u00f3n y expanda la <strong>pesta\u00f1a Enlace<\/strong>.<\/li>\n<li>A\u00f1ade el <em>ID CSS<\/em> para tu elemento de anclaje en el campo <strong>URL de enlace de bot\u00f3n<\/strong> . Aseg\u00farese de agregar un hash (<strong>#<\/strong>) delante del ID, por ejemplo,<em> #blog<\/em> o <em>#contact-us<\/em>.<br \/><img loading=\"lazy\" decoding=\"async\" class=\"screenshot aligncenter wp-image-260522 size-large\" src=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-button-1024x451.jpeg\" alt=\"Agregar enlaces de anclaje en los botones Divi\" width=\"1024\" height=\"451\" srcset=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-button-980x431.jpeg 980w, https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/anchor-link-in-divi-button-480x211.jpeg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) and (max-width: 980px) 980px, (min-width: 981px) 1024px, 100vw\" \/><\/li>\n<li>Haga clic en el bot\u00f3n verde para guardar la configuraci\u00f3n y guardar la p\u00e1gina.<\/li>\n<\/ol>\n<p>Ahora puede obtener una vista previa del enlace de anclaje de su bot\u00f3n en la interfaz. Es posible que primero deba borrar la memoria cach\u00e9 del navegador y la cach\u00e9 del sitio web.<\/p>\n<p>[\/et_pb_text][et_pb_text module_id=\u00bbadd-anchor-link-in-divi-text\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h3>Agregar un enlace de anclaje en cualquier elemento de texto<\/h3>\n<p>Puede agregar enlaces de anclaje como enlaces de texto sin formato en m\u00f3dulos de texto o en publicaciones utilizando el Editor <a href=\"https:\/\/www.wpbeginner.com\/beginners-guide\/how-to-easily-add-anchor-links-in-wordpress-step-by-step\/#manualclassicmethod\" target=\"_blank\" rel=\"noopener\">cl\u00e1sico<\/a> o el <a href=\"https:\/\/www.wpbeginner.com\/beginners-guide\/how-to-easily-add-anchor-links-in-wordpress-step-by-step\/#manualanchorlinks\" target=\"_blank\" rel=\"noopener\">Editor de bloques de Gutenberg<\/a>. Simplemente enlace al ID CSS con un hash (#) delante. He usado un m\u00f3dulo de texto divi para crear los enlaces de anclaje en la secci\u00f3n Tabla de contenido de esta publicaci\u00f3n.<\/p>\n<ol>\n<li>Habilite el <strong>Divi Visual Builder<\/strong>.<\/li>\n<li>Inserte un <strong>m\u00f3dulo de texto<\/strong>.<\/li>\n<li>Agregue su texto y resalte el texto donde desea agregar el enlace de anclaje.<\/li>\n<li>A\u00f1ade el <em>ID CSS<\/em> para tu elemento de anclaje en el campo<strong> URL<\/strong> . Aseg\u00farese de agregar un hash (<strong>#<\/strong>) delante del ID, por ejemplo,<em> #blog<\/em> o <em>#contact-us<\/em>.<br \/><img loading=\"lazy\" decoding=\"async\" class=\"screenshot aligncenter wp-image-260519 size-large\" src=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/add-divi-anchor-links-in-text-module-1024x481.jpg\" alt=\"Agregar un enlace de anclaje en el m\u00f3dulo Divi Text\" width=\"1024\" height=\"481\" srcset=\"https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/add-divi-anchor-links-in-text-module-980x460.jpg 980w, https:\/\/divimundo.com\/wp-content\/uploads\/2022\/10\/add-divi-anchor-links-in-text-module-480x226.jpg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) and (max-width: 980px) 980px, (min-width: 981px) 1024px, 100vw\" \/><\/li>\n<li>Haga clic en <strong>Aceptar<\/strong> y, a continuaci\u00f3n, pulse el bot\u00f3n verde para guardar la configuraci\u00f3n y guardar la p\u00e1gina.<\/li>\n<\/ol>\n<p>Ahora puede obtener una vista previa de su enlace de anclaje de texto en frontend. Es posible que primero deba borrar la memoria cach\u00e9 del navegador y la cach\u00e9 del sitio web.<\/p>\n<p>[\/et_pb_text][et_pb_text module_id=\u00bbadd-back-to-top-link-in-divi\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h3>Agregar un enlace de anclaje de volver al principio en Divi<\/h3>\n<p>Agregar un <a href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=40598&amp;url=77249\" target=\"_blank\" rel=\"noopener\">enlace de volver al principio en Divi<\/a> es una buena manera de mejorar la experiencia del usuario en p\u00e1ginas largas y publicaciones. Aqu\u00ed hay una forma pr\u00e1ctica de hacerlo <strong>sin agregar un ID CSS personalizado<\/strong> a su encabezado. Esto funciona bien tanto con el antiguo encabezado Divi predeterminado como con el encabezado Theme Builder.<\/p>\n<ol>\n<li>Cree un enlace usando un bot\u00f3n, texto, men\u00fa de pie de p\u00e1gina, publicidad o cualquier otra forma que desee.<\/li>\n<li>Agregar la URL <em>#et-boc<\/em><\/li>\n<li>Guarde su configuraci\u00f3n y salga.<\/li>\n<\/ol>\n<p>Ahora puede obtener una vista previa de su enlace de anclaje <strong>de vuelta a la parte superior en la<\/strong> interfaz. Es posible que primero deba borrar la memoria cach\u00e9 del navegador y la cach\u00e9 del sitio web.<\/p>\n<p>[\/et_pb_text][et_pb_text module_id=\u00bbcommon-anchor-link-mistakes\u00bb _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h2>Soluci\u00f3n de problemas: 3 errores comunes de enlace de anclaje<\/h2>\n<p>\u00bfSu enlace de anclaje conduce a un callej\u00f3n sin salida? Aqu\u00ed hay algunos errores que debe evitar.<\/p>\n<h3>Error 1: Usar la clase CSS en lugar del ID CSS<\/h3>\n<p>Es f\u00e1cil mezclar los campos CSS <strong>Class y CSS<\/strong> <strong>ID.<\/strong> Utilice siempre el campo <strong>ID de CSS<\/strong> cuando cree v\u00ednculos de anclaje, no el campo <strong>Clase CSS<\/strong> (que se utiliza para aplicar estilos). De hecho, comet\u00ed este error dos veces al crear esta publicaci\u00f3n, \u00a1en un tutorial sobre c\u00f3mo crear enlaces de anclaje!<\/p>\n<h3>Error 2: Agregar el hash (#) en el campo ID CSS<\/h3>\n<p>Divi agregar\u00e1 autom\u00e1ticamente el <strong>#<\/strong> inicial cuando agregue un <strong>ID CSS<\/strong> a una secci\u00f3n, fila o m\u00f3dulo. Nunca debe agregar su propio # cuando agrega un ID CSS (paso 1). Pero aseg\u00farese de agregar el # inicial cuando cree sus enlaces de anclaje (paso 2).<\/p>\n<h3>Error 3: Agregar ID CSS id\u00e9nticos en la misma p\u00e1gina<\/h3>\n<p>Un <strong>ID de CSS debe<\/strong> ser \u00fanico en una p\u00e1gina o publicaci\u00f3n espec\u00edfica. Si agrega el mismo <strong>ID CSS,<\/strong> por ejemplo, <em>blog<\/em>, en dos secciones diferentes en la misma p\u00e1gina, el ancla no puede referir al visitante a dos ubicaciones diferentes al mismo tiempo. Utilice siempre identificadores CSS \u00fanicos.<\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][et_pb_row _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_column type=\u00bb4_4&#8243; _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb][et_pb_text _builder_version=\u00bb4.18.0&#8243; _module_preset=\u00bbdefault\u00bb global_colors_info=\u00bb{}\u00bb]<\/p>\n<h2>\u00a1Eso es todo por hoy!<\/h2>\n<p>Espero que hayas disfrutado de este post. <a href=\"https:\/\/www.youtube.com\/c\/divimundo?sub_confirmation=1\" target=\"_blank\" rel=\"noopener\">Suscr\u00edbete a DiviMundo en YouTube<\/a> y <a href=\"https:\/\/www.facebook.com\/groups\/divimundo\" target=\"_blank\" rel=\"noopener\">\u00fanete a nuestro grupo de Facebook<\/a> para obtener contenido m\u00e1s n\u00edtido sobre WordPress y dise\u00f1o web.<\/p>\n<p><strong>\ud83d\udc49 Post relacionado:<\/strong> <a href=\"https:\/\/www.elegantthemes.com\/affiliates\/idevaffiliate.php?id=40598&amp;url=77476\" target=\"_blank\" rel=\"noopener\">C\u00f3mo crear dise\u00f1os adhesivos personalizados de volver al principio con Divi (de<\/a> Elegant Themes)<\/p>\n<p><strong>\ud83d\udc49 Curso gratuito:<\/strong> <a href=\"https:\/\/divimundo.com\/blog\/free-course-how-to-build-a-wordpress-divi-website-2021\/\">Crear un sitio web desde cero con Divi<\/a><\/p>\n<p>[\/et_pb_text][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Es muy f\u00e1cil crear enlaces de anclaje en Divi. El enlace de anclaje permite a sus visitantes saltar a diferentes secciones en la misma p\u00e1gina sin salir de ella. Es muy \u00fatil en p\u00e1ginas y publicaciones largas de Divi. HTML.COM define los enlaces de anclaje de una manera integral: El elemento anchor se utiliza para crear hiperv\u00ednculos entre un anclaje de origen y un anclaje de destino. El origen es el texto, la imagen o el bot\u00f3n que enlaza con otro recurso y el destino es el recurso al que se vincula el anclaje de origen. Join 1740+ subscribers!Dos ejemplos de enlaces de anclaje en DiviComo puede ver en el video anterior, los enlaces de anclaje se pueden usar tanto en los men\u00fas de navegaci\u00f3n como en los botones de una p\u00e1gina o en una publicaci\u00f3n. Tambi\u00e9n puede usar el m\u00f3dulo Divi Text o los editores predeterminados de WordPress (Gutenberg Block Builder y Classic Editor) para agregar enlaces de anclaje en texto plano. \u00bfCu\u00e1ndo es apropiado usar enlaces de anclaje? Los enlaces de anclaje se utilizan mejor en p\u00e1ginas y publicaciones largas y densas . Tambi\u00e9n son una buena opci\u00f3n para sitios web de una p\u00e1gina. Una buena secci\u00f3n de [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":260762,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[230,238,352,344],"tags":[],"class_list":["post-261026","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-divi","category-divi-2","category-tutoriales","category-tutorials"],"_links":{"self":[{"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/posts\/261026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/comments?post=261026"}],"version-history":[{"count":0,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/posts\/261026\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/media\/260762"}],"wp:attachment":[{"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/media?parent=261026"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/categories?post=261026"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/divimundo.com\/es\/wp-json\/wp\/v2\/tags?post=261026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}