{"id":253747,"date":"2022-03-29T11:11:00","date_gmt":"2022-03-29T08:11:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=253747"},"modified":"2022-05-16T14:52:57","modified_gmt":"2022-05-16T11:52:57","slug":"como-agregar-una-caja-de-luz-a-wordpress-en-5-minutos","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/es\/como-agregar-una-caja-de-luz-a-wordpress-en-5-minutos\/","title":{"rendered":"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)"},"content":{"rendered":"<p>No hagas que tus visitantes entrecerren los ojos.<\/p>\n<p>Las im\u00e1genes insertadas en sus publicaciones tienen solo unos pocos cientos de p\u00edxeles de ancho, lo que puede hacer que los peque\u00f1os detalles sean dif\u00edciles de ver.<\/p>\n<p>Si tienes fotos hermosas o gr\u00e1ficos detallados, \u00a1deja que tus visitantes las vean en todo su esplendor!<\/p>\n<p>Con una caja de luz agregada a su sitio, los visitantes podr\u00e1n hacer clic en una imagen y ver la versi\u00f3n de tama\u00f1o completo en una ventana emergente, como esta:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f07a33d1.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f07a33d1.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Obtienes lo mejor de ambos mundos. Todav\u00eda muestra una versi\u00f3n m\u00e1s peque\u00f1a de la imagen que se adapta bien a su publicaci\u00f3n y se carga r\u00e1pidamente, pero tambi\u00e9n ofrece una versi\u00f3n mucho m\u00e1s grande y de tama\u00f1o completo de la imagen para cualquiera que quiera verla.<\/p>\n<p>Siga los pasos de este tutorial y tendr\u00e1 una caja de luz agregada a su sitio de WordPress en solo unos minutos.<\/p>\n<p>Si desea agregar una caja de luz a su tienda de comercio electr\u00f3nico, consulte <a href=\"https:\/\/www.competethemes.com\/blog\/woocommerce-lightbox-plugins\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">esta colecci\u00f3n de complementos de caja de luz de WooCommerce<\/a>.<\/p>\n<h2>Agregue cajas de luz a su sitio<\/h2>\n<p>Si bien hay algunas opciones avanzadas disponibles, me gusta simplificar las cosas. Es por eso que recomiendo el complemento <a href=\"https:\/\/wordpress.org\/plugins\/simple-lightbox\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Simple Lightbox<\/a> de Archetyped.<\/p>\n<p><a href=\"https:\/\/wordpress.org\/plugins\/simple-lightbox\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external\"><img decoding=\"async\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f09becca.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\" \/><\/a><\/p>\n<p>Este complemento de WordPress sin lujos le brinda exactamente la funcionalidad que necesita sin ning\u00fan tipo de hinchaz\u00f3n.<\/p>\n<p>Puede descargar el complemento de wordpress.org o buscarlo a trav\u00e9s del men\u00fa Complementos para instalarlo en su sitio ahora.<\/p>\n<p>Con el complemento Simple Lightbox instalado, encontrar\u00e1 un nuevo men\u00fa llamado &quot;Lightbox&quot; en el men\u00fa Apariencia en su panel de administraci\u00f3n:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0c13bec.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0c13bec.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Solo se necesitan unos pocos pasos para configurar completamente el complemento para su sitio.<\/p>\n<h3>Configurar la caja de luz<\/h3>\n<p>La primera secci\u00f3n, Activaci\u00f3n, controla qu\u00e9 im\u00e1genes deben tener una caja de luz.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0e12a76.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0e12a76.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Como puede ver, puede elegir los tipos de p\u00e1gina que desea que se vean afectados, y todas las im\u00e1genes que se encuentren dentro del contenido de esas p\u00e1ginas tendr\u00e1n activada la funci\u00f3n de caja de luz.<\/p>\n<p>Para la mayor\u00eda de las personas, esta configuraci\u00f3n funcionar\u00e1 mejor:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0fe2fc3.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f0fe2fc3.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Con esta configuraci\u00f3n, todas las im\u00e1genes en las publicaciones de su blog tendr\u00e1n la caja de luz habilitada, pero no afectar\u00e1 las im\u00e1genes en otras p\u00e1ginas de su sitio (como su p\u00e1gina &quot;Acerca de&quot; y la p\u00e1gina de inicio).<\/p>\n<p>Antes de seguir adelante, hay un problema que debemos abordar &#8230;<\/p>\n<h3>El \u00fanico problema molesto<\/h3>\n<p>Para que la caja de luz funcione, debe vincular sus im\u00e1genes a sus archivos multimedia, as\u00ed:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f1212783.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f1212783.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Antes de que WordPress agregara el nuevo editor, pod\u00eda configurar todas sus im\u00e1genes para vincularlas a sus archivos multimedia autom\u00e1ticamente, pero ahora debe vincularlas manualmente usando la barra de herramientas, como se muestra en la captura de pantalla anterior.<\/p>\n<p>Todos los complementos de la caja de luz funcionan de esta manera, por lo que es un requisito vincular las im\u00e1genes a sus archivos multimedia.<\/p>\n<p>Entonces, \u00bfqu\u00e9 significa esto para su sitio?<\/p>\n<p>Significa que cuando habilita la caja de luz para sus publicaciones, las im\u00e1genes en sus publicaciones no tendr\u00e1n una caja de luz hasta que las vincule a su archivo multimedia y deber\u00e1 hacerlo para cada imagen que desee que tenga una caja de luz.<\/p>\n<p>Esto ralentiza las cosas en comparaci\u00f3n con c\u00f3mo sol\u00eda funcionar, pero le da un control total sobre qu\u00e9 im\u00e1genes tienen una caja de luz.<\/p>\n<p>Con eso fuera del camino, terminemos de configurar el complemento.<\/p>\n<p>Si bien la opci\u00f3n de enlace predeterminada no est\u00e1 disponible en este momento, hay buenas razones para creer que los desarrolladores de WP la volver\u00e1n a agregar en una actualizaci\u00f3n futura.<\/p>\n<h3>Crear presentaciones de diapositivas lightbox<\/h3>\n<p>Es posible que est\u00e9 satisfecho con una caja de luz simple, pero la opci\u00f3n de agrupaci\u00f3n puede ser pr\u00e1ctica para algunos sitios web.<\/p>\n<p>El complemento Simple Lightbox puede tomar todas las im\u00e1genes de su publicaci\u00f3n y convertirlas en una <a href=\"https:\/\/themewp.inform.click\/es\/como-agregar-un-control-deslizante-de-imagen-a-su-pagina-de-inicio\/\" title=\"presentaci\u00f3n de diapositivas\">presentaci\u00f3n de diapositivas<\/a>. Con esta funci\u00f3n activada, cuando un visitante hace clic en una imagen, ver\u00e1 la <a href=\"https:\/\/themewp.inform.click\/es\/como-agregar-hermosos-formularios-emergentes-a-wordpress\/\" title=\"ventana emergente\">ventana emergente<\/a> normal pero con flechas agregadas a los lados para que pueda navegar a trav\u00e9s de cada imagen en la publicaci\u00f3n.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f155dc98.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f155dc98.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>La presentaci\u00f3n de diapositivas tambi\u00e9n les permite a los visitantes saber cu\u00e1ntas im\u00e1genes hay en la serie en la parte inferior izquierda, y hay un bot\u00f3n de reproducci\u00f3n \/ pausa en la parte superior derecha junto al bot\u00f3n de cierre.<\/p>\n<p>La caja de luz de presentaci\u00f3n de diapositivas puede o no tener sentido para su sitio, pero es f\u00e1cil desactivarla en la configuraci\u00f3n de Agrupaci\u00f3n si no le gusta.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f17bd07f.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f17bd07f.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Si a menudo <a href=\"https:\/\/themewp.inform.click\/es\/como-crear-una-galeria-de-imagenes-con-wordpress\/\" title=\"agrega varias galer\u00edas\">agrega varias galer\u00edas<\/a> a sus publicaciones, puede marcar la tercera casilla para que Simple Lightbox mantenga las presentaciones de diapositivas separadas.<\/p>\n<p>Si bien el dise\u00f1o predeterminado de la caja de luz es simple y limpio, hay algunas configuraciones de personalizaci\u00f3n disponibles.<\/p>\n<h3>Personaliza los estilos<\/h3>\n<p>Solo hay dos temas (claro y oscuro) y el tema oscuro simplemente reemplaza el borde blanco con un borde negro.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f19b9e1f.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f19b9e1f.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Recomendar\u00eda dejar la mayor\u00eda de las configuraciones como est\u00e1n, pero personalmente, considero que la funci\u00f3n de presentaci\u00f3n autom\u00e1tica de diapositivas es disruptiva, as\u00ed que la tacho. Adem\u00e1s, puede habilitar la visualizaci\u00f3n de los t\u00edtulos de las im\u00e1genes desactivando la \u00faltima opci\u00f3n.<\/p>\n<p>Una vez terminadas las personalizaciones, solo queda un \u00faltimo peque\u00f1o paso para completar la configuraci\u00f3n.<\/p>\n<h3>Personaliza las etiquetas<\/h3>\n<p>Simple Lightbox incluye etiquetas para todos los botones en el lightbox.<\/p>\n<p>Es confuso sin alguna informaci\u00f3n de fondo: estas etiquetas no son realmente visibles en el sitio, sino que son una <a href=\"https:\/\/themewp.inform.click\/es\/los-7-mejores-temas-de-wordpress-accesibles-wcag-2-1-aa\/\" title=\"funci\u00f3n de accesibilidad\">funci\u00f3n de accesibilidad<\/a> y se utilizan para los visitantes que usan lectores de pantalla y tecnolog\u00eda de asistencia.<\/p>\n<p>Las etiquetas predeterminadas son sensatas, pero puede personalizarlas en la secci\u00f3n Etiquetas si lo desea:<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f1bb2af7.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-181201-616f5f1bb2af7.png\" alt=\"C\u00f3mo agregar una caja de luz a WordPress (en 5 minutos)\"><\/a><\/p>\n<p>Con eso, ha terminado de personalizar la caja de luz ahora agregada a su sitio de WordPress.<\/p>\n<h2>Disfruta tu nueva caja de luz<\/h2>\n<p>Los lightboxes son excelentes para la experiencia del usuario.<\/p>\n<p>Si expandiera el ancho de sus publicaciones para agregar im\u00e1genes m\u00e1s grandes, da\u00f1ar\u00eda la legibilidad de su texto y los archivos de imagen m\u00e1s grandes ralentizar\u00edan su sitio.<\/p>\n<p>Con una caja de luz, puede brindar a sus visitantes una excelente experiencia de lectura y una excelente experiencia de visualizaci\u00f3n de sus im\u00e1genes.<\/p>\n<p>Si disfrut\u00f3 de este tutorial y desea seguir personalizando m\u00e1s, consulte mi gu\u00eda definitiva: <a href=\"https:\/\/themewp.inform.click\/es\/31-formas-sencillas-de-personalizar-su-sitio-web-de-wordpress\/\" title=\"31 formas f\u00e1ciles de personalizar su sitio de WordPress\">31 formas f\u00e1ciles de personalizar su sitio de WordPress<\/a>.<\/p>\n<p>Gracias por leer, y por favor comparta esta publicaci\u00f3n si le ayud\u00f3.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fuente de grabaci\u00f3n:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/www.competethemes.com\" class=\"external external_icon\">www.competethemes.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Siga estos sencillos pasos para agregar una caja de luz a su sitio de WordPress. Se incluyen opciones para presentaciones de diapositivas lightbox.<\/p>\n","protected":false},"author":1,"featured_media":257377,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[546],"tags":[849],"class_list":["post-253747","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-personalizar-wordpress","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/253747","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/comments?post=253747"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/253747\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media\/257377"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media?parent=253747"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/categories?post=253747"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/tags?post=253747"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}