<?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/"
	>

<channel>
	<title>Página de la etiqueta &quot;tipos de plantillas&quot; - Curso de WordPress 2020</title>
	<atom:link href="https://cursoswp.educacion.navarra.es/cursowp2020/etiqueta/tipos-de-plantillas/feed/" rel="self" type="application/rss+xml" />
	<link>https://cursoswp.educacion.navarra.es/cursowp2020/etiqueta/tipos-de-plantillas/</link>
	<description>Curso de diseño web avanzado para docentes</description>
	<lastBuildDate>Sun, 22 Mar 2020 16:38:08 +0000</lastBuildDate>
	<language>es</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.4.3</generator>

<image>
	<url>https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/02/cropped-PNTE-32x32.png</url>
	<title>Página de la etiqueta &quot;tipos de plantillas&quot; - Curso de WordPress 2020</title>
	<link>https://cursoswp.educacion.navarra.es/cursowp2020/etiqueta/tipos-de-plantillas/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Las plantillas de Elementor y Elementor Pro</title>
		<link>https://cursoswp.educacion.navarra.es/cursowp2020/las-plantillas-de-elementor-y-elementor-pro/</link>
					<comments>https://cursoswp.educacion.navarra.es/cursowp2020/las-plantillas-de-elementor-y-elementor-pro/#comments</comments>
		
		<dc:creator><![CDATA[Administrador]]></dc:creator>
		<pubDate>Wed, 18 Mar 2020 22:39:16 +0000</pubDate>
				<category><![CDATA[Sesión 5]]></category>
		<category><![CDATA[constructor de temas]]></category>
		<category><![CDATA[exportación de plantillas]]></category>
		<category><![CDATA[importación de plantillas]]></category>
		<category><![CDATA[plantillas de Elementor]]></category>
		<category><![CDATA[plantillas globales]]></category>
		<category><![CDATA[plantillas locales]]></category>
		<category><![CDATA[tipos de plantillas]]></category>
		<guid isPermaLink="false">https://cursoswp.educacion.navarra.es/cursowp2020/?p=2258</guid>

					<description><![CDATA[<p>Definición y características de las plantillas de Elementor. Plantillas locales y globales. El constructor de temas y las plantilas globales.</p>
<p>La entrada <a href="https://cursoswp.educacion.navarra.es/cursowp2020/las-plantillas-de-elementor-y-elementor-pro/">Las plantillas de Elementor y Elementor Pro</a> se publicó por primera vez en <a href="https://cursoswp.educacion.navarra.es/cursowp2020">Curso de WordPress 2020</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>Una de las funcionalidades más potentes de Elementor y Elementor Pro son las plantillas, que desempeñan una función parecida a la de los <a href="https://cursoswp.educacion.navarra.es/cursowp2020/los-bloques-reutilizables-y-editorskit/" class="ek-link">bloques reutilizables del editor de WordPress</a>, pero con mucha mayor potencia y versatilidad. En este artículo veremos los tipos de plantillas que proporcionan ambos plugins, cómo se crean las plantillas de Elementor y Elementor Pro, y cómo se pueden utilizar en la elaboración de un sitio web.</p>



<span id="more-2258"></span>



<h2 class="wp-block-heading">Qué son las plantillas de Elementor y Elementor Pro</h2>



<p>Las plantillas de Elementor y Elementor Pro son bloques de contenido creados con cualquiera de ambos plugins, que se pueden guardar para ser reutilizadas en cualquier momento. Elementor permite crear plantillas a partir de una sección, que a su vez puede contener una o varias columnas y uno o varios widgets, o bien a partir de una página completa.</p>



<h3 class="wp-block-heading">Creación de plantillas</h3>



<p>Las plantillas se pueden crear directamente, desde el menú <strong>Plantillas</strong>, o se pueden crear desde cualquier página o entrada que esté siendo editada con Elementor. A continuación vamos a ilustrar ambos procedimientos son sendos <em>screencasts</em>.</p>



<figure class="wp-block-video caption-align-center"><video controls poster="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-elementor-1.png" src="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-1.m4v"></video><figcaption>Creación de una plantilla de Elementor desde el menú Plantillas</figcaption></figure>



<figure class="wp-block-video caption-align-center"><video controls poster="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-elementor-2.png" src="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-2.m4v"></video><figcaption>Creación de una plantilla desde el editor de Elementor</figcaption></figure>



<h3 class="wp-block-heading">Uso de las plantillas de Elementor</h3>



<p>Una vez creada una plantilla, la podemos reutilizar en cualquier entrada o página creada con Elementor, e incluso en las páginas creadas con el editor de WordPress. Hay varias formas de hacerlo, que dependen de si tenemos instalado o no el plugin Elementor Pro.</p>



<h4 class="wp-block-heading">Inserción de plantillas con Elementor Pro</h4>



<p>Si tenemos instalado Elementor Pro, podemos insertar una plantilla desde el botón de inserción de plantillas del editor de Elementor, o desde el editor de WordPress, para lo cual tenemos que copiar y pegar el shortcode correspondiente. Vamos a verlo en el siguiente <em>screeencast</em>.</p>



<figure class="wp-block-video caption-align-center"><video controls poster="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/insercion-plantillas-elementor-pro.png" src="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/uso-plantillas-elementor-pro.m4v"></video><figcaption>Inserción de plantillas con Elementor Pro</figcaption></figure>



<h4 class="wp-block-heading"> Inserción de plantillas con Elementor</h4>



<p>Si no está instalado el plugin Elementor Pro, solo podremos insertar las plantillas de Elementor desde el editor de este plugin, pero no desde el editor de WordPress, ya que no podemos acceder a los shortcodes de las plantillas. Afortunadamente, existe un plugin que resuelve esta limitación: <a aria-label="Elementor Blocks for Gutenberg (opens in a new tab)" rel="noreferrer noopener" href="https://wordpress.org/plugins/block-builder/" target="_blank" class="ek-link">Elementor Blocks for Gutenberg</a>, cuyo uso podemos ver en el siguiente <em>screencast</em>.</p>



<figure class="wp-block-video caption-align-center"><video controls poster="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/insercion-plantillas-elementor.png" src="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/uso-plantillas-elementor.m4v"></video><figcaption>Inserción de plantillas con Elementor</figcaption></figure>



<h4 class="wp-block-heading">Inserción de plantillas en widgets</h4>



<p>Si disponemos de Elementor Pro, podemos insertar las plantillas que hayamos creado no solo en entradas y páginas, tal como acabamos de ver, sino incluso en las áreas de widgets. Esto es posible gracias al widget denominado <strong>Biblioteca de Elementor</strong>, que permite insertar las plantillas que hayamos definido en cualquiera de las áreas de widgets o barras laterales del tema que estemos utilizando en nuestro sitio web. En el siguiente vídeo (en inglés) se muestra cómo hacerlo.</p>



<figure class="wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube caption-align-center wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="Embed Elementor Templates in Customizer, Widgets Area, Inside Themes &amp; Anywhere [Pro]" width="800" height="450" src="https://www.youtube.com/embed/0srVsjqlJmY?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Embed Elementor Templates in Customizer, Widget Áreas, Inside Themes &amp; Anywhere [Pro]</figcaption></figure>



<h3 class="wp-block-heading">Exportación e importación de plantillas</h3>



<p>En la segunda sesión de este curso ya vimos <a class="ek-link ek-link" href="https://cursoswp.educacion.navarra.es/cursowp2020/los-bloques-reutilizables-y-editorskit/">cómo se exportan los bloques mediante el plugin EditorsKit</a>, y <a href="https://cursoswp.educacion.navarra.es/cursowp2020/importacion-de-bloques-con-editorskit/" class="ek-link">cómo se pueden importar posteriormente</a>, tanto desde el mismo sitio en el que han sido creados, como desde un sitio web diferente.</p>



<p>Pues bien, Elementor utiliza un sistema semejante al de EditorsKIt, también basado en <a aria-label="ficheros JSON (opens in a new tab)" rel="noreferrer noopener" href="https://es.wikipedia.org/wiki/JSON" target="_blank" class="ek-link">ficheros JSON</a>, aunque en este caso mucho más potente, flexible y versátil. Este sistema tiene un enorme potencial, ya que permite aprovechar el trabajo realizado en el diseño y construcción de un sitio web para exportarlo a cualquier otro sitio en el que también esté instalado el plugin Elementor.</p>



<p>En este curso no vamos a realizar prácticas de exportación e importación de plantillas; no obstante, podemos ver su funcionamiento en el videotutorial que incluimos a continuación.</p>



<figure class="wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube caption-align-center wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="Elementor - Como exportar e importar plantillas y secciones" width="800" height="450" src="https://www.youtube.com/embed/g7oiqdovPF0?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Elementor &#8211; Cómo exportar e importar plantillas y secciones</figcaption></figure>



<h2 class="wp-block-heading">Tipos de plantillas</h2>



<p>Elementor y Elementor Pro Disponen de un amplio y potente arsenal de plantillas y elementos reutilizables, algunos de los cuales vamos a explicar a continuación.</p>



<h3 class="wp-block-heading">Plantillas locales</h3>



<p>Estas plantillas, cuyo uso ya hemos visto en anteriores epígrafes, permiten guardar una sección, o una página completa, de forma que pueda ser reaprovechada posteriormente en entradas, páginas individuales o incluso en widgets. Tanto las plantillas de sección como las de página se pueden crear con Elementor y con Elementor Pro.</p>



<h3 class="wp-block-heading">Plantillas globales</h3>



<p>El objetivo de este tipo de plantillas no es solo reaprovechar un bloque de contenido (widget, sección o página), sino sobre todo crear los elementos estructurales que definen un sitio web completo. El conjunto de todas las plantillas globales forma lo que se conoce como <a aria-label="constructor de temas (opens in a new tab)" rel="noreferrer noopener" href="https://elementor.com/features/theme-builder/" target="_blank" class="ek-link">constructor de temas</a>, funcionalidad exclusiva del plugin Elementor Pro.</p>



<p>Según la función que desempeñan en el diseño y estructura de un sitio web, se pueden distinguir los siguientes tipos de plantillas globales:</p>



<ul><li>Artículos individuales, que pueden ser tanto <a aria-label="entradas (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/354-creating-a-single-post-template" target="_blank" class="ek-link">entradas</a> como <a aria-label="páginas (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/359-creating-a-single-page-template-with-elementor-pro" target="_blank" class="ek-link">páginas</a>.</li><li><a aria-label="páginas de archivo (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/339-creating-an-archive-template-with-elementor-pro" target="_blank" class="ek-link">Páginas de archivo</a>.</li><li><a aria-label="cabecera (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/335-create-headers-using-elementors-theme-builder" target="_blank" class="ek-link">Cabecera</a>.</li><li><a aria-label="pie de página (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/337-create-footers-using-elementors-theme-builder" target="_blank" class="ek-link">Pie de página</a>.</li><li><a aria-label="ventana emergente o popup (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/472-popups" target="_blank" class="ek-link">Ventana emergente o <em>popup</em></a>.</li></ul>



<h3 class="wp-block-heading">Widgets globales</h3>



<p>Los <a aria-label="widgets globales (opens in a new tab)" href="https://docs.elementor.com/article/100-global" target="_blank" rel="noreferrer noopener" class="ek-link">widgets globales</a> son un tipo especial de widgets de Elementor, y funcionan de un modo semejante a las demás plantillas. De hecho, son muy parecidos en concepto a los <a href="https://cursoswp.educacion.navarra.es/cursowp2020/los-bloques-reutilizables-y-editorskit/" class="ek-link">bloques reutilizables del editor de WordPress</a>, ya que se pueden utilizar múltiples veces en un mismo sitio web; si se modifica un widget global, los cambios se aplicarán a cualquier lugar donde se inserte dicho widget.</p>



<p>Al igual que los bloques reutilizables, también los widgets globales se pueden desenlazar o desvincular de sus respectivos modelos para, de este modo, poder ser modificados individualmente sin que dicha modificación afecte a la plantilla original.</p>



<h2 class="wp-block-heading">Condiciones de las plantillas</h2>



<p>Siempre que se utilice Elementor Pro, a todas las plantillas, tanto locales como globales, se les pueden aplicar <a aria-label="condiciones (opens in a new tab)" rel="noreferrer noopener" href="https://docs.elementor.com/article/311-conditions" target="_blank" class="ek-link">condiciones</a>, mediante las cuales es posible determinar qué partes de un sitio web se van a construir con una plantilla u otra. Pondremos algunos ejemplos, todos ellos tomados del sitio web de este curso, que permitirán entender mejor el concepto:</p>



<ul><li>Se puede crear una plantilla global de cabecera o de pie de página que se aplique a todo el sitio web. Es el caso de este curso, que utiliza sendas plantillas de cabecera y pie de página en todas sus páginas.</li><li>Se puede crear una plantilla para artículos individuales que se aplique a todas las entradas (pero no a las páginas). En este sitio web existe una plantilla única para todas las entradas individuales, pero plantillas distintas para las páginas. Por ejemplo, la,página <a href="https://cursoswp.educacion.navarra.es/cursowp2020/contacto/" class="ek-link">Contacto</a> se ha elaborado con una plantilla notoriamente distinta a la que hemos aplicado a la página <a href="https://cursoswp.educacion.navarra.es/cursowp2020/instrucciones-del-curso/" class="ek-link">Instrucciones del curso</a>.</li><li>Se puede crear una plantilla de páginas de archivo que solo se aplique a la página en la que se muestra la categoría X, y diseñar otra plantilla de página de archivo para la categoría Y. De este modo, ambas páginas pueden tener un diseño distinto. No es el caso de este sitio web, cuyas páginas de archivo son todas iguales.</li></ul>



<h2 class="wp-block-heading">La biblioteca de plantillas de Elementor</h2>



<p>Además de los tipos de plantilla que ya hemos visto, los plugins Elementor y Elementor Pro proporcionan a sus usuarios otro recurso de enorme utilidad: la <a aria-label=" (opens in a new tab)" href="https://library.elementor.com" target="_blank" rel="noreferrer noopener" class="ek-link">biblioteca de plantillas</a>, formada por un amplísimo catálogo de electos prediseñados, a los que se puede acceder siempre que se haya adquirido una licencia de Elementor Pro y se haya establecido una conexión entre el sitio web y una cuenta de usuario de Elementor.</p>



<p>Como ya hemos visto en el <em>screencasts</em> <strong>Inserción de plantillas con Elementor</strong>, a la biblioteca de plantillas se accede desde el editor de Elementor, para lo cual hay que hacer clic en el icono gris con forma de carpeta. Al hacerlo, se accede a una ventana modal organizada en tres áreas:</p>



<ul><li><strong>Bloques</strong>, que contiene bloques prediseñados (una o varias secciones de Elementor).</li><li><strong>Páginas</strong>, con diseños de páginas completas (en el caso de los Template Kits, son diseños de temas completos, organizados en varias plantillas de pagina diferentes).</li><li><strong>Mis plantillas</strong>, que contiene las plantillas diseñadas por el usuario o que este haya podido importar de diversas fuentes.</li></ul>



<div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div>



<p>Todas las plantillas de bloques y páginas están etiquetadas, lo cual permite clasificarlas por tipos, realizar búsquedas, marcarlas como favoritos, etc. además, mediante los iconos que aparecen en la parte superior de la ventana modal, se pueden importar plantillas y guardar como plantilla la página que el usuario está editando.</p>



<h3 class="wp-block-heading">Cómo se utiliza la biblioteca de plantillas</h3>



<p>Los tres vídeos que incluimos a continuación muestran cómo se utiliza esta biblioteca. Los dos primeros videotutoriales están en español, y el tercero en inglés:</p>



<figure class="wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube caption-align-center wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="Introducción a las Plantillas de Elementor" width="800" height="450" src="https://www.youtube.com/embed/eq-hWIaGHwA?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Introducción a las plantillas de Elementor</figcaption></figure>



<figure class="wp-block-embed-youtube aligncenter wp-block-embed is-type-video is-provider-youtube caption-align-center wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="Introducción a la Librería de Bloques de Elementor" width="800" height="450" src="https://www.youtube.com/embed/8_KvcdJAkV8?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Introducción a la librería de bloques de Elementor</figcaption></figure>



<figure class="wp-block-embed-youtube aligncenter wp-block-embed is-type-video is-provider-youtube caption-align-center wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="How to Use the Template Library" width="800" height="450" src="https://www.youtube.com/embed/o-FJhXiZhXA?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>How to Use The Template Library</figcaption></figure>
<p>La entrada <a href="https://cursoswp.educacion.navarra.es/cursowp2020/las-plantillas-de-elementor-y-elementor-pro/">Las plantillas de Elementor y Elementor Pro</a> se publicó por primera vez en <a href="https://cursoswp.educacion.navarra.es/cursowp2020">Curso de WordPress 2020</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://cursoswp.educacion.navarra.es/cursowp2020/las-plantillas-de-elementor-y-elementor-pro/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		<enclosure url="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-1.m4v" length="6623927" type="video/mp4" />
<enclosure url="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/creacion-plantilla-2.m4v" length="14516959" type="video/mp4" />
<enclosure url="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/uso-plantillas-elementor-pro.m4v" length="13867497" type="video/mp4" />
<enclosure url="https://cursoswp.educacion.navarra.es/cursowp2020/wp-content/uploads/2020/03/uso-plantillas-elementor.m4v" length="5482601" type="video/mp4" />

			</item>
	</channel>
</rss>
