{"id":300,"date":"2018-10-02T22:18:50","date_gmt":"2018-10-03T03:18:50","guid":{"rendered":"https:\/\/www.quierotec.com\/?p=300"},"modified":"2018-10-02T22:18:50","modified_gmt":"2018-10-03T03:18:50","slug":"widget-flotante-wordpress","status":"publish","type":"post","link":"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/","title":{"rendered":"Como hacer un widget fijo flotante en el sidebar [Tip wordpress]"},"content":{"rendered":"<h4>Pon fijo y a flotar un widget del sidebar YA!<\/h4>\n<p>Siempre es importante destacar algun contenido que sea de importancia para la web. Ya sea un producto que deseas vender, mostrar un anuncio de adsense, o simplemente poner una imagen cualquiera. Esto tiene mejores resultados. Por eso <strong>aprende a hacer tu widget\u00a0din\u00e1mico\u00a0y flotante<\/strong>!<\/p>\n<p>Si haces un <strong>contenido flotante<\/strong> conseguir\u00e1s llamar la atenci\u00f3n de las personas que visiten tu p\u00e1gina web. Quiere decir que \u00abobligaras\u00bb a que vean lo que muestras ahi, y asi tendras <strong>mejor porcentaje de clics<\/strong>.<\/p>\n<p>Los elementos flotantes que se adhieren a la pantalla mientras se desplaza tienden a tener un mayor porcentaje de clics y conversiones que los objetos est\u00e1ticos. Esta es la raz\u00f3n por la cual muchos sitios web hacen uso de elementos flotantes a trav\u00e9s de su sitio web.<\/p>\n<p>Hemos visto elementos como la barra de encabezado, la barra de pie de p\u00e1gina, el widget de la barra lateral con el bolet\u00edn informativo optin, etc. Ahora mismo, le mostramos un widget que\u00a0est\u00e1\u00a0flotando en el sidebar\u00a0como la que usamos en Quierotec.<\/p>\n<p>En este art\u00edculo, le mostraremos <strong>c\u00f3mo crear un widget de barra lateral flotante en WordPress<\/strong>, para que pueda hacer que su\u00a0bolet\u00edn electr\u00f3nico se destaque a\u00fan m\u00e1s.<\/p>\n<p><strong>Nota:<\/strong> Esto funciona para todo tipo de widgets de la barra lateral, no solo sus opciones de correo electr\u00f3nico. Puede usarlo para promociones de productos, publicaciones populares, fotos\u00a0, calendario\u00a0y b\u00e1sicamente todo lo que desee.<\/p>\n<h2>3 Pasos para configurar widgets flotantes<\/h2>\n<p>Primero ingresa a tu<strong> wordpress<\/strong> y necesitamos que instales el plugin\u00a0<a href=\"http:\/\/wordpress.org\/extend\/plugins\/q2w3-fixed-widget\/\">Q2W3 Fixed Widget (Sticky Widget)<\/a>\u00a0, una vez instalado y activado estamos listos.<\/p>\n<p>Segundo dirigirnos a la opci\u00f3n Apariencia &gt; Widgets y nos muestra los widgets activos en nuestro<strong> sidebar<\/strong>.<\/p>\n<p>Tercero elegimos el widget que deseamos que flote durante el desplazamiento del usuario. Y seleccionamos la casilla \u00ab<strong>Fixed Widget<\/strong>\u00ab. Listo ya tendremos nuestro <strong>widget flotante<\/strong>.<\/p>\n<p>Por ejemplo en la imagen de abajo yo quiero hacer un widget de video que flote en el sidebar.<\/p>\n<p><img loading=\"lazy\" class=\"aligncenter size-full wp-image-303\" src=\"https:\/\/www.quierotec.com\/wp-content\/uploads\/2018\/10\/widget-configurado-para-flotar-en-el-sidebar.png\" alt=\"Configurando widget fijo flotante en el sidebar de wordpress\" width=\"617\" height=\"541\" srcset=\"https:\/\/www.enciendedigital.com\/tecnologia\/wp-content\/uploads\/2018\/10\/widget-configurado-para-flotar-en-el-sidebar.png 617w, https:\/\/www.enciendedigital.com\/tecnologia\/wp-content\/uploads\/2018\/10\/widget-configurado-para-flotar-en-el-sidebar-300x263.png 300w\" sizes=\"(max-width: 617px) 100vw, 617px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>Espero que este art\u00edculo haya ayudado para implementar <strong>widget flotante en la barra lateral de tu web con WordPress<\/strong>. Si te gusto compartelo en las redes sociales, o sino dejanos un comentario para saber como te fue. Gracias por leer!<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-left kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;left&quot;,&quot;id&quot;:&quot;300&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;7&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;4.7&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;5&quot;,&quot;greet&quot;:&quot;Rate this post&quot;,&quot;legend&quot;:&quot;4.7\\\/5 - (7 votos)&quot;,&quot;size&quot;:&quot;24&quot;,&quot;title&quot;:&quot;Como hacer un widget fijo flotante en el sidebar [Tip wordpress]&quot;,&quot;width&quot;:&quot;133.8&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 133.8px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 5px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 24px; height: 24px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 19.2px;\">\n            4.7\/5 - (7 votos)    <\/div>\n    <\/div>\n<!-- AddThis Advanced Settings generic via filter on the_content --><!-- AddThis Share Buttons generic via filter on the_content -->","protected":false},"excerpt":{"rendered":"<p>Pon fijo y a flotar un widget del sidebar YA! Siempre es importante destacar algun contenido que sea de importancia para la web. Ya sea un producto que deseas vender, mostrar un anuncio de adsense, o simplemente poner una imagen cualquiera. Esto tiene mejores resultados. Por eso aprende a hacer tu widget\u00a0din\u00e1mico\u00a0y flotante! Si haces &#8230; <a title=\"Como hacer un widget fijo flotante en el sidebar [Tip wordpress]\" class=\"read-more\" href=\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/\" aria-label=\"Leer m\u00e1s sobre Como hacer un widget fijo flotante en el sidebar [Tip wordpress]\">Leer m\u00e1s<\/a><!-- AddThis Advanced Settings generic via filter on get_the_excerpt --><!-- AddThis Share Buttons generic via filter on get_the_excerpt --><\/p>\n","protected":false},"author":1,"featured_media":302,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[34],"tags":[47],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v15.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u25b7 Como hacer un Widget Fijo FLOTANTE en el Sidebar [TIP Wordpress]<\/title>\n<meta name=\"description\" content=\"Siempre es importante destacar contenidos en el sitio de Wordpress. Por eso aprende a hacer tu widget fijo flotante en el sidebar de tu p\u00e1gina web!\" \/>\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.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u25b7 Como hacer un Widget Fijo FLOTANTE en el Sidebar [TIP Wordpress]\" \/>\n<meta property=\"og:description\" content=\"Siempre es importante destacar contenidos en el sitio de Wordpress. Por eso aprende a hacer tu widget fijo flotante en el sidebar de tu p\u00e1gina web!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Quierotec\" \/>\n<meta property=\"article:published_time\" content=\"2018-10-03T03:18:50+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.enciendedigital.com\/tecnologia\/wp-content\/uploads\/2018\/10\/Como-hacer-un-Widget-Flotante-en-el-sidebar.png\" \/>\n\t<meta property=\"og:image:width\" content=\"698\" \/>\n\t<meta property=\"og:image:height\" content=\"388\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@soloquierotec\" \/>\n<meta name=\"twitter:site\" content=\"@soloquierotec\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\">\n\t<meta name=\"twitter:data1\" content=\"2 minutos\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#website\",\"url\":\"https:\/\/www.enciendedigital.com\/tecnologia\/\",\"name\":\"Quierotec\",\"description\":\"Tu blog de tecnologia\",\"publisher\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#\/schema\/person\/27ad103f507aa2f709107103081587ca\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/www.enciendedigital.com\/tecnologia\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"es\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#primaryimage\",\"inLanguage\":\"es\",\"url\":\"https:\/\/www.enciendedigital.com\/tecnologia\/wp-content\/uploads\/2018\/10\/Como-hacer-un-Widget-Flotante-en-el-sidebar.png\",\"width\":698,\"height\":388,\"caption\":\"como hacer un widget fijo flotante en wordpress\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#webpage\",\"url\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/\",\"name\":\"\\u25b7 Como hacer un Widget Fijo FLOTANTE en el Sidebar [TIP Wordpress]\",\"isPartOf\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#primaryimage\"},\"datePublished\":\"2018-10-03T03:18:50+00:00\",\"dateModified\":\"2018-10-03T03:18:50+00:00\",\"description\":\"Siempre es importante destacar contenidos en el sitio de Wordpress. Por eso aprende a hacer tu widget fijo flotante en el sidebar de tu p\\u00e1gina web!\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/\"]}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#\/schema\/person\/27ad103f507aa2f709107103081587ca\"},\"headline\":\"Como hacer un widget fijo flotante en el sidebar [Tip wordpress]\",\"datePublished\":\"2018-10-03T03:18:50+00:00\",\"dateModified\":\"2018-10-03T03:18:50+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#\/schema\/person\/27ad103f507aa2f709107103081587ca\"},\"image\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#primaryimage\"},\"keywords\":\"wordpress\",\"articleSection\":\"CMS\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.enciendedigital.com\/tecnologia\/widget-flotante-wordpress\/#respond\"]}]},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#\/schema\/person\/27ad103f507aa2f709107103081587ca\",\"name\":\"Jesus Calixto\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#personlogo\",\"inLanguage\":\"es\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/2a32e8c220589788e4fa29b1961612ca?s=96&d=mm&r=g\",\"caption\":\"Jesus Calixto\"},\"logo\":{\"@id\":\"https:\/\/www.enciendedigital.com\/tecnologia\/#personlogo\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","_links":{"self":[{"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/posts\/300"}],"collection":[{"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/comments?post=300"}],"version-history":[{"count":2,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/posts\/300\/revisions"}],"predecessor-version":[{"id":304,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/posts\/300\/revisions\/304"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/media\/302"}],"wp:attachment":[{"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/media?parent=300"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/categories?post=300"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.enciendedigital.com\/tecnologia\/wp-json\/wp\/v2\/tags?post=300"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}