<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:media="http://search.yahoo.com/mrss/" >

<channel>
	<title>Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles &#8211; GPC Studio</title>
	<atom:link href="https://gpcstudio.es/desarrollo-web/feed/" rel="self" type="application/rss+xml" />
	<link>https://gpcstudio.es</link>
	<description>Diseño Web y mantenimiento de WordPress</description>
	<lastBuildDate>Wed, 31 Dec 2025 22:17:20 +0000</lastBuildDate>
	<language>es</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.1.1</generator>

<image>
	<url>https://gpcstudio.es/wp-content/uploads/2024/10/cropped-favicon-32x32.png</url>
	<title>Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles &#8211; GPC Studio</title>
	<link>https://gpcstudio.es</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Tres ecommerce que mejoraron ventas con 3D web</title>
		<link>https://gpcstudio.es/2026/01/08/tres-ecommerce-que-mejoraron-ventas-con-3d-web/</link>
					<comments>https://gpcstudio.es/2026/01/08/tres-ecommerce-que-mejoraron-ventas-con-3d-web/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Thu, 08 Jan 2026 09:01:00 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=25883</guid>

					<description><![CDATA[Llevo años trabajando con visualización 3D, primero en proyectos más tradicionales y desde hace tiempo integrándola en web. Y una de las preguntas que más]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Llevo años trabajando con visualización 3D, primero en proyectos más tradicionales y desde hace tiempo integrándola en web. Y una de las preguntas que más me hacen es si realmente funciona, si las empresas ven resultados tangibles al invertir en esta tecnología. La respuesta corta es sí, pero vamos a ver tres casos concretos que demuestran cómo el 3D web impacta directamente en las ventas.</p>





<h2 class="wp-block-heading">IKEA y su apuesta por el visualizador 3D</h2>



<p class="wp-block-paragraph">IKEA fue de los primeros grandes en apostar fuerte por la visualización 3D en su ecommerce. Su aplicación IKEA Place permite ver muebles en tu casa usando realidad aumentada desde el móvil, pero lo interesante es cómo esto ha cambiado el comportamiento de compra.</p>



<p class="wp-block-paragraph">Antes de implementar esta tecnología, uno de los mayores frenos para comprar muebles online era la incertidumbre. ¿Cabrá en mi salón? ¿Quedará bien con el resto de muebles? ¿El color encaja con mis paredes? Todas estas dudas hacían que mucha gente fuera a la tienda física o directamente no comprara.</p>



<p class="wp-block-paragraph">Con el visualizador 3D, el cliente puede colocar virtualmente ese sofá en su salón, caminar alrededor, ver cómo queda desde diferentes ángulos, probar distintos colores. IKEA reportó que los productos que los usuarios visualizan en 3D tienen tasas de conversión significativamente más altas que los que solo ven en fotos estáticas.</p>



<figure class="wp-block-image size-large"><img fetchpriority="high" decoding="async" width="1024" height="614" src="https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d-1024x614.webp" alt="" class="wp-image-25886" srcset="https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d-1024x614.webp 1024w, https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d-300x180.webp 300w, https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d-768x461.webp 768w, https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d-100x60.webp 100w, https://gpcstudio.es/wp-content/uploads/2025/12/ikea-3d.webp 1200w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">Pero lo más interesante no es solo que vendan más. También han reducido drásticamente las devoluciones. Cuando un cliente ve el mueble en su espacio real antes de comprarlo, las probabilidades de que luego no le guste o no encaje son mucho menores. Y las devoluciones en muebles son caras, muy caras.</p>



<h2 class="wp-block-heading">Amazon View y la integración de AR en millones de productos</h2>



<p class="wp-block-paragraph">Amazon tiene un problema de escala enorme. Millones de productos, miles de vendedores, y necesitan que la gente compre con confianza sin ver físicamente lo que están comprando. Su solución ha sido Amazon View, que permite visualizar miles de productos en realidad aumentada.</p>



<p class="wp-block-paragraph">Lo que me parece más inteligente de su enfoque es que no lo limitan a categorías obvias como muebles. Tienen desde electrodomésticos hasta juguetes, decoración, equipamiento deportivo. Cualquier cosa que te beneficie de ver en tu espacio real antes de comprar.</p>



<figure class="wp-block-image size-large"><img decoding="async" width="1024" height="542" src="https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d-1024x542.webp" alt="" class="wp-image-25887" srcset="https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d-1024x542.webp 1024w, https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d-300x159.webp 300w, https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d-768x406.webp 768w, https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d-100x53.webp 100w, https://gpcstudio.es/wp-content/uploads/2025/12/amazon-view-3d.webp 1200w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">Los datos que han compartido son claros: los productos con visualización AR tienen tasas de retorno un 40% más bajas que los que solo tienen fotos. Eso es brutal. Estamos hablando de millones de euros ahorrados solo en logística inversa.</p>



<p class="wp-block-paragraph">Además, han visto que los usuarios que usan la función AR pasan más tiempo explorando el producto, lo que típicamente se traduce en mayor intención de compra. No es solo «veo una foto y decido». Es «interactúo con el producto, lo pruebo virtualmente, me convenzo de que es lo que quiero».</p>



<h2 class="wp-block-heading">Apple y la experiencia premium en productos técnicos</h2>



<p class="wp-block-paragraph">Apple siempre ha sido obsesivo con la presentación de sus productos. Sus tiendas físicas están diseñadas para que toques, pruebes, experimentes. Trasladar esa experiencia a web era un reto enorme porque sus productos son premium y la gente quiere estar segura antes de soltar mil euros en un MacBook.</p>



<p class="wp-block-paragraph">Su implementación de visualización 3D en la web es magistral. Puedes rotar un iPhone, ver cada detalle, explorar los diferentes acabados, todo con renderizado en tiempo real que parece fotografía. No es un modelo 3D básico, es prácticamente indistinguible de fotos reales.</p>



<figure class="wp-block-image size-large"><img decoding="async" width="1024" height="615" src="https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-1024x615.webp" alt="" class="wp-image-25888" srcset="https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-1024x615.webp 1024w, https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-300x180.webp 300w, https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-768x461.webp 768w, https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-1536x922.webp 1536w, https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada-100x60.webp 100w, https://gpcstudio.es/wp-content/uploads/2025/12/apple-realidad-aumentada.webp 1994w" sizes="(max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">Lo que consiguen con esto es mantener ese «efecto wow» que tenían en tiendas físicas. La gente no solo ve el producto, lo explora. Y esa exploración genera engagement y confianza. Apple no ha publicado cifras concretas de conversión, pero el hecho de que lo hayan implementado en toda su web de productos dice mucho.</p>



<p class="wp-block-paragraph">También han ido más allá con AR, permitiendo ver cómo queda un HomePod en tu estantería o unas gafas Vision Pro en tu cara. La tecnología al servicio de reducir fricción en la decisión de compra.</p>



<h2 class="wp-block-heading">El caso más cercano: packaging en 3D para Cartrix</h2>



<p class="wp-block-paragraph">Hace poco hice un proyecto experimental con Cartrix, una empresa de packaging especializada en cajas para sushi. Nada que ver con la escala de IKEA o Amazon, pero el concepto es el mismo: permitir que el cliente vea el producto antes de fabricarlo.</p>



<p class="wp-block-paragraph">En su caso, los restaurantes necesitan ver cómo va a quedar su caja de sushi con su logo, colores corporativos, antes de hacer un pedido de miles de unidades. Tradicionalmente se hacían prototipos físicos, con el coste y tiempo que eso implica.</p>



<p class="wp-block-paragraph">Con modelos 3D interactivos en web desarrollados con <strong>Verge3D</strong>, los clientes pueden rotar la caja, ver cómo queda su diseño en diferentes ángulos, incluso simular cómo se vería con el producto dentro. No es AR ni nada complejo, pero reduce el ciclo de aprobación de semanas a días.</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="532" src="https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d-1024x532.webp" alt="" class="wp-image-25889" srcset="https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d-1024x532.webp 1024w, https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d-300x156.webp 300w, https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d-768x399.webp 768w, https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d-100x52.webp 100w, https://gpcstudio.es/wp-content/uploads/2025/12/cartrix-verge3d.webp 1200w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p class="wp-block-paragraph">Es un ejemplo pequeño pero que ilustra el mismo principio: eliminar fricción en el proceso de compra mostrando el producto de forma más realista que fotos estáticas.</p>



<h2 class="wp-block-heading">Por qué funciona el 3D en ecommerce</h2>



<p class="wp-block-paragraph">Después de analizar estos casos y trabajar en proyectos propios, he llegado a conclusiones claras sobre por qué el 3D web funciona.</p>



<p class="wp-block-paragraph">Primero, reduce la incertidumbre. La gente no compra cuando no está segura. Si puedes ver un producto desde todos los ángulos, probarlo virtualmente en tu espacio, esa incertidumbre baja drásticamente.</p>



<p class="wp-block-paragraph">Segundo, genera confianza. Una empresa que invierte en mostrar sus productos en 3D transmite profesionalidad y transparencia. No estás escondiendo nada, al contrario, permites que el cliente explore todo.</p>



<p class="wp-block-paragraph">Tercero, diferenciación. En un mercado donde todos tienen las mismas fotos de stock, ofrecer visualización 3D te hace destacar. No es solo mejor, es diferente.</p>



<p class="wp-block-paragraph">Y finalmente, datos. Las empresas que implementan 3D pueden medir cómo los usuarios interactúan con los modelos. Qué ángulos miran más, cuánto tiempo pasan explorando, qué configuraciones prueban. Esa información es oro para optimizar tanto el producto como la presentación.</p>



<p class="wp-block-paragraph">El 3D web ya no es experimental ni exclusivo de grandes corporaciones. La tecnología ha madurado, los navegadores lo soportan nativamente con WebGL, y librerías como <strong>Three.js</strong> han democratizado el desarrollo de experiencias 3D interactivas. Cada vez más empresas medianas están viendo que la inversión se recupera rápido en forma de mayores conversiones y menores devoluciones.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2026/01/08/tres-ecommerce-que-mejoraron-ventas-con-3d-web/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>De Figma a Penpot: ¿Por qué considerar esta herramienta de diseño?</title>
		<link>https://gpcstudio.es/2024/11/08/de-figma-a-penpot-por-que-considerar-esta-herramienta-de-diseno/</link>
					<comments>https://gpcstudio.es/2024/11/08/de-figma-a-penpot-por-que-considerar-esta-herramienta-de-diseno/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Fri, 08 Nov 2024 20:30:10 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=24968</guid>

					<description><![CDATA[El panorama del diseño digital ha estado dominado por herramientas como Figma y Adobe XD, reconocidas por su capacidad para facilitar la creación y colaboración]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">El panorama del diseño digital ha estado dominado por herramientas como Figma y Adobe XD, reconocidas por su capacidad para facilitar la creación y colaboración en proyectos de interfaz y experiencia de usuario. Sin embargo, Penpot, una herramienta <em>open source</em>, se está posicionando como una alternativa sólida que vale la pena explorar. A lo largo de mis pruebas, he experimentado la instalación de Penpot de forma local en mi equipo, usando Docker, y he descubierto que la libertad y flexibilidad que ofrece pueden ser un cambio de juego para muchos diseñadores.</p>





<h2 class="wp-block-heading">La propuesta de valor de Penpot</h2>



<p class="wp-block-paragraph">Penpot es la primera plataforma de diseño <em>open source</em> que compite directamente con herramientas como Figma. Al ser <em>open source</em>, Penpot permite que cualquier usuario acceda al código, lo modifique y lo adapte a sus necesidades específicas. Esto no solo brinda transparencia y personalización, sino que también permite que los usuarios instalen la herramienta en sus propios servidores. En mi caso, he instalado Penpot en mi equipo local utilizando Docker, un proceso que resultó sencillo y me permitió mantener un control total sobre mis proyectos y datos.</p>



<p class="wp-block-paragraph">Este enfoque es ideal para empresas y profesionales que buscan independencia tecnológica y una mayor seguridad. Poder alojar Penpot en servidores internos significa que puedes trabajar sin depender de servidores externos, lo que se traduce en mayor privacidad y control de la información.</p>



<p class="wp-block-paragraph">Durante algunos años estuve usando Adobe XD en sus primeras versiones. Aprecié su enfoque innovador y su simplicidad para el diseño de interfaces, pero con el tiempo, el modelo de suscripción me echó un poco para atrás. Esta fue una de las razones por las que Penpot me pareció tan interesante: una herramienta potente sin los costos recurrentes de una licencia.</p>



<h2 class="wp-block-heading">Experiencia de usuario y curva de aprendizaje</h2>



<p class="wp-block-paragraph">Cuando se evalúa una nueva herramienta, la experiencia de usuario es fundamental. Penpot ofrece una interfaz moderna e intuitiva, que, si bien puede parecer algo diferente al principio, es fácil de dominar. Aquellos que vienen de Figma o Adobe XD encontrarán similitudes que facilitan la transición, pero también notarán características únicas que Penpot ha integrado para mejorar la experiencia de diseño.</p>



<p class="wp-block-paragraph">Un aspecto que aprecié es cómo Penpot permite la colaboración en tiempo real, similar a Figma. Esta capacidad es crucial para equipos distribuidos, y durante mis pruebas pude trabajar simultáneamente con otros colegas en proyectos, intercambiar ideas y ver actualizaciones al instante. Además, Penpot soporta la creación de prototipos interactivos, lo cual es un plus al poder visualizar de manera integral el flujo de trabajo de un proyecto desde la ideación hasta la presentación.</p>



<h2 class="wp-block-heading">Beneficios de la filosofía <em>open source</em> en diseño</h2>



<p class="wp-block-paragraph">El carácter <em>open source</em> de Penpot trae consigo múltiples beneficios que van más allá de la gratuidad. En primer lugar, ofrece la posibilidad de personalizar la herramienta para adaptarla a flujos de trabajo específicos. Esto es especialmente útil en entornos donde las necesidades pueden ser distintas a las que cubren las herramientas comerciales tradicionales. Además, la comunidad de desarrolladores que respalda a Penpot está activa y comprometida, lo que significa que la herramienta está en constante mejora y actualización.</p>



<p class="wp-block-paragraph">Otro beneficio importante es la transparencia en el manejo de datos. Al poder instalar Penpot localmente, como lo hice en mis pruebas con Docker, se garantiza un entorno controlado y seguro para el almacenamiento de información, ideal para aquellos que manejan proyectos con un alto nivel de confidencialidad. Esta es una característica que aprecié especialmente, ya que el modelo de suscripción de Adobe XD y la necesidad de confiar en servicios externos no siempre alineaban con mis preferencias de control de datos.</p>



<h2 class="wp-block-heading">Comparación con herramientas tradicionales</h2>



<p class="wp-block-paragraph">En comparación con Figma o Adobe XD, Penpot ofrece una propuesta sólida en cuanto a funcionalidades básicas como la edición vectorial, la creación de prototipos interactivos y la colaboración en tiempo real. Si bien las herramientas tradicionales tienen un ecosistema más establecido y pueden contar con características avanzadas y un soporte más amplio, Penpot se destaca por su independencia y su potencial de crecimiento continuo sin los costos asociados a las licencias comerciales.</p>



<p class="wp-block-paragraph">A pesar de sus ventajas, Penpot todavía está desarrollándose y puede que algunas funcionalidades no estén tan refinadas como en otras plataformas comerciales. Sin embargo, la rapidez con la que la comunidad y el equipo de desarrollo implementan mejoras es un punto a favor que no se debe pasar por alto.</p>



<h2 class="wp-block-heading">Consejos prácticos para la transición a Penpot</h2>



<p class="wp-block-paragraph">Si estás considerando migrar de Figma o Adobe XD a Penpot, es importante abordar el proceso con un plan que minimice las interrupciones en tu flujo de trabajo. Un primer paso es auditar tus proyectos actuales y evaluar cuáles pueden ser transferidos fácilmente a Penpot. Durante mi experiencia, descubrí que es útil familiarizarse con los atajos y comandos de Penpot antes de iniciar la migración completa de proyectos. Esto ayuda a que el equipo se adapte rápidamente y sin fricciones.</p>



<p class="wp-block-paragraph">La capacitación y la práctica en proyectos personales pueden ser clave para que tú y tu equipo se sientan cómodos con la nueva herramienta. Adicionalmente, explorar recursos en línea, tutoriales y participar en la comunidad de usuarios de Penpot puede acelerar el proceso de adaptación.</p>



<h2 class="wp-block-heading">Por qué deberías considerar Penpot para tu próximo proyecto</h2>



<p class="wp-block-paragraph">Adoptar Penpot no solo es una decisión técnica, sino también un cambio de mentalidad. Al elegir una herramienta <em>open source</em> como esta, estás apoyando un enfoque colaborativo y abierto en la tecnología, lo que fomenta la independencia y la innovación. En un mundo cada vez más enfocado en el control de datos y la flexibilidad de herramientas, Penpot se presenta como una alternativa viable y prometedora para diseñadores y equipos de cualquier tamaño.</p>



<p class="wp-block-paragraph">Si bien el cambio de una herramienta establecida a una nueva siempre puede generar inquietudes, la experiencia de tener un control total sobre el software y la posibilidad de contribuir a su mejora hacen que valga la pena considerarlo.</p>



<p class="wp-block-paragraph">Puedes visitar desde aquí la <strong><a href="https://penpot.app/" target="_blank" data-type="link" data-id="https://penpot.app/" rel="noreferrer noopener">página web de Penpot</a></strong>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2024/11/08/de-figma-a-penpot-por-que-considerar-esta-herramienta-de-diseno/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Añade funcionalidad para HTML5</title>
		<link>https://gpcstudio.es/2018/01/18/anade-funcionalidad-html5/</link>
					<comments>https://gpcstudio.es/2018/01/18/anade-funcionalidad-html5/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Thu, 18 Jan 2018 11:18:06 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=4375</guid>

					<description><![CDATA[Añade este snippet a tu archivo functions.php para incluir la funcionalidad HTML5 en la estructura de tu HTML.]]></description>
										<content:encoded><![CDATA[<p>Añade este snippet a tu archivo functions.php para incluir la funcionalidad HTML5 en la estructura de tu HTML.</p>
<pre class="brush: php; title: ; notranslate">//* Añade funcionalidad para HTML5
add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list' ) );</pre>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2018/01/18/anade-funcionalidad-html5/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Modificar los créditos del pie de página en Genesis Framework</title>
		<link>https://gpcstudio.es/2018/01/11/modificar-los-creditos-del-pie-pagina-genesis-framework/</link>
					<comments>https://gpcstudio.es/2018/01/11/modificar-los-creditos-del-pie-pagina-genesis-framework/#comments</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Thu, 11 Jan 2018 10:41:52 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=4368</guid>

					<description><![CDATA[Si quieres personalizar tu tema hijo y que incluya en el pie de página tus propios créditos en lugar de los que vienen por defecto]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Si quieres personalizar tu tema hijo y que incluya en el pie de página tus propios créditos en lugar de los que vienen por defecto debes incluir este <em>snippet</em> en tu archivo <em>functions.php</em>.</p>



<div class="wp-block-image"><figure class="aligncenter"><a href="https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis.jpg"><img loading="lazy" decoding="async" width="887" height="113" src="https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis.jpg" alt="Créditos en el pie de página de Genesis Framework" class="wp-image-4816" srcset="https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis.jpg 887w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis-600x76.jpg 600w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis-300x38.jpg 300w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-genesis-768x98.jpg 768w" sizes="auto, (max-width: 887px) 100vw, 887px" /></a><figcaption>Créditos por defecto en Genesis Framework</figcaption></figure></div>



<p class="wp-block-paragraph">Una vez añadido el <em>snippet</em> tendrás tus propios créditos. El código es bastante lógico y legible. Cambia el contenido por lo que desees mostrar.</p>



<div class="wp-block-image"><figure class="aligncenter"><a href="https://gpcstudio.es/wp-content/uploads/2017/10/creditos.jpg"><img loading="lazy" decoding="async" width="887" height="113" src="https://gpcstudio.es/wp-content/uploads/2017/10/creditos.jpg" alt="Créditos en el pie de página de Genesis Framework" class="wp-image-4817" srcset="https://gpcstudio.es/wp-content/uploads/2017/10/creditos.jpg 887w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-600x76.jpg 600w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-300x38.jpg 300w, https://gpcstudio.es/wp-content/uploads/2017/10/creditos-768x98.jpg 768w" sizes="auto, (max-width: 887px) 100vw, 887px" /></a><figcaption>Créditos modificados en el pie de página de un tema hijo de Genesis Framework</figcaption></figure></div>



<pre class="wp-block-preformatted"><pre class="brush: php; title: ; notranslate">
//* Change the footer text
add_filter('genesis_footer_creds_text', 'sp_footer_creds_filter');
function sp_footer_creds_filter( $creds ) {
 $url_pagina = get_site_url();
 $creds = '

&amp;amp;amp;lt;a href=&amp;quot;' . $url_pagina . '&amp;quot;&amp;amp;amp;gt; &amp;amp;amp;lt;a href=&amp;quot;' . $url_pagina . '/politica-de-cookies/&amp;quot;&amp;amp;amp;gt;Política de cookies&amp;amp;amp;lt;/a&amp;amp;amp;gt; &amp;amp;amp;amp;middot; &amp;amp;amp;lt;a href=&amp;quot;' . $url_pagina . '/mas-informacion-sobre-las-cookies/&amp;quot;&amp;amp;amp;gt;Información sobre las cookies&amp;amp;amp;lt;/a&amp;amp;amp;gt; &amp;amp;amp;amp;middot; &amp;amp;amp;lt;a href=&amp;quot;' . $url_pagina . '/politica-de-privacidad/&amp;quot;&amp;amp;amp;gt;Política de Privacidad&amp;amp;amp;lt;/a&amp;amp;amp;gt;

 &amp;amp;amp;amp;middot; Desarrollado por &amp;amp;amp;lt;a href=&amp;quot;https://web.zao3d.com&amp;quot; title=&amp;quot;Desarrollo web por Zao3D&amp;quot;&amp;amp;amp;gt;Zao3D&amp;amp;amp;lt;/a&amp;amp;amp;gt;

';
 return $creds;
}
}</pre></pre>



<pre class="wp-block-preformatted wrap:true lang:css decode:true">&nbsp;</pre>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2018/01/11/modificar-los-creditos-del-pie-pagina-genesis-framework/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Añade la etiqueta para móviles</title>
		<link>https://gpcstudio.es/2018/01/04/anade-la-etiqueta-moviles/</link>
					<comments>https://gpcstudio.es/2018/01/04/anade-la-etiqueta-moviles/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Thu, 04 Jan 2018 11:20:12 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=4377</guid>

					<description><![CDATA[Con este pequeño snippet le indicamos a los navegadores que es una web preparada para móviles. Inserta este snippet en el archivo functions.php //* Añade]]></description>
										<content:encoded><![CDATA[<p>Con este pequeño snippet le indicamos a los navegadores que es una web preparada para móviles.</p>
<p>Inserta este snippet en el archivo functions.php</p>
<pre class="brush: php; title: ; notranslate">//* Añade la etiqueta para móviles
add_theme_support( 'genesis-responsive-viewport' );</pre>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2018/01/04/anade-la-etiqueta-moviles/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Añadir las hojas de estilo</title>
		<link>https://gpcstudio.es/2017/12/28/anadir-las-hojas-estilo/</link>
					<comments>https://gpcstudio.es/2017/12/28/anadir-las-hojas-estilo/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Thu, 28 Dec 2017 11:16:55 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=4373</guid>

					<description><![CDATA[Inserta el siguiente código en el archivo functions.php de tu tema hijo para que coja la página de estilos que tu decidas. // Añade las]]></description>
										<content:encoded><![CDATA[<p>Inserta el siguiente código en el archivo <em>functions.php</em> de tu tema hijo para que coja la página de estilos que tu decidas.</p>
<pre class="brush: php; title: ; notranslate">// Añade las hojas de estilos desde functions en lugar de desde la pagina de estilos. Da prioridad al Child Theme
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', PHP_INT_MAX);

function theme_enqueue_styles() {
wp_enqueue_style( 'genesis', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'javiervega', get_stylesheet_directory_uri() . '/style.css', array( 'genesis' ) );
}</pre>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2017/12/28/anadir-las-hojas-estilo/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Mi experiencia trabajando con DesktopServer</title>
		<link>https://gpcstudio.es/2017/06/27/experiencia-trabajando-desktopserver/</link>
					<comments>https://gpcstudio.es/2017/06/27/experiencia-trabajando-desktopserver/#comments</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Tue, 27 Jun 2017 09:41:40 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=4007</guid>

					<description><![CDATA[Llevo ahora justo 2 meses usando&#160;Desktop Server. Hasta ahora he probado en mi entorno de desarrollo varias combinaciones de aplicaciones como MAMP, XAMP, WAMP, etc.]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Llevo ahora justo 2 meses usando&nbsp;<strong>Desktop Server</strong>. Hasta ahora he probado en mi entorno de desarrollo varias combinaciones de aplicaciones como MAMP, XAMP, WAMP, etc. Incluso me animé a probar por primera vez el MAMP Pro. Fue gracias a MAMP Pro que me decidí a usar uno de estos programas profesionales para el desarrollo. Me encontré con algo que encajaba realmente con el tipo de trabajo que realizo. Al principio, cuando llevas 4 o 5 páginas web, puedes usar uno de estos sistemas gratuitos que he comentado. Pero llega un día en que manejas más de 30 websites, entre las que mantienes y las que estás desarrollando, y es cuando empiezas a ver que necesitas algo que te haga ser más productivo. Este software dispone de dos versiones: gratis y premium. En esta ocasión me decidí por la versión de pago por las razones que os explico a continuación.</p>




<div class="wp-block-image">
<figure data-wp-context="{&quot;imageId&quot;:&quot;6aaef933125b9&quot;}" data-wp-interactive="core/image" data-wp-key="6aaef933125b9" class="aligncenter wp-lightbox-container"><img loading="lazy" decoding="async" width="756" height="579" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://gpcstudio.es/wp-content/uploads/2017/06/desktop-server.png" alt="Desktop Server" class="wp-image-4011" srcset="https://gpcstudio.es/wp-content/uploads/2017/06/desktop-server.png 756w, https://gpcstudio.es/wp-content/uploads/2017/06/desktop-server-600x460.png 600w, https://gpcstudio.es/wp-content/uploads/2017/06/desktop-server-300x230.png 300w" sizes="auto, (max-width: 756px) 100vw, 756px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<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" />
			</svg>
		</button></figure>
</div>


<p class="wp-block-paragraph"></p>



<h2 class="wp-block-heading">Primer motivo para quedarme con DesktopServer</h2>



<p class="wp-block-paragraph">El primer motivo y por el que me hizo decidir que pagar por esta herramienta estaba bien es la facilidad que te da a la hora de crear&nbsp;<strong>Blueprints</strong>. Los&nbsp;<em>blueprints</em> son plantillas que te creas con la instalación de WordPress y el conjunto de plugins y themes que uses a menudo. Esto me vino genial pues tengo un&nbsp;<em>blueprint</em> preparado para WooCommerce cuando un cliente me pide una tienda online. De esta forma no solo me hace una instalación de todo el WordPress con WooCommerce si no que además con todos los plugins que suelo usar para una tienda estándard. Esto es ganar mucho tiempo ya que solo tienes que seleccionar desde el desplegable que tipo de instalación de WordPress necesitas y a darle al siguiente y ya la tienes. Te crea automáticamente la base de datos, tu archivo wp-config.php y listo para trabajar.</p>


<div class="wp-block-image size-full wp-image-4014">
<figure data-wp-context="{&quot;imageId&quot;:&quot;6aaef93312c18&quot;}" data-wp-interactive="core/image" data-wp-key="6aaef93312c18" class="aligncenter wp-lightbox-container"><img loading="lazy" decoding="async" width="756" height="579" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://gpcstudio.es/wp-content/uploads/2017/06/blueprints-desktopserver.png" alt="Blueprints de DesktopServer" class="wp-image-4014" srcset="https://gpcstudio.es/wp-content/uploads/2017/06/blueprints-desktopserver.png 756w, https://gpcstudio.es/wp-content/uploads/2017/06/blueprints-desktopserver-600x460.png 600w, https://gpcstudio.es/wp-content/uploads/2017/06/blueprints-desktopserver-300x230.png 300w" sizes="auto, (max-width: 756px) 100vw, 756px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<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" />
			</svg>
		</button><figcaption class="wp-element-caption">Blueprints de DesktopServer</figcaption></figure>
</div>


<h2 class="wp-block-heading">Segundo motivo para elegir DesktopServer</h2>



<p class="wp-block-paragraph">El segundo motivo para decantarme por DesktopServer es el mapeado de URL que te hace a nivel de localhost. De esta forma ya no hace falta que use la engorrosa URL https://localhost/pagina-web-ejemplo, que normalmente se usa en un servidor local. Este mapeado me permite usar URL más amigables y con más sentido como https://www.zao3d.dev. Es mucho más interesante y con más sentido tener este tipo de configuración.</p>



<p class="wp-block-paragraph">He de decir que todo esto lo puedes hacer igualmente sin DesktopServer pero tienes que configurar un montón de cosas en el servidor y varios archivos en Windows, MacOS o Linux para tener una funcionalidad parecida. Y como he dicho, lo que quiero y necesito ahora, es ahorrar tiempo. Así que este ahorro de tiempo justifica el precio.</p>



<h2 class="wp-block-heading">Otras razones para hacerlo merecedor de mi entorno de desarrollo</h2>



<p class="wp-block-paragraph">Hay muchas más razones. Conforme vas usándolo vas descubriendo otras utilidades que no contabas con ellas o no se te habían ocurrido y ahí están para hacerte la vida más fácil. Algunas pueden parecerte una tontería o que no es para tanto, pero el hecho de que te instale un plugin que modifica la barra de WordPress de color negro a otro color y que le añada la frase «LOCAL DEVELOPMENT» me parece más útil de lo que parece. Más de una vez he hecho un cambio en una web que está online en lugar de en la de desarrollo. Muchas veces tienes las dos pestañas abiertas y prácticamente son la misma web a no ser que te fijes en la URL. De esta forma, con un cambio de color y la frase en mayúsculas ayuda bastante, a golpe de vista, a no equivocarte.</p>


<div class="wp-block-image wp-image-4018 size-large">
<figure data-wp-context="{&quot;imageId&quot;:&quot;6aaef933132b5&quot;}" data-wp-interactive="core/image" data-wp-key="6aaef933132b5" class="aligncenter wp-lightbox-container"><img loading="lazy" decoding="async" width="1024" height="536" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website-1024x536.png" alt="LOCAL DEVELOPMENT WEBSITE en DesktopServer" class="wp-image-4018" srcset="https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website-1024x536.png 1024w, https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website-600x314.png 600w, https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website-300x157.png 300w, https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website-768x402.png 768w, https://gpcstudio.es/wp-content/uploads/2017/06/local-development-website.png 1385w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<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" />
			</svg>
		</button><figcaption class="wp-element-caption">LOCAL DEVELOPMENT WEBSITE en DesktopServer</figcaption></figure>
</div>


<h2 class="wp-block-heading">Plugins para desarrolladores</h2>



<p class="wp-block-paragraph">En cuanto a los plugins que vienen con DesktopServer debo decir que son realmente interesantes. Hay algunos muy curiosos y que ni se me había ocurrido buscar algo parecido. Uno muy curioso es el <strong>Airplane Mode</strong> que lo que hace es capar toda conexión a Internet con lo que ganamos en velocidad si no necesitamos estar todo el tiempo comprobando si hay actualizaciones, etc. Este modo nos irá muy bien si estamos en un lugar sin conexión. Que no haya conexión puede hacer que la web en el servidor local también vaya lenta porque está haciendo llamadas a los servidores y esperando respuesta para nuevas actualizaciones, etc. Otro que también me ha parecido interesante, sobre todo porque tengo bastantes usuarios de las páginas web, es el de ByPass Login que te permite acceder al Panel de Administración sin introducir ninguna contraseña. Solo tienes que decidir con qué usuarios quieres entrar y ya estás dentro. Muy útil.</p>



<p class="wp-block-paragraph">Existen plugins de todo tipo, como una integración con Dreamweaver o con Coda (para Mac), un servidor de correo para que puedas ver si las notificaciones de WordPress hacen lo correcto, ya que en un entorno de desarrollo en servidor local normalmente no puedes recibir correos de WordPress. Así que esto sería como una simulación de envio de correos. Tienes un panel para que puedas acceder a una bandeja de correo donde verás los correos que te manda WordPress o algún plugin, como WooCommerce. En el caso de WooCommerce me viene genial para probar los correos que se envían cuando se realiza un pedido. Y bueno, algunos más que todavía no he probado pero tienen pinta de ser muy útiles.</p>


<div class="wp-block-image size-full wp-image-4021">
<figure data-wp-context="{&quot;imageId&quot;:&quot;6aaef9331387e&quot;}" data-wp-interactive="core/image" data-wp-key="6aaef9331387e" class="aligncenter wp-lightbox-container"><img loading="lazy" decoding="async" width="756" height="579" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://gpcstudio.es/wp-content/uploads/2017/06/plugins-desarrollo.png" alt="Plugins para desarrolladores" class="wp-image-4021" srcset="https://gpcstudio.es/wp-content/uploads/2017/06/plugins-desarrollo.png 756w, https://gpcstudio.es/wp-content/uploads/2017/06/plugins-desarrollo-600x460.png 600w, https://gpcstudio.es/wp-content/uploads/2017/06/plugins-desarrollo-300x230.png 300w" sizes="auto, (max-width: 756px) 100vw, 756px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<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" />
			</svg>
		</button><figcaption class="wp-element-caption">Plugins para desarrolladores</figcaption></figure>
</div>


<h2 class="wp-block-heading">Conclusión</h2>



<p class="wp-block-paragraph">Puedo decir que estoy realmente contento con este software ya que me ha hecho la vida más fácil a la hora de organizar mis proyectos web. Se trata de ganar tiempo y ser más productivo, ya que ser productivo se traduce en ganar más dinero y hacer más. Solo he encontrado un punto negativo y es que a la hora de arrancar el servidor por primera vez lo he encontrado algo lento, pero una vez abierto ya funciona correctamente.</p>



<p class="wp-block-paragraph">Si estáis interesados en probarlo tenéis una versión gratuita que está limitada a solo un sitio web.</p>



<p class="wp-block-paragraph">Lo puedes descargar aquí:&nbsp;<a href="https://serverpress.com/get-desktopserver/" target="_blank" rel="noopener"><strong>DesktopServer.</strong></a></p>



<p class="wp-block-paragraph">Así que es ideal si tenéis proyectos personales. También os puedo hacer un vídeo explicando cómo funciona con un poco más de detalle.</p>



<p class="wp-block-paragraph">¡Nos vemos en la siguiente entrada!</p>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2017/06/27/experiencia-trabajando-desktopserver/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Velocity, Dash y Zeal, documentación offline</title>
		<link>https://gpcstudio.es/2016/10/15/velocity-dash-zeal-documentacion-offline/</link>
					<comments>https://gpcstudio.es/2016/10/15/velocity-dash-zeal-documentacion-offline/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Sat, 15 Oct 2016 09:43:02 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=3792</guid>

					<description><![CDATA[Explorando Herramientas para Desarrolladores: Velocity, Dash y Zeal En el mundo del desarrollo web, es común enfrentarse a preguntas sobre etiquetas, atributos o funciones específicas]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">Explorando Herramientas para Desarrolladores: Velocity, Dash y Zeal</h2>



<p class="wp-block-paragraph">En el mundo del desarrollo web, es común enfrentarse a preguntas sobre etiquetas, atributos o funciones específicas de WordPress. En estos momentos, contar con herramientas eficientes puede marcar la diferencia. Presentamos tres aplicaciones esenciales: Velocity, Dash y Zeal.</p>





<h3 class="wp-block-heading">Acceso Integral a Documentación de Desarrollo</h3>



<p class="wp-block-paragraph">Estas aplicaciones ofrecen acceso a manuales de diversas tecnologías, desde PHP y Python hasta CSS, HTML y, por supuesto, WordPress. Su objetivo principal es centralizar toda la documentación en un solo lugar para facilitar el proceso de desarrollo. Lo más destacado es que esta información puede consultarse incluso sin conexión a Internet, lo cual resulta invaluable para entornos no siempre conectados.</p>



<h3 class="wp-block-heading">Dash para macOS y Velocity y Zeal para Windows</h3>



<ul class="wp-block-list">
<li><strong>Dash en macOS y su Alternativa para Windows, Velocity</strong>
<ul class="wp-block-list">
<li>Dash, inicialmente exclusiva para macOS, ahora cuenta con una opción para usuarios de Windows llamada Velocity. Otra alternativa para Windows es Zeal. Ambas utilizan los mismos repositorios de documentación offline, diferenciándose principalmente en la interfaz, siendo Dash la más estéticamente atractiva. Aunque Velocity presenta un diseño atractivo, he observado cierta inestabilidad durante su uso.</li>
</ul>
</li>
</ul>


<div class="kb-gallery-wrap-id-3792_1d83be-28 alignnone wp-block-kadence-advancedgallery"><ul class="kb-gallery-ul kb-gallery-non-static kb-gallery-type-masonry kb-masonry-init kb-gallery-id-3792_1d83be-28 kb-gallery-caption-style-bottom-hover kb-gallery-filter-none" data-image-filter="none" data-item-selector=".kadence-blocks-gallery-item" data-lightbox-caption="true" data-columns-xxl="3" data-columns-xl="3" data-columns-md="3" data-columns-sm="2" data-columns-xs="1" data-columns-ss="1"><li class="kadence-blocks-gallery-item" tabindex="0"><div class="kadence-blocks-gallery-item-inner"><figure class="kb-gallery-figure kadence-blocks-gallery-item-hide-caption"><div class="kb-gal-image-radius" style="max-width:1297px;"><div class="kb-gallery-image-contain kadence-blocks-gallery-intrinsic" style="padding-bottom:62%;"><img loading="lazy" decoding="async" src="https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal.png" width="1297" height="809" alt="Velocity, mostrando información de Codex WordPress" data-full-image="https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal.png" data-light-image="https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal.png" data-id="3796" class="wp-image-3796" srcset="https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal.png 1297w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal-600x374.png 600w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal-300x187.png 300w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal-1024x639.png 1024w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-velocity-zeal-768x479.png 768w" sizes="auto, (max-width: 1297px) 100vw, 1297px" /></div></div></figure></div></li><li class="kadence-blocks-gallery-item" tabindex="0"><div class="kadence-blocks-gallery-item-inner"><figure class="kb-gallery-figure kadence-blocks-gallery-item-hide-caption"><div class="kb-gal-image-radius" style="max-width:1297px;"><div class="kb-gallery-image-contain kadence-blocks-gallery-intrinsic" style="padding-bottom:62%;"><img loading="lazy" decoding="async" src="https://gpcstudio.es/wp-content/uploads/2016/10/zeal.png" width="1297" height="809" alt="Zeal" data-full-image="https://gpcstudio.es/wp-content/uploads/2016/10/zeal.png" data-light-image="https://gpcstudio.es/wp-content/uploads/2016/10/zeal.png" data-id="3799" class="wp-image-3799" srcset="https://gpcstudio.es/wp-content/uploads/2016/10/zeal.png 1297w, https://gpcstudio.es/wp-content/uploads/2016/10/zeal-600x374.png 600w, https://gpcstudio.es/wp-content/uploads/2016/10/zeal-300x187.png 300w, https://gpcstudio.es/wp-content/uploads/2016/10/zeal-1024x639.png 1024w, https://gpcstudio.es/wp-content/uploads/2016/10/zeal-768x479.png 768w" sizes="auto, (max-width: 1297px) 100vw, 1297px" /></div></div></figure></div></li><li class="kadence-blocks-gallery-item" tabindex="0"><div class="kadence-blocks-gallery-item-inner"><figure class="kb-gallery-figure kadence-blocks-gallery-item-hide-caption"><div class="kb-gal-image-radius" style="max-width:1440px;"><div class="kb-gallery-image-contain kadence-blocks-gallery-intrinsic" style="padding-bottom:62%;"><img loading="lazy" decoding="async" src="https://gpcstudio.es/wp-content/uploads/2016/10/dash.png" width="1440" height="900" alt="Dash, documentación offline para Mac" data-full-image="https://gpcstudio.es/wp-content/uploads/2016/10/dash.png" data-light-image="https://gpcstudio.es/wp-content/uploads/2016/10/dash.png" data-id="3801" class="wp-image-3801" srcset="https://gpcstudio.es/wp-content/uploads/2016/10/dash.png 1440w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-600x375.png 600w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-300x188.png 300w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-1024x640.png 1024w, https://gpcstudio.es/wp-content/uploads/2016/10/dash-768x480.png 768w" sizes="auto, (max-width: 1440px) 100vw, 1440px" /></div></div></figure></div></li></ul></div>


<h3 class="wp-block-heading">Uso Gratuito y Opciones Premium</h3>



<p class="wp-block-paragraph">Estas tres aplicaciones son gratuitas y plenamente funcionales, con la excepción de Dash, que muestra un contador al abrir algunos documentos, indicando que este se elimina al optar por la versión de pago. La versión premium de Dash ofrece beneficios adicionales, como personalización de documentos y creación de snippets. La elección de utilizar la versión de pago dependerá de las necesidades individuales.</p>



<p class="wp-block-paragraph"><strong>Enlaces para descargar las aplicaciones:</strong></p>



<ul class="wp-block-list">
<li><a href="https://kapeli.com/dash" target="_blank" rel="noopener">Dash</a>&nbsp;(macOS)</li>



<li><a href="https://velocity.silverlakesoftware.com/" target="_blank" rel="noopener">Velocity</a>&nbsp;(Windows)</li>



<li><a href="https://zealdocs.org/" target="_blank" rel="noopener">Zeal</a> (Windows)</li>
</ul>



<h3 class="wp-block-heading">Preguntas Frecuentes</h3>



<div class="wp-block-kadence-accordion alignnone"><div class="kt-accordion-wrap kt-accordion-id3792_2f6d57-b8 kt-accordion-has-3-panes kt-active-pane-0 kt-accordion-block kt-pane-header-alignment-left kt-accodion-icon-style-arrow kt-accodion-icon-side-right" style="max-width:none"><div class="kt-accordion-inner-wrap" data-allow-multiple-open="false" data-start-open="0">
<div class="wp-block-kadence-pane kt-accordion-pane kt-accordion-pane-1 kt-pane3792_e5d8fd-fb"><div class="kt-accordion-header-wrap"><button class="kt-blocks-accordion-header kt-acccordion-button-label-show"><span class="kt-blocks-accordion-title-wrap"><span class="kt-blocks-accordion-title"><strong>¿Son estas aplicaciones gratuitas para siempre?</strong></span></span><span class="kt-blocks-accordion-icon-trigger"></span></button></div><div class="kt-accordion-panel kt-accordion-panel-hidden"><div class="kt-accordion-panel-inner">
<p class="wp-block-paragraph">Sí, las tres aplicaciones son de uso gratuito, con la opción de una versión premium para Dash con funcionalidades adicionales.</p>
</div></div></div>



<div class="wp-block-kadence-pane kt-accordion-pane kt-accordion-pane-2 kt-pane3792_676714-74"><div class="kt-accordion-header-wrap"><button class="kt-blocks-accordion-header kt-acccordion-button-label-show"><span class="kt-blocks-accordion-title-wrap"><span class="kt-blocks-accordion-title"><strong>¿Qué ventajas ofrece la versión de pago de Dash?</strong></span></span><span class="kt-blocks-accordion-icon-trigger"></span></button></div><div class="kt-accordion-panel kt-accordion-panel-hidden"><div class="kt-accordion-panel-inner">
<p class="wp-block-paragraph">La versión de pago de Dash ofrece ventajas como la personalización de documentos y la creación de snippets.</p>
</div></div></div>



<div class="wp-block-kadence-pane kt-accordion-pane kt-accordion-pane-3 kt-pane3792_298936-15"><div class="kt-accordion-header-wrap"><button class="kt-blocks-accordion-header kt-acccordion-button-label-show"><span class="kt-blocks-accordion-title-wrap"><span class="kt-blocks-accordion-title"><strong>¿Puedo utilizar estas aplicaciones sin conexión a Internet?</strong></span></span><span class="kt-blocks-accordion-icon-trigger"></span></button></div><div class="kt-accordion-panel kt-accordion-panel-hidden"><div class="kt-accordion-panel-inner">
<p class="wp-block-paragraph">Sí, todas las aplicaciones permiten el acceso a la documentación incluso sin conexión a Internet.</p>
</div></div></div>
</div></div></div>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2016/10/15/velocity-dash-zeal-documentacion-offline/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>Novedades y Mejoras en Genesis Framework 2.1.3</title>
		<link>https://gpcstudio.es/2015/08/19/genesis-2-1-3/</link>
					<comments>https://gpcstudio.es/2015/08/19/genesis-2-1-3/#comments</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Wed, 19 Aug 2015 11:25:40 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=3089</guid>

					<description><![CDATA[Desde hace ya un tiempo decidí que el framework a usar en mis sitios web iba a ser Genesis, de StudioPress y no pude hacer]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Desde hace ya un tiempo decidí que el framework a usar en mis sitios web iba a ser <strong>Genesis,</strong> de <strong><a href="https://www.studiopress.com/" target="_blank" rel="noopener">StudioPress</a></strong> y no pude hacer mejor elección. Es uno de los mejores framework para WordPress que he probado. Aunque para ajustarlo es necesario tocar un poco de código, éste es tan ordenado y bien organizado que es un gustazo. De todas formas siempre me ha gustado la programación y eso más que un problema ha sido un gustito para mi. Y ahora, en este mes de agosto, se acaba de lanzar <strong>Genesis 2.1.3</strong>.</p>



<p class="wp-block-paragraph">No es una actualización mayor, así que de primeras no vas a ver grandes cambios. Los cambios principales se han hecho esperando a WordPress 4.3. Y si vemos el archivo changelog del proyecto vemos que dice esto:&nbsp;<em>Prepare taxonomy term meta for mandatory split in WordPress 4.3.</em></p>



<h3 class="wp-block-heading">¿Por qué uso Genesis Framework?</h3>



<p class="wp-block-paragraph">Me llevó mucho tiempo decidirme a usar Genesis Framework en mis sitios pues tenía que adaptar todos los temas al nuevo framework y eso, si son muchos, pues puede dar algo de pereza. Así que empecé a probar en uno de ellos como&nbsp;<em>conejillo de Indias</em>. Lo instalé en este blog y empecé a hacer un tema hijo basado en Genesis. Siempre es lo recomendable cuando usamos cualquier tema, hacer un tema hijo. De esta forma podremos personalizarlo tanto como queramos y no perder nuestros cambios con una nueva actualización.</p>


<div class="wp-block-image">
<figure class="aligncenter"><a href="https://my.studiopress.com/themes/genesis/" target="_blank" rel="noopener"><img loading="lazy" decoding="async" width="528" height="582" src="https://gpcstudio.es/wp-content/uploads/2015/08/genesis-framework.png" alt="Genesis Framework, de StudioPress" class="wp-image-3103" srcset="https://gpcstudio.es/wp-content/uploads/2015/08/genesis-framework.png 528w, https://gpcstudio.es/wp-content/uploads/2015/08/genesis-framework-272x300.png 272w" sizes="auto, (max-width: 528px) 100vw, 528px" /></a><figcaption class="wp-element-caption">Genesis Framework, de StudioPress</figcaption></figure>
</div>


<h3 class="wp-block-heading">Código muy limpio y optimizado</h3>



<p class="wp-block-paragraph">Lo primero que noté fue que el tema cargaba el sitio con una mayor velocidad que antes, puesto que el código está muy bien optimizado. Ya sabemos que muchos temas te vienen con muchísimas opciones de configuración que te permiten personalizarlo al máximo. Eso está muy bien, pero esto también hace que el tema sea más grande y pesado con opciones que puede que usemos pero con muchas otras que no vamos a usar y están ahí. Todo eso hace mella en la carga de la página. Con genesis me permite, mediante su archivo&nbsp;<strong>functions.php</strong> poder activar o desactivar partes del tema de una forma muy clara.</p>



<h3 class="wp-block-heading">HTML5</h3>


<div class="wp-block-image size-full wp-image-3099">
<figure class="alignleft"><img loading="lazy" decoding="async" width="62" height="62" src="https://gpcstudio.es/wp-content/uploads/2015/08/html5-circle.png" alt="Logo de HTML5" class="wp-image-3099"/><figcaption class="wp-element-caption">Logo de HTML5</figcaption></figure>
</div>


<p class="wp-block-paragraph">El código generado por Genesis Framework es HTML5 por lo que hace que tu sitio sea un sitio moderno y esté a la última en tecnología. Tus páginas web se adaptarán a la perfección a la resolución de cualquier dispositivo de una forma suave. Que un sitio esté optimizado para HTML5 es sinónimo de calidad a la hora de mostrarse&nbsp;en un navegador moderno. Porque HTML5 es el nuevo estándar y debemos estar al día. En ese aspecto soy muy&nbsp;<em>puñetitas</em> y me encanta estar a la última.</p>



<h3 class="wp-block-heading">Optimizado para los buscadores o SEO</h3>



<p class="wp-block-paragraph">Una web que tiene en cuenta los aspectos del SEO es un gran paso para que tu contenido esté más visible en los resultados de búsqueda. Claro está, que no por instalar este tema tus contenidos ya estén optimizados para SEO. El contenido de calidad siempre seguirá siendo el que mande. Pero un tema que permite que los motores de búsqueda encuentren bien tu contenido y lo pueden indexar con comodidad es una delicia. Aunque el tema ya te viene con unas opciones de SEO preinstaladas por defecto, seguiré, por ahora, usando el plugin de YOAST. El tema, es curioso, detecta si lo tienes instalado y se desactivan las opciones SEO de Genesis Framework. Esto me hizo gracia.</p>



<h3 class="wp-block-heading">Seguridad</h3>



<p class="wp-block-paragraph">Otra cosa que hizo decidir es el de la seguridad. Y lo digo porque hasta antes de implementar Genesis Framework en mis sitios estaba hasta las narices de recibir correos de que usuarios se estaban dando de alta en algunos de mis sitios web. Ya sabéis, esos usuarios con nombres sospechosos, de cuentas de Rusia y otros paises bastante conocidos por la industria del&nbsp;<em>spam</em>. Pues fue isntalar Genesis Framework y desaparecieron. Hasta entonces iba apañándome con algún plugin que parara un poco esta lluvia de usuarios falsos, pero siempre acababan colándose. Ahora es una maravilla cómo funciona todo.</p>



<h3 class="wp-block-heading">Y muchas más</h3>



<p class="wp-block-paragraph">Seguramente acabaré encontrando muchas más razones, pero estas son, principalmente, las que me movieron a tomar esta decisión. No quiero que esta entrada vaya a parecer una entrada patrocinada por StudioPress porque no lo es. Es sencillamente la opinión de un desarrollador de sitios web que se siente contento de haber tomado esta decisión.</p>



<p class="wp-block-paragraph">De hecho, estoy preparando un curso en el que os enseñaré a sacar el jugo a este tema. Estoy seguro de que disfrutaréis usándolo tanto como yo.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2015/08/19/genesis-2-1-3/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Sublime Text 3 me tiene enamorado</title>
		<link>https://gpcstudio.es/2015/04/04/sublime-text-3-me-tiene-enamorado/</link>
					<comments>https://gpcstudio.es/2015/04/04/sublime-text-3-me-tiene-enamorado/#respond</comments>
		
		<dc:creator><![CDATA[javier@gpcstudio.es]]></dc:creator>
		<pubDate>Sat, 04 Apr 2015 21:23:47 +0000</pubDate>
				<category><![CDATA[Desarrollo Web: Herramientas, Tutoriales y Snippets Útiles]]></category>
		<guid isPermaLink="false">https://gpcstudio.es/?p=2617</guid>

					<description><![CDATA[Tal y como dice el slogan de Sublime Text, The text editor you&#8217;ll fall in love with. Pues eso mismo me ha pasado, Sublime Text 3 me]]></description>
										<content:encoded><![CDATA[<p><figure id="attachment_2672" aria-describedby="caption-attachment-2672" style="width: 246px" class="wp-caption alignleft"><img loading="lazy" decoding="async" class="size-full wp-image-2672" src="https://gpcstudio.es/wp-content/uploads/2015/04/Sublime_Text_Logo.png" alt="Logo de Sublime Text" width="256" height="256" srcset="https://gpcstudio.es/wp-content/uploads/2015/04/Sublime_Text_Logo.png 256w, https://gpcstudio.es/wp-content/uploads/2015/04/Sublime_Text_Logo-100x100.png 100w, https://gpcstudio.es/wp-content/uploads/2015/04/Sublime_Text_Logo-150x150.png 150w" sizes="auto, (max-width: 256px) 100vw, 256px" /><figcaption id="caption-attachment-2672" class="wp-caption-text">Logo de Sublime Text</figcaption></figure></p>
<p>Tal y como dice el slogan de Sublime Text, <em>The text editor you&#8217;ll fall in love with. </em>Pues eso mismo me ha pasado,<strong> Sublime Text 3 me tiene enamorado</strong>. Ya hacía bastante tiempo que me tenía intrigado. No paraba de leer en muchísimos blogs las maravillas de este editor. Y no ha sido hasta hace poco, un mes como mucho, que me dio por instalarlo. Y ocurrió. Era cierto su slogan. Es una auténtica maravilla. Si eres de los que le das al código, Sublime Text, te va a atrapar.</p>
<p>Hasta ahora he probado muchos editores. Desde Notepad++ para Windows como Coda para OS X. Ambos son fabulosos y ahí los tengo. Pero Sublime Text ha ganado por goleada.</p>
<p>Lo primero que me llamó la atención es lo minimalista y ligero que es el programa. Desde el momento de arrancarlo hasta que se abre es prácticamente instantáneo. Eso la primera vez. Porque una vez que ya lo has ejecutado por primera vez, como cualquier software, cuando lo vuelves a abrir lo hace desde la memoria. En este caso ya es instantánea la ejecución. Pero ser tan ligero y rápido de ejecutar te puede llevar a pensar que es tan solo eso: un editor más. Y aquí es donde engaña porque descubro que es un editor potentísimo. Todo se activa a base de atajos de teclado. Esto es algo que nos gusta a los que tecleamos código. Es una forma rápida de trabajar. Así que Sublime Text está pensado principalmente en productividad. Todo lo tienes a unas pocas combinaciones de tecla.</p>
<p><figure id="attachment_2677" aria-describedby="caption-attachment-2677" style="width: 1014px" class="wp-caption alignleft"><img loading="lazy" decoding="async" class="size-large wp-image-2677" src="https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-1024x578.png" alt="Sublime Text" width="1024" height="578" srcset="https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-1024x578.png 1024w, https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-600x339.png 600w, https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-300x169.png 300w, https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-768x433.png 768w, https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen-1536x867.png 1536w, https://gpcstudio.es/wp-content/uploads/2015/04/sublime-text-screen.png 1600w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /><figcaption id="caption-attachment-2677" class="wp-caption-text">Sublime Text</figcaption></figure></p>
<p>Algunas de las características que se pueden destacar de Sublime Text son:</p>
<ul>
<li>Modo de escritura sin distracción.</li>
<li>Mini mapa de todo el código.</li>
<li>Diferentes modos de visualización: Hoja simple, 2, 3 o 4 columnas en horizontal o vertical.</li>
<li>Cambiar de Proyecto de forma instantánea.</li>
<li>Selección múltiple.</li>
<li>Cursor múltilínea.</li>
<li>Multiplataforma: OS X, Windows y Linux.</li>
<li>Creación de <em>snippets</em>.</li>
<li>Y muchas más&#8230;</li>
</ul>
<p>Tiene prácticamente todo lo que he necesitado en cualquier editor. Antes de Sublime Text estuve utilizando el IDE Netbeans de Oracle. Realmente estaba muy completo y me sentía cómodo con él. Pero es un software realmente lento y pesado. Un IDE (<em>Integrated Development Environment</em> o Entorno de Desarrollo Integrado, en español) y un editor se diferencian en que el primero está pensado para desarrollar software pasando por sus distintas fases: escritura del código, depuración, administración de versiones, administración de proyectos, revisión de sintáxis del lenguaje, etc y un editor sirve principalmente para escribir el código. Cada editor tiene sus características como puede ser autocompletado de etiquetas o instrucciones, colores de las palabras clave del lenguaje, etc. Puedes usar desde el típico bloc de notas a Sublime Text. Pero con Sublime Text se puede trabajar prácticamente como con un IDE ya que lo puedes ampliar con muchos de los paquetes que se pueden instalar, haciendo que prácticamente no eches de menos las ventajas que te ofrece un IDE. En una próxima entrada os contaré qué paquetes estoy usando yo.</p>
<p>Olvidaba comentar que no es un software gratuito, pero tiene un precio tan asequible que no te lo puedes pensar mucho: <strong>70$</strong> o <strong>64€</strong>. Una característica que tiene es que lo puedes usar sin licencia sin limitación de tiempo o funcionalidades. Tan solo te recuerda cada X sesiones de apertura o guardado de archivos que puedes comprar una licencia. Pero no molesta nada. Hasta para eso es minimalista. Así que concluyo que este editor me va a acompañar por mucho tiempo.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://gpcstudio.es/2015/04/04/sublime-text-3-me-tiene-enamorado/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
