{"id":24217,"date":"2018-02-22T00:00:00","date_gmt":"2018-02-21T18:30:00","guid":{"rendered":"https:\/\/git-staging.wpastra.com\/?post_type=docs&#038;p=24217"},"modified":"2024-02-07T15:46:03","modified_gmt":"2024-02-07T10:16:03","slug":"sticky-header-pro","status":"publish","type":"docs","link":"https:\/\/git-staging.wpastra.com\/es\/docs\/sticky-header-pro\/","title":{"rendered":"C\u00f3mo a\u00f1adir una cabecera fija con Astra"},"content":{"rendered":"<p><strong>Nota<\/strong>: La funci\u00f3n Sticky Header forma parte del complemento Astra Pro. Para utilizar esta funci\u00f3n, aseg\u00farese de que tanto el tema Astra y <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/how-to-install-astra-pro-addon-plugin\/\">Astra Pro Addon est\u00e1n instalados en su sitio de WordPress.<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>\u00bfQu\u00e9 es una cabecera adhesiva?<\/strong><\/h2>\n\n\n\n<p>La funci\u00f3n Sticky Header de Astra permite fijar la cabecera en la parte superior de la p\u00e1gina web a medida que los usuarios se desplazan, proporcionando un acceso r\u00e1pido al men\u00fa.<\/p>\n\n\n\n<p>Es como tener el men\u00fa siempre al alcance de la mano, sin importar en qu\u00e9 parte de la p\u00e1gina te encuentres.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Pasos r\u00e1pidos para activar la cabecera adhesiva<\/strong><\/h2>\n\n\n\n<p>Puede consultar el siguiente v\u00eddeo para iniciarse r\u00e1pidamente en el uso de Sticky Header en Astra Pro.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"ast-oembed-container\" style=\"height: 100%;\"><iframe title=\"Cabecera adhesiva en Astra Header Footer Builder\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<\/div><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Instale y active el <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/how-to-install-astra-pro-addon-plugin\/\">Complemento Astra Pro<\/a>.&nbsp;<\/li>\n\n\n\n<li>Active el m\u00f3dulo Sticky Header desde las opciones de Astra en el panel de control de WordPress.<\/li>\n\n\n\n<li>Personalice la configuraci\u00f3n del m\u00f3dulo Sticky Header en el Personalizador de WordPress en <strong>Apariencia<\/strong> &gt; <strong>Personalice<\/strong> &gt; <strong>Creador de cabeceras<\/strong> &gt; <strong>Cabecera adhesiva<\/strong>.<\/li>\n<\/ul>\n\n\n\n<p>Para m\u00e1s detalles al respecto, consulte los siguientes pasos.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Activaci\u00f3n del m\u00f3dulo de cabecera adhesiva<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Active el m\u00f3dulo Sticky Header desde <strong>Astra<\/strong> &gt; <strong>Cuadro de mandos<\/strong>.&nbsp;<\/li>\n<\/ul>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/8s0-GeJ-DB6dq_i7xlaUpK9e7Ok54xp6muMr0DoZSH6EjXeremyAY8SsoUG-RCqwJ4P4LhgeoW18DcjZefbymXvvPZMLDaxP_3QvT4RKCFtYcHT86aYCSt0gQFHK5VXfubbXlxtz8DVC1oOfrgdWv8A&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Sticky Header Module&quot;,&quot;alt&quot;:&quot;Sticky Header Module&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/8s0-GeJ-DB6dq_i7xlaUpK9e7Ok54xp6muMr0DoZSH6EjXeremyAY8SsoUG-RCqwJ4P4LhgeoW18DcjZefbymXvvPZMLDaxP_3QvT4RKCFtYcHT86aYCSt0gQFHK5VXfubbXlxtz8DVC1oOfrgdWv8A\" alt=\"Sticky Header Module\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: M\u00f3dulo de cabecera adhesiva\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Configuraci\u00f3n de acceso en <strong>Astra<\/strong> &gt; <strong>Personalice<\/strong> &gt; <strong>Creador de cabeceras<\/strong> &gt; <strong>Cabecera adhesiva<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/4O6ZrfHFaP970OBtZrEQEDluK68rw-T2F03iKSp2mnjbU_sUh3UxP0fBwqBxFU-AJEL3Fmov4uQj-YAZZJSkid7gI2S0w9KpWF5wRUHRlqD0i66zE8qiwDHOjRYZL_qKSCb3fZCPF6qhYarBuq2nnbU&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Customizer Sticky Header section&quot;,&quot;alt&quot;:&quot;Customizer Sticky Header section&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/4O6ZrfHFaP970OBtZrEQEDluK68rw-T2F03iKSp2mnjbU_sUh3UxP0fBwqBxFU-AJEL3Fmov4uQj-YAZZJSkid7gI2S0w9KpWF5wRUHRlqD0i66zE8qiwDHOjRYZL_qKSCb3fZCPF6qhYarBuq2nnbU\" alt=\"Customizer Sticky Header section\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Personalizador de la secci\u00f3n Sticky Header\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Configuraci\u00f3n de la cabecera adhesiva&nbsp;<\/strong><\/h2>\n\n\n\n<p>Estos son algunos de los ajustes de Sticky Header que puede probar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Stick Primary Header<\/strong><\/h3>\n\n\n\n<p>Esta es la configuraci\u00f3n que fija el encabezado principal de su sitio web en la parte superior.&nbsp;<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/16CRjZbXP3u4Ncb4qOJ6MNr7q--OnEI3GwGSOsRIOkSU_ppDjG8To-xTJPZKVKBPCkz1xAvkA3dCgJ1JaO8OEBDOeC7yxmkQIlDXlGYOZKAz6t1qvWmnRga9od6WqjttrhB3DzsxoRBmPrNrp7z4qBM&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Stick Primary Header&quot;,&quot;alt&quot;:&quot;Stick Primary Header&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/16CRjZbXP3u4Ncb4qOJ6MNr7q--OnEI3GwGSOsRIOkSU_ppDjG8To-xTJPZKVKBPCkz1xAvkA3dCgJ1JaO8OEBDOeC7yxmkQIlDXlGYOZKAz6t1qvWmnRga9od6WqjttrhB3DzsxoRBmPrNrp7z4qBM\" alt=\"Stick Primary Header\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Stick Primary Header\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Pegar por encima y por debajo de las secciones de cabecera&nbsp;<\/strong><\/h3>\n\n\n\n<p>En su configuraci\u00f3n, hay dos \u00e1reas clave: la <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/above-header-section\/\">Cabecera superior<\/a> y el <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/header-sections-pro\/\">Cabecera inferior<\/a>.&nbsp;<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/Nszw_54t7Fm45Vyyz_w5_FdOErkrwoYrOXZ7zSS16b-sb2CLYhZS-5M-ixi4nWsSG12QBd2b4B2zDnWPH3icXhIGvHgZtiry-i3D4OO-h8--YK94cYfJZ0X0cXJ79kG_HplKMDbUggI_GnDBwdt7Byw&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Stick Above and Below Header&quot;,&quot;alt&quot;:&quot;Stick Above and Below Header&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/Nszw_54t7Fm45Vyyz_w5_FdOErkrwoYrOXZ7zSS16b-sb2CLYhZS-5M-ixi4nWsSG12QBd2b4B2zDnWPH3icXhIGvHgZtiry-i3D4OO-h8--YK94cYfJZ0X0cXJ79kG_HplKMDbUggI_GnDBwdt7Byw\" alt=\"Stick Above and Below Header\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Pegar por encima y por debajo de la cabecera\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p>En <strong>Cabecera superior<\/strong> es la secci\u00f3n superior por encima de la cabecera principal donde puede mostrar botones, men\u00fas y contenido adicional.&nbsp;<\/p>\n\n\n\n<p><strong>Cabecera inferior<\/strong>que se encuentra justo debajo de la cabecera principal, proporciona un espacio para men\u00fas adicionales, barras de b\u00fasqueda y widgets.<\/p>\n\n\n\n<p><strong>Nota<\/strong>: Aseg\u00farese de que ha activado el <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/header-sections-pro\/\">M\u00f3dulo de secciones de cabecera<\/a> del cuadro de mandos del Astra Pro para ver estas opciones.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Cambiar logotipo adhesivo y opciones de anchura<\/strong><\/h3>\n\n\n\n<p><strong>Logotipo diferente para cabeceras adhesivas<\/strong><\/p>\n\n\n\n<p>Esto le permite elegir un logotipo diferente para su cabecera adhesiva que el logotipo de su sitio. D\u00e9jelo vac\u00edo si desea utilizar el mismo logotipo que el de su sitio.&nbsp;<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/1goiHVOpdJF7E0RE1-WXBoPpmSGC5ie2apIHIloJNtAlaJGffRrLYXcDDbiiGSfIeHUkuPhu5QBict0sj3hOXH-ExH-GV2aJ8sDLtrBcWPyRZso7fchPEd79astZgLtP-7VdlPqnz5pcznJ5qI2jLS4&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Different Logo for Sticky Header&quot;,&quot;alt&quot;:&quot;Different Logo for Sticky Header&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/1goiHVOpdJF7E0RE1-WXBoPpmSGC5ie2apIHIloJNtAlaJGffRrLYXcDDbiiGSfIeHUkuPhu5QBict0sj3hOXH-ExH-GV2aJ8sDLtrBcWPyRZso7fchPEd79astZgLtP-7VdlPqnz5pcznJ5qI2jLS4\" alt=\"Different Logo for Sticky Header\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Logotipo diferente para cabecera adhesiva\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p><strong>A\u00f1adir un logotipo Retina adhesivo<\/strong><\/p>\n\n\n\n<p>Puedes subir logotipos normales y retina para asegurarte de que se ven n\u00edtidos en pantallas de alta calidad.<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/hbLAcStL0RQ72HirLO0KuqDSMtpH0SU_GE184GodMfChvwehDEXCtTdsr5TYS9fRCm_ODcAfi32XP2Fje5GQX-hPgMN0pHNt2fzDwUY2NqVZ4lGDkeptwKsAiVlQYEi4rBowh-uwwMStV55IQZtw9fw&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Retina Logo&quot;,&quot;alt&quot;:&quot;Retina Logo&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/hbLAcStL0RQ72HirLO0KuqDSMtpH0SU_GE184GodMfChvwehDEXCtTdsr5TYS9fRCm_ODcAfi32XP2Fje5GQX-hPgMN0pHNt2fzDwUY2NqVZ4lGDkeptwKsAiVlQYEi4rBowh-uwwMStV55IQZtw9fw\" alt=\"Retina Logo\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Logo Retina\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p><strong>Ancho del logotipo adhesivo<\/strong><\/p>\n\n\n\n<p>Puede ajustar f\u00e1cilmente la anchura de estos logotipos con este control deslizante.<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/I2OmSC7avQBCA1uV9Ba3QSQBAA-XuMPqwMFwdRfUJOIK-Oa3FkW-OnVONdrSuQP-ojkomSKqj4uVtUvnBJmvmGgI-sG2GKxssAmZFMgw4eBlW2RiYnxoZRXOpGxNcqMX_cYOLB-BY90oFHljnJfbudU&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Sticky Logo Width&quot;,&quot;alt&quot;:&quot;Sticky Logo Width&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/I2OmSC7avQBCA1uV9Ba3QSQBAA-XuMPqwMFwdRfUJOIK-Oa3FkW-OnVONdrSuQP-ojkomSKqj4uVtUvnBJmvmGgI-sG2GKxssAmZFMgw4eBlW2RiYnxoZRXOpGxNcqMX_cYOLB-BY90oFHljnJfbudU\" alt=\"Sticky Logo Width\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Logotipo adhesivo Ancho\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p>Si enciende el <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/colors-background-module\/\">M\u00f3dulo Colores y fondo<\/a> en Astra Pro y elija un color de fondo para la cabecera en <strong>Astra<\/strong> &gt; <strong>Personalice<\/strong> &gt; <strong>Creador de cabeceras<\/strong> &gt; <strong>Cabecera adhesiva<\/strong>ese color se trasladar\u00e1 autom\u00e1ticamente a la cabecera adhesiva.&nbsp;<\/p>\n\n\n\n<p>En este caso, puede utilizar la opci\u00f3n Opacidad del fondo adhesivo para gestionar la opacidad del color de fondo.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>A\u00f1adir un efecto de contracci\u00f3n<\/strong><\/h3>\n\n\n\n<p>Haga clic en el bot\u00f3n <strong>Activar el efecto de contracci\u00f3n <\/strong>para utilizar esta funci\u00f3n. Esto reduce el tama\u00f1o de la cabecera adhesiva para una visualizaci\u00f3n m\u00e1s compacta mientras se desplaza hacia abajo.<\/p>\n\n\n\n<p>Es \u00fatil cuando se tiene un encabezado primario bastante grande en altura y se desea que sea m\u00e1s peque\u00f1o al convertirlo al encabezado adhesivo.<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/TwwZWxYNJbaGC_RRk3PVwQj870udhrpwicSdhTt2auUeFAtLCzTwO0ZjSSXIZIdEOKrpmBSHv-gCoIQzYcxP5qelw8LhrvgVuoMJhIzCMgm4a216xQ4xNxRfigNikqbk0fRImAHmbbf1KrzBZzkqm3w&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Enable Shrink Effect&quot;,&quot;alt&quot;:&quot;Enable Shrink Effect&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/TwwZWxYNJbaGC_RRk3PVwQj870udhrpwicSdhTt2auUeFAtLCzTwO0ZjSSXIZIdEOKrpmBSHv-gCoIQzYcxP5qelw8LhrvgVuoMJhIzCMgm4a216xQ4xNxRfigNikqbk0fRImAHmbbf1KrzBZzkqm3w\" alt=\"Enable Shrink Effect\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Activar el efecto de encogimiento\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>A\u00f1adir efecto de animaci\u00f3n<\/strong><\/h3>\n\n\n\n<p>Aplica efectos de animaci\u00f3n a la entrada de cabecera adhesiva. <\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/lh7-us.googleusercontent.com\/bJ6Tdnk5M0diY0HF4vMDXgNFcpFm4KMJSQXiwLGGWL6m5mZbh5xEMk7uwPov79gF6yrR-CmdFFJZYPDBld3-IfPonh381JNsnZ67_x8AhEfB_DjuPWDceAupWA33Ck3c6ZRFkOS1s8h7UDC0ObbXGeE\" alt=\"Select Animation\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Ocultar el encabezado adhesivo mientras se desplaza hacia abajo<\/strong><\/h3>\n\n\n\n<p>Esta opci\u00f3n oculta la cabecera adhesiva s\u00f3lo cuando el lector se desplaza hacia abajo. Mientras se desplaza hacia arriba, la cabecera adhesiva vuelve a aparecer.<\/p>\n\n\n\n<p>Esta opci\u00f3n debe activarse junto con la opci\u00f3n <strong>Stick Primary Header<\/strong> opci\u00f3n. <\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/RsF1rzwXHtfrFTZPpSiy_Dmyrdyz3oV3ofQmaGDUOn9TY7-W_UcLGa2aNnboAeRja7sqkP4BEz7t2Eho1xVC_025_rZfkiz-4CC4U9ED2WqFHezqZCd5nQ6eERDa1j1UbdZjUuy8Bpy7ztPfVs_EzH8&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Hide When Scrolling Down&quot;,&quot;alt&quot;:&quot;Hide When Scrolling Down&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/RsF1rzwXHtfrFTZPpSiy_Dmyrdyz3oV3ofQmaGDUOn9TY7-W_UcLGa2aNnboAeRja7sqkP4BEz7t2Eho1xVC_025_rZfkiz-4CC4U9ED2WqFHezqZCd5nQ6eERDa1j1UbdZjUuy8Bpy7ztPfVs_EzH8\" alt=\"Hide When Scrolling Down\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Ocultar al desplazarse hacia abajo\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Opciones de visualizaci\u00f3n<\/strong><\/h3>\n\n\n\n<p>Visite la p\u00e1gina <strong>Activar <\/strong>para mostrar la cabecera adhesiva en un ordenador de sobremesa, un m\u00f3vil o ambos.<\/p>\n\n\n\n<figure data-wp-context=\"{&quot;uploadedSrc&quot;:&quot;https:\\\/\\\/lh7-us.googleusercontent.com\\\/La7vNIIqx4X4oi5ETuu1kLaOZkpgam2YGkQwCRbuBI9ywZuwJtvI4dBAZspQnHfwpnfaBHSL-I99ueQQeYmEVIdMY8v1IFhfAR0sDBE6C7FOfiR-XzBrXuaskhA8Nn2XfqB73tuk--mKxme17P-5iD4&quot;,&quot;figureClassNames&quot;:&quot;wp-block-image&quot;,&quot;figureStyles&quot;:null,&quot;imgClassNames&quot;:null,&quot;imgStyles&quot;:null,&quot;targetWidth&quot;:&quot;none&quot;,&quot;targetHeight&quot;:&quot;none&quot;,&quot;scaleAttr&quot;:false,&quot;ariaLabel&quot;:&quot;Ampliar la imagen: Enable On&quot;,&quot;alt&quot;:&quot;Enable On&quot;}\" data-wp-interactive=\"core\/image\" class=\"wp-block-image wp-lightbox-container\"><img decoding=\"async\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on-async--click=\"actions.showLightbox\" data-wp-on-async--load=\"callbacks.setButtonStyles\" data-wp-on-async-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/lh7-us.googleusercontent.com\/La7vNIIqx4X4oi5ETuu1kLaOZkpgam2YGkQwCRbuBI9ywZuwJtvI4dBAZspQnHfwpnfaBHSL-I99ueQQeYmEVIdMY8v1IFhfAR0sDBE6C7FOfiR-XzBrXuaskhA8Nn2XfqB73tuk--mKxme17P-5iD4\" alt=\"Enable On\"\/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Ampliar la imagen: Activar\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on-async--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"context.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"context.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n\n\n\n<p><strong>Personalizaci\u00f3n con CSS<\/strong><\/p>\n\n\n\n<p>Nota: Por defecto, aparecer\u00e1 una sombra para una cabecera adhesiva. Para eliminar el efecto de sombra por defecto, <a href=\"https:\/\/git-staging.wpastra.com\/es\/docs\/how-to-add-custom-css-and-javascript-to-astra-theme\/\">a\u00f1ada este CSS personalizado<\/a>:<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\" data-no-auto-translation=\"\"><code>#ast-fixed-header .main-header-bar {\r\n\tbox-shadow: unset;\r\n}<\/code><\/pre>\n\n\n\n<p>Ya est\u00e1. Esperamos que esta gu\u00eda te haya ayudado.<\/p>\n\n\n\n<p>Si tienes m\u00e1s preguntas o alg\u00fan problema, ponte en contacto con nosotros. Siempre estamos aqu\u00ed para ayudarte.<\/p>","protected":false},"excerpt":{"rendered":"<p>Note: The Sticky Header feature is part of the Astra Pro Addon plugin. To use this feature, ensure that both the Astra theme and Astra Pro Addon are installed on your WordPress site. What\u2019s a Sticky Header? The Sticky Header feature in Astra allows you to fix the header at the top of the webpage [\u2026]<\/p>","protected":false},"author":20,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"default","ast-site-content-layout":"default","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":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"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":""},"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":""},"docs_category":[128],"docs_tag":[],"class_list":{"0":"post-24217","1":"docs","2":"type-docs","3":"status-publish","5":"docs_category-sticky-header"},"spectra_custom_meta":{"_wp_old_slug":["sticky-header|sticky-header","sticky-header|sticky-header"],"_yoast_wpseo_primary_docs_category":["128"],"_wp_page_template":["default"],"_edit_lock":["1707301210:89"],"_edit_last":["89"],"onesignal_meta_box_present":["1"],"onesignal_send_notification":[""],"site-sidebar-layout":["default"],"site-content-layout":["default"],"theme-transparent-header-meta":["default"],"_yoast_wpseo_content_score":["90"],"wpil_links_inbound_internal_count_data":["a:2:{i:0;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:43:\"https:\/\/wpastra.com\/docs\/sticky-header-pro\/\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:1;s:4:\"post\";O:15:\"Wpil_Model_Post\":5:{s:2:\"id\";s:5:\"24155\";s:5:\"title\";s:15:\"Header Overview\";s:4:\"type\";s:4:\"post\";s:7:\"content\";s:1276:\"<!-- wp:paragraph -->\n<p>Astra comes with several built-in header layouts which allows you to create the impressive header. You can easily design Sticky Header, Transparent Header and can add some extra sections to the header with addons. Astra Pro allows you to add custom headers where you can design headers with any page builder.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>To explore all options with headers, go through the following links.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li><a href=\"\/docs\/primary-header\/\">Primary Header Options\u00a0<\/a><\/li><li><a href=\"\/docs\/color-typography-primary-header\/\">Color and Typography for Primary Header<\/a><\/li><li><a href=\"https:\/\/wpastra.com\/docs\/astra-transparent-header\/\">Transparent Header<\/a><\/li><li><a href=\"https:\/\/wpastra.com\/docs\/header-sections-pro\/\">Header Sections - Above and Below Header ( with Astra Pro)<\/a><\/li><li><a href=\"https:\/\/wpastra.com\/docs\/sticky-header-pro\/\">Sticky Header (with Astra Pro)<\/a><\/li><li><a href=\"https:\/\/wpastra.com\/docs\/page-headers-overview\/\">Page Headers\u00a0(with Astra Pro)\u00a0<\/a><\/li><li><a rel=\"noopener noreferrer\" href=\"https:\/\/wpastra.com\/docs\/mobile-header-with-astra\/\" target=\"_blank\">Mobile Header with Astra (with Astra Pro)\u00a0<\/a><\/li><\/ul>\n<!-- \/wp:list -->\";s:5:\"links\";O:8:\"stdClass\":4:{s:4:\"view\";s:41:\"https:\/\/wpastra.com\/docs\/header-overview\/\";s:4:\"edit\";N;s:6:\"export\";s:68:\"https:\/\/wpastra.com\/wp-admin\/post.php?area=wpil_export&post_id=24155\";s:7:\"refresh\";s:99:\"https:\/\/wpastra.com\/wp-admin\/admin.php?page=link_whisper&type=post_links_count_update&post_id=24155\";}}s:6:\"anchor\";s:30:\"Sticky Header (with Astra Pro)\";s:15:\"added_by_plugin\";b:0;}i:1;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:43:\"https:\/\/wpastra.com\/docs\/sticky-header-pro\/\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:1;s:4:\"post\";O:15:\"Wpil_Model_Post\":5:{s:2:\"id\";s:5:\"30662\";s:5:\"title\";s:38:\"Astra Options that won't work with AMP\";s:4:\"type\";s:4:\"post\";s:7:\"content\";s:4763:\"<!-- wp:paragraph -->\n<p>As we know AMP does not allow JS to render on mobile devices. It also restricts the CSS size to 50 KB. Some advanced options from Astra theme and Astra Pro needs JS and extra CSS to work. With the restriction of JS and CSS, some Astra options will not work when AMP is enabled.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Though some Astra options will not work on AMP pages, switching to AMP with these options will not break anything on your website.  These features will be replaced by alternative options from the Astra itself. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Below is the list for the Astra Pro addons that will not work with AMP -<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li><strong>Above and Below Header<\/strong> - If above\/below header is designed with Astra Pro's <a rel=\"dofollow noopener noreferrer\" aria-label=\"Header Sections (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/header-sections-pro\/\" target=\"_blank\">Header Sections<\/a> addon then it will not appear on AMP pages.<\/li><li><strong>Sticky Header <\/strong>- Header designed with Astra Pro's <a rel=\"dofollow noopener noreferrer\" aria-label=\"Sticky Header (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/sticky-header-pro\/\" target=\"_blank\">Sticky Header<\/a> addon will not work on AMP pages as it needs JS to work.<\/li><li><strong>Scroll To Top<\/strong> - If you have enabled Astra Pro's<a rel=\"dofollow noopener noreferrer\" aria-label=\" Scroll To Top (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/scroll-to-top-pro\/\" target=\"_blank\"> Scroll To Top<\/a> addon, it will not display on AMP pages.<\/li><li><strong>Mega Menu<\/strong> - The feature offered by Astra Pro's <a rel=\"dofollow noopener noreferrer\" aria-label=\"Nav Menu (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/nav-menu-addon\/\" target=\"_blank\">Nav Menu<\/a> addon will not work on AMP pages. All menu items will display as a normal drop-down. Template added from the page builder will not display, instead of the template a menu item text will display.<\/li><li><strong>Custom Layouts<\/strong> - Layouts designed with page builder in <a rel=\"dofollow noopener noreferrer\" href=\"https:\/\/wpastra.com\/docs\/custom-layouts-pro\/\" target=\"_blank\">Custom Layouts<\/a> addon will display without any style. If page builder used is not supported by AMP then only content from the layout will display and AMP will skip the style. So it is recommended to disable custom layout on AMP. You can find a setting on individual Custom Layout (<a href=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/03\/disable-custom-layout-for-amp.png\" target=\"_blank\" rel=\"dofollow noopener noreferrer\" aria-label=\"Screenshot (opens in a new tab)\">Screenshot<\/a>).<\/li><\/ul>\n<!-- \/wp:list -->\n\n<!-- wp:paragraph -->\n<p>Apart from the above, some options from other Astra Pro addons will not work. They are as follows - <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:list -->\n<ul><li><strong>Search Style<\/strong> - Advanced <a rel=\"dofollow noopener noreferrer\" aria-label=\"search styles (opens in a new tab)\" href=\"https:\/\/wpastra.com\/introducing-search-styles\/\" target=\"_blank\">search styles<\/a> like Full-screen, Header cover search, the Search box will not work on AMP pages. Only slide<\/li><li><strong>Menu Style<\/strong> for Mobile Header - Astra Pro's Mobile Header addon provide options for <a rel=\"dofollow noopener noreferrer\" href=\"https:\/\/wpastra.com\/docs\/mobile-header-with-astra\/#menu-style\" target=\"_blank\">Menu Style<\/a> - Flyout, Full-Screen, No Toggle style. These styles will not work on AMP pages. Instead of these styles, a simple drop-down menu will display.<\/li><li><strong>Toggle Button Style and color <\/strong>- For Mobile header, <a rel=\"dofollow noopener noreferrer\" aria-label=\"Toggle Button styles (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/mobile-header-with-astra\/#toggle-button-style-toggle-button-color-and-border-radius\" target=\"_blank\">Toggle Button styles<\/a> like <g class=\"gr_ gr_14 gr-alert gr_gramm gr_inline_cards gr_disable_anim_appear Grammar only-ins doubleReplace replaceWithoutSep\" id=\"14\" data-gr-id=\"14\">outline<\/g>, minimal and Toggle Button Color will not work. Instead of this a default Fill style will be applied with theme base color.<\/li><li><strong>Infinite Scroll<\/strong> on blog\/archive page - Astra Pro's Blog pro addon offers <a rel=\"dofollow noopener noreferrer\" aria-label=\"pagination  (opens in a new tab)\" href=\"https:\/\/wpastra.com\/docs\/blog-archive-blog-pro\/#post-pagination\" target=\"_blank\">pagination <\/a>option. If you select Infinite Scroll for blog\/archive page, it will not work on AMP pages as it needs JS. Instead of the infinite scroll, pagination will be replaced with numbers.<\/li><\/ul>\n<!-- \/wp:list -->\";s:5:\"links\";O:8:\"stdClass\":4:{s:4:\"view\";s:63:\"https:\/\/wpastra.com\/docs\/astra-options-that-wont-work-with-amp\/\";s:4:\"edit\";N;s:6:\"export\";s:68:\"https:\/\/wpastra.com\/wp-admin\/post.php?area=wpil_export&post_id=30662\";s:7:\"refresh\";s:99:\"https:\/\/wpastra.com\/wp-admin\/admin.php?page=link_whisper&type=post_links_count_update&post_id=30662\";}}s:6:\"anchor\";s:13:\"Sticky Header\";s:15:\"added_by_plugin\";b:0;}}"],"wpil_links_outbound_internal_count_data":["a:0:{}"],"wpil_links_outbound_external_count_data":["a:7:{i:0;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:34:\"https:\/\/wordpress.org\/themes\/astra\";s:4:\"host\";s:13:\"wordpress.org\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:11:\"Astra theme\";s:15:\"added_by_plugin\";b:0;}i:1;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:63:\"https:\/\/wpastra.com\/docs\/how-to-install-astra-pro-addon-plugin\/\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:38:\"How to Install Astra Pro Addon plugin?\";s:15:\"added_by_plugin\";b:0;}i:2;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:72:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:115:\"<img src=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header.png\" alt=\"\" class=\"wp-image-39671\"\/>\";s:15:\"added_by_plugin\";b:0;}i:3;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:74:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header-2.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:126:\"<img src=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header-2-1024x495.png\" alt=\"\" class=\"wp-image-39675\"\/>\";s:15:\"added_by_plugin\";b:0;}i:4;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:74:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/10\/ast-2-stikcy-header-pro.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:3:\"(?)\";s:15:\"added_by_plugin\";b:0;}i:5;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:74:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header-3.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:117:\"<img src=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-header-3.png\" alt=\"\" class=\"wp-image-39680\"\/>\";s:15:\"added_by_plugin\";b:0;}i:6;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:70:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-logo.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:113:\"<img src=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/08\/astra-2-sticky-logo.png\" alt=\"\" class=\"wp-image-39684\"\/>\";s:15:\"added_by_plugin\";b:0;}}"],"tap_disable_autolinker":["no"],"tap_autolink_inside_heading":["global"],"tap_autolink_random_placement":["global"],"tap_post_autolinker_limit":["0"],"_yoast_wpseo_title":["How to Add a Sticky Header or On-scroll Fixed Header with Astra?"],"_ppc_meta_key":["a:8:{s:20:\"ppc_key5d92f85d42273\";s:60:\"Images &amp; Names Correctly. Title &amp; Alt Tags are Given\";s:8:\"ppc_key4\";s:15:\"Formatting Done\";s:8:\"ppc_key2\";s:23:\"Featured Image Assigned\";s:8:\"ppc_key3\";s:17:\"Category Selected\";s:8:\"ppc_key5\";s:15:\"Title is Catchy\";s:8:\"ppc_key6\";s:22:\"Social Images Assigned\";s:8:\"ppc_key7\";s:8:\"Done SEO\";s:8:\"ppc_key8\";s:28:\"Spelling and Grammar Checked\";}"],"astra_style_timestamp_css":["1573724528"],"_oembed_e9ee6acafbbeac8b2e2f5e30d6d7f270":["<iframe title=\"Sticky Header in Astra Header Footer Builder\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>"],"_oembed_time_e9ee6acafbbeac8b2e2f5e30d6d7f270":["1707120338"],"_yoast_wpseo_estimated-reading-time-minutes":["4"],"_oembed_8d3386584a79b0fca56c8ba29aa016fd":["<iframe title=\"Sticky Header in Astra Header Footer Builder\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>"],"_oembed_time_8d3386584a79b0fca56c8ba29aa016fd":["1610608763"],"_ht_kb_post_views_count":["58"],"_ht_kb_usefulness":["0"],"_ht_article_order_128":["24217"],"wp_last_modified_info":["April 10, 2023 @ 5:31 PM"],"wplmi_shortcode":["[lmt-post-modified-info]"],"views":["63054"],"helpful":["104"],"unhelpful":["119"],"redirects":["100"],"rank_math_primary_docs_category":["128"],"rank_math_title":["How to Add a Sticky Header or On-scroll Fixed Header with Astra?"],"rank_math_news_sitemap_robots":["index"],"rank_math_robots":["a:1:{i:0;s:5:\"index\";}"],"rank_math_analytic_object_id":["1249"],"rank_math_schema_VideoObject":["a:12:{s:5:\"@type\";s:11:\"VideoObject\";s:8:\"metadata\";a:8:{s:5:\"title\";s:5:\"Video\";s:4:\"type\";s:8:\"template\";s:9:\"shortcode\";s:15:\"s-62162a700498b\";s:9:\"isPrimary\";b:1;s:23:\"reviewLocationShortcode\";s:24:\"[rank_math_rich_snippet]\";s:8:\"category\";s:12:\"%categories%\";s:4:\"tags\";s:6:\"%tags%\";s:15:\"isAutoGenerated\";b:1;}s:4:\"name\";s:44:\"Sticky Header in Astra Header Footer Builder\";s:11:\"description\";s:174:\"Don&#39;t forget to watch these videos as well \ud83d\udc47\ud83c\udffcAstra Header Footer Builder Walkthrough \ud83d\udc49\ud83c\udffc  https:\/\/youtu.be\/blvToYnfa18Transparent Header in Astra Theme \ud83d\udc49...\";s:10:\"uploadDate\";s:10:\"2021-01-13\";s:12:\"thumbnailUrl\";s:79:\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2022\/02\/maxresdefault-10.jpg\";s:8:\"embedUrl\";s:41:\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA\";s:10:\"contentUrl\";s:0:\"\";s:8:\"duration\";s:8:\"PT13M17S\";s:5:\"width\";s:4:\"1280\";s:6:\"height\";s:3:\"720\";s:16:\"isFamilyFriendly\";b:1;}"],"rank_math_seo_score":["22"],"rank_math_internal_links_processed":["1"],"_wplmi_last_modified":["2023-04-10 17:31:12"],"rank_math_og_content_image":["a:2:{s:5:\"check\";s:32:\"a1399f17697a2ef1e8dd58f73ee2732a\";s:6:\"images\";a:0:{}}"],"_wpml_media_duplicate":["1"],"_trp_automatically_translated_slug_es_ES":["sticky-header-pro"],"_oembed_046f6d81d695f6e030689f343a56524b":["<iframe title=\"Sticky Header in Astra Header Footer Builder\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>"],"_oembed_time_046f6d81d695f6e030689f343a56524b":["1707122494"],"_uag_custom_page_level_css":[""],"ast-site-content-layout":["default"],"adv-header-id-meta":[""],"stick-header-meta":[""],"astra-migrate-meta-layouts":["set"],"_oembed_e94596ba54923f57fe6e009bfcf6cfe5":["<iframe title=\"Sticky Header in Astra Header Footer Builder\" width=\"1200\" height=\"675\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>"],"_oembed_time_e94596ba54923f57fe6e009bfcf6cfe5":["1707122182"],"pfd_related_docs":[""],"_oembed_0d6cfb7be88e913365dd4ac9b29a25ff":["<iframe title=\"Sticky Header in Astra Header Footer Builder\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/gVsQJAniUfA?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>"],"_oembed_time_0d6cfb7be88e913365dd4ac9b29a25ff":["1713810027"],"_uag_page_assets":["a:9:{s:3:\"css\";s:2495:\".wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-top svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-top .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-bottom svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-bottom .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__video-wrap video{opacity: 1;}.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1200px);max-width: var(--inner-content-custom-width);width: 100%;flex-direction: column;align-items: center;justify-content: center;flex-wrap: nowrap;row-gap: 0px;column-gap: 0px;}.wp-block-uagb-container.uagb-block-debf2792{box-shadow: 0px 0px   #00000070 ;padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;overflow: visible;border-color: inherit;row-gap: 0px;column-gap: 0px;}@media only screen and (max-width: 976px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1024px);max-width: var(--inner-content-custom-width);width: 100%;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}@media only screen and (max-width: 767px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 767px);max-width: var(--inner-content-custom-width);width: 100%;flex-wrap: wrap;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}\";s:2:\"js\";s:0:\"\";s:18:\"current_block_list\";a:9:{i:0;s:14:\"core\/paragraph\";i:1;s:12:\"core\/heading\";i:2;s:10:\"core\/embed\";i:3;s:9:\"core\/list\";i:4;s:14:\"core\/list-item\";i:5;s:10:\"core\/image\";i:6;s:9:\"core\/code\";i:7;s:14:\"uagb\/container\";i:8;s:14:\"core\/shortcode\";}s:8:\"uag_flag\";b:1;s:11:\"uag_version\";s:10:\"1776850981\";s:6:\"gfonts\";a:0:{}s:10:\"gfonts_url\";s:0:\"\";s:12:\"gfonts_files\";a:0:{}s:14:\"uag_faq_layout\";b:0;}"]},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"Anjali","author_link":"https:\/\/git-staging.wpastra.com\/es\/author\/anjalic\/"},"uagb_comment_info":0,"uagb_excerpt":"Note: The Sticky Header feature is part of the Astra Pro Addon plugin. To use this feature, ensure that both the Astra theme and Astra Pro Addon are installed on your WordPress site. What\u2019s a Sticky Header? The Sticky Header feature in Astra allows you to fix the header at the top of the webpage&hellip;","_links":{"self":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/24217"}],"collection":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/comments?post=24217"}],"version-history":[{"count":0,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/24217\/revisions"}],"wp:attachment":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/media?parent=24217"}],"wp:term":[{"taxonomy":"docs_category","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_category?post=24217"},{"taxonomy":"docs_tag","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_tag?post=24217"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}