tag:blogger.com,1999:blog-52342803077119711062023-11-15T17:46:35.400+00:00Curso UPNA Joomla 2011/2012Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.comBlogger83125tag:blogger.com,1999:blog-5234280307711971106.post-79203231839811617402011-11-22T18:30:00.004+00:002011-11-22T19:04:16.445+00:00Redes sociales: opción de compartir nuestra página conEl colectivo Aldezharra de Pamplona ha lanzado recientemente su página web desarrollada en Joomla: <a href="http://www.aldezaharra.org/">http://www.aldezaharra.org</a>. Podéis observar que debajo de cada artículo se muestran iconos de las redes sociales más conocidas (Facebook, Twitter, Tuenti, Google+, LinkedIn...), ofreciendo la posibilidad de compartir el contenido en los perfiles personales de los usuarios.<div><br /></div><div>La extensión que da esta funcionalidad es el <i>plugin </i><b>ValAddThis</b>, cuya ficha en el portal de extensiones la podéis encontrar <a href="http://extensions.joomla.org/extensions/social-web/social-bookmarking/12639">pulsando aquí</a>. Se trataría de la opción más extendida de las ¡más de 100! que hay publicadas en la <a href="http://extensions.joomla.org/extensions/social-web/social-bookmarking">sección Social Bookmarking</a>.</div><div><br /></div><div><b>Descarga del fichero del <i>plugin</i>:</b></div><div><br /></div><div>Desde <b>Download</b> en la ficha accedemos a la página del desarrollador, pulsamos en <b>plg_content_valaddthis-roundedCSS.zip</b>, y nuevamente <b>Download</b>, para obtener el fichero comprimido y compatible con Joomla 1.7: <b>plg_content_valaddthis_1.5.4-roundedCSS</b>.</div><div><br /></div><div><b>Instalación:</b></div><div><br /></div><div>Lo instalamos como siempre: <b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b>.</div><div><br /></div><div>Al tratarse de un plugin siempre tenemos que confirmar si está activado o no: <b>Extensiones -> Gestor de Plugins -></b> y pulsamos el iconito rojo de la<b> columna Activado</b> para transformarlo en el verde, indicador de su activación.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Activar el plugin, tal y como lo hemos hecho, es suficiente para que todos nuestros artículos muestren los iconos de redes sociales con la funcionalidad de compartir en las mismas. Comprobadlo en la parte pública.</div><div><br /></div><div>El plugin ofrece multitud de opciones de configuración que podéis probar entrando al mismo desde el <b>Gestor de Plugins</b>. Veréis a la derecha dos grupos de parámetros:</div><div><ul><li>Opciones básicas</li><li>Opciones avanzadas</li></ul><div><br /></div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-38940995578171808242011-11-17T19:35:00.003+00:002011-11-17T19:41:57.304+00:00Una agenda con Google CalendarEn clase os he presentado y recomendado la herramienta Calendar de Google. Dejo de vuestra cuenta probar todas las opciones que permite. En esta entrada os voy a comentar simplemente cómo podemos incrustarlo en nuestra página. <div><br /></div><div>Desde la página de <b>Configuración</b> de vuestro calendario (se pueden crear ilimitados) , en la opción <b>Incrustar este calendario</b>, pulsáis <b>Personaliza el color, el tamaño y otras opciones</b>. Desde aquí podemos configurar el aspecto y tamaño de cómo queremos que se vea en nuestra página. Cuando ya lo tenemos a nuestro gusto,<b> copiamos el código</b> que aparece que la parte superior y lo<b> pegamos en nuestro artículo</b> de Joomla. Et voilà!!</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-31162327630825542142011-11-17T18:49:00.003+00:002011-11-17T19:32:08.356+00:00Agenda de eventos: JEventsUna <b>agenda de eventos</b> es una función muy común en muchos portales web. En ocasiones se abusa de su uso, si no se dinamiza con mucha frecuencia. No tiene mucho sentido utilizarla para publicar unos pocos eventos anuales, para lo que sería suficiente mostrar artículos ordenados cronológicamente utilizando un elemento de menú del tipo <b>Categoría Blog</b>. Esto es lo que transmite <a href="http://www.segundafamilia.com/index.php?option=com_jevents&task=month.calendar&Itemid=75">la agenda instalada en la página web de Segunda Familia</a> que estamos teniendo de referencia. El usuario encontrará útil su uso si encuentra información cada semana, por ejemplo.<div><br /></div><div>La oferta de extensiones para instalar<a href="http://extensions.joomla.org/extensions/calendars-a-events/events/events-calendars"> agendas en Joomla</a> es bastante grande. Una de las más utilizadas, no comercial y compatible con Joomla 1.7 es <a href="http://extensions.joomla.org/extensions/calendars-a-events/events/events-calendars/95">JEvents</a>.</div><div><br /></div><div><b>Instalación:</b></div><div><br /></div><div>Pulsando <b>Download </b>debemos descargar en <b>Main component</b> y <b>Mini-Calendar Module</b>, los cuales instalaremos como siempre desde el Gestor de extensiones. En el caso del componente, surgen dos pantallas intermedias con los siguientes mensajes:</div><div><ul><li><b>Database now setup</b> donde debemos pulsar <b>Continue</b></li><li>y <b>Please check configuration and save in order to use JEvents</b> donde pulsaremos <b>Guardar & Cerrar</b> en la parte superior derecha</li></ul><div>La agenda JEvents es una extensión del tipo componente, por lo que se gestiona desde<b> Componentes -> JEvents</b>. Cada evento se crea desde <b>Manage Events -> Nuevo</b> donde podemos definir un título, descripción, hora de inicio y finalización, periodicidad, ubicación, etc.</div></div><div><br /></div><div>Es posible organizar estos eventos por categorías las cuales de gestionan desde <b>Manage Categories</b>. Podríamos clasificarlos por ejempo por: charlas, presentaciones, cursos, talleres, etc.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Si creamos un nuevo elemento de menú, en la ventana de <b>Tipo de elemento del menú</b> podéis probar los siguientes:</div><div><ul><li>List by Category</li><li>List by Day </li><li>View by Month</li><li>Date range</li><li>Search JEvents</li><li>List by week</li><li>List by year</li></ul><div>El segundo fichero que hemos instalado permite visualizar un módulo con un mini-calendario que enlaza a nuestros eventos. Para ello vamos a Extensiones -> Gestor de Módulos -> nuevo -> JEvents Calendar desde donde le damos un título, una posición en nuestra plantilla, y lo configuramos como más práctico nos resulte.</div></div><div><br /></div><div>Nota: Perdonad que haya redactado esta entrada con el componente en inglés. No he encontrado el fichero de traducción hasta ahora (!!!). Lo <a href="http://www.jevents.net/en/downloads/category/54-jevents_20_translations">encontraréis aqu</a>í (es-ES_JEvents_2.0_J16.zip). Se instala desde el gestor de extensiones, como los ficheros anteriores.</div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-11948728944854216462011-11-15T19:21:00.003+00:002011-11-15T19:39:38.630+00:00Información de acceso restringidoVamos a ver cómo podemos publicar información en nuestra página que no sea visible hasta que nos identifiquemos con un par <b>usuario-contraseña</b>. La idea básica es muy sencilla.<div><br /></div><div>Esta funcionalidad puede ser útil por ejemplo para una asociación que quiera distribuir información únicamente a sus asociados; o una empresa que muestre datos de interés para sus clientes o proveedores; o una página de cursos que distribuya documentos sólo a sus alumnos; etc.</div><div><br /></div><div>Lo primero que vamos a hacer va a ser activar el módulo de acceso desde donde se podrá insertar el par usuario-contraseña: <b>Gestor de Módulos -> Nuevo -> Acceso -> Título: ÁREA PRIVADA y le damos una posición en nuestra plantilla</b>.</div><div><br /></div><div>Lo siguiente va a ser crear un perfil de usuario restringido que pueda entrar desde el módulo anterior: <b>Usuarios -> Gestor de usuarios -> Nuevo</b> y rellenamos los campos:</div><div><ul><li></li><li>Nombre, nombre real del perfil</li><li>Nombre Acceso: será el campo <b>usuario </b>en el módulo de acceso</li><li>Contraseña</li><li>Confirmar Contraseña</li><li>Email, un formato válido de correo</li></ul>Utilizad los campos<b> Nombre Acceso y Contraseña</b> para acceder desde el módulo de acceso (en la parte pública). Veréis que Joomla os da la bienvenida, pero que la página ofrece la misma información que antes.</div><div><br /></div><div>¿Cómo podemos hacer que algo se muestre sólo al hacer login? Lo más sencillo e intuitivo es ir a <b>Menús->Menú Principal</b> y crear un nuevo elemento de menú de cualquier tipo, que por ejemplo se llame <i>Información privada</i>, pero al que debéis poner el campo <b>Acceso </b>como <b>Registrado</b>. Así, este elemento del menú sólo se ve cuando se hace <i>login</i>, y no lo ven los usuarios público generales.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-91625916365771319842011-11-15T18:37:00.005+00:002011-11-15T19:09:39.772+00:00Formularios en JoomlaUn formulario es un elemento para la petición de información al usuario. Podemos necesitar desde un formulario de contacto básico que nos llegue por correo, hasta formularios más complejos como la solicitud de currículums, registro en un curso, encuestas de opinión, petición de un producto, etc.<div><br /></div><div>El portal de extensiones de Joomla ofrece muchas alternativas en la categoría <a href="http://extensions.joomla.org/extensions/contacts-and-feedback/forms">Contacts & Feedback -> Forms</a>. Sin embargo, la creación de un formulario es bastante compleja, ya que requiere la definición de muchos parámetros por cada campo, por ejemplo:</div><div><ul><li>Formato del campo: texto, fecha, email, numérico, lista, casilla, etc</li><li>Límite de caracteres (en el caso de los textuales)</li><li>Anchura del campo en la parte pública</li><li>Obligatoriedad del mismo</li><li>Mensaje por no cumplir formato u obligatoriedad</li><li>Etiqueta o leyenda de texto describiendo el campo</li><li>Código único de cada campo que se requiere en formularios HTML</li><li>Texto de ayuda extra para el usuario</li><li>...</li></ul><div>Debido a esta complejidad, vamos utilizar la herramientas de formularios de Google, más sencilla de gestionar y que nos permite insertar sus formularios en nuestros artículos de Joomla.</div></div><div><br /></div><div>Con nuestra cuenta de Google accedemos a su herramienta <b>Google Docs</b>. Pulsando <b>Crear</b> seleccionamos <b>Formularios</b>. Nos surge una ventana donde podemos darle un título y definimos los campos del mismo desde <b>Add item</b>. Dejo de vuestra cuenta practicar con los distintos tipos de campos que podemos usar. Recordad pulsar <b>Grabar </b>cuando finalicéis.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Para mostrar vuestros formularios en la página, se debe pulsar el botón <b>Más acciones</b> cuando editáis el mismo en Google Docs (arriba a la derecha) y <b>Embed</b>. Yo visualizo esta herramienta en inglés y no estoy seguro de cómo lo veréis vosotros. ¿Insertar, quizás? El caso es que os proporciona un código que debéis copiar en vuestro artículo.</div><div><br /></div><div>Si tras ver el resultado en vuestra página quisierais modificar las dimensiones del cuadro de visualización del formulario, podéis retocar la anchura y altura del mismo, en el código que acabáis de insertar: <b>width="760" height="937"</b>.</div><div><br /></div><div>Probad a rellenar el formulario varias veces y comprobáis su funcionamiento. La información queda recopilada en formato hoja de cálculo en Google Docs, desde donde podéis exportarla a texto, Excel, etc.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-10952909648225303532011-11-15T18:03:00.003+00:002011-11-15T18:36:20.033+00:00Pestañas en un artículo extenso: Tabber y SliderSi hemos de publicar un artículo muy extenso o tenemos una ficha muy completa de un producto, es recomendable estructurar visualmente esta información para facilitar su lectura al usuario. En este blog podéis ver una introducción al comportamiento de los usuarios en la lectura de un sitio web en función de su extensión: <a href="http://dissenyaweb.com/blog/diseno_web/lectura-y-usabilidad-web-como-leen-los-usuarios-el-contenido-de-un-sitio-web/">Lectura y usabilidad web: como leen los usuarios el contenido de un sitio web</a>.<div><br /></div><div>En <a href="http://www.circulodemaquetadores.com/%C2%BFcomo-leen-en-la-web-los-usuarios">esta otra página</a> muestran un patrón visual de las zonas que más atraen la atención de un usuario que está navegando en internet. Observad la recomendación al final de esta entrada:</div><div><br /></div><div><i>"<b>No entierres el contenido en documentos demasiado largos</b>: Divide los textos en varios documentos enlazados o crea un índice que permita identificar y moverse por las secciones de cada documento."</i><div><br /></div><div>A continuación veremos dos <i>plugins </i>muy prácticos, vistosos y sencillos de utilizar para crear pestañas en un artículo de Joomla que van mostrando diferentes partes de la información conforme se van pulsando. En esta página de <a href="http://http//www.teguardo.com">alquiler de trasteros</a>, en la sección de Preguntas frecuentes, podéis ver uno de estos <i>plugins </i>en funcionamiento.</div><div><br /></div><div>Las fichas de las extensiones Tabber y Slider en el portal de Joomla son:</div><div><ul><li>Tabber: <a href="http://extensions.joomla.org/extensions/news-display/contents-panel/14493">http://extensions.joomla.org/extensions/news-display/contents-panel/14493</a></li><li>Slider: <a href="http://extensions.joomla.org/extensions/news-display/contents-panel/14689">http://extensions.joomla.org/extensions/news-display/contents-panel/14689</a></li></ul><div>Desde <b>Download </b>pasamos descargar ambos <i>plugins </i>y los instalamos en nuestra página desde el <b>Gestor de extensiones</b>. Al tratarse de extensiones del tipo <i>plugin</i>, confirmaremos que están habilitados desde el <b>Gestor de plugins</b>.</div></div><div><br /></div><div>Para su utilización insertamos en el artículo el código siguiente, en función del formato de pestaña que más nos guste:</div><div><br /></div><div><b>Tabber:</b></div><div><br /></div><div><div>{tab=Título de la primera pestaña}</div><div>Aquí escribimos cualquier contenido, pudiendo utilizar los códigos de otros pluigns: galerías, mapas, etc.</div><div>{tab=Título de la segunda pestaña}</div><div>Aquí el contenido de la segunda pestaña...</div><div>{/tabs}</div><div><br /></div></div><div><b>Slider:</b></div><div><br /></div><div><div><span class="Apple-style-span">{slide=</span>Título del primer slider<span class="Apple-style-span">}</span></div><div>Aquí escribimos cualquier contenido, pudiendo utilizar los códigos de otros pluigns: galerías, mapas, etc.</div><div><span class="Apple-style-span">{slide=</span>Título del segundo slider<span class="Apple-style-span">}</span></div><div>Aquí el contenido de la segunda pestaña...</div><div>{/slides}</div><div><br /></div><div>Así por ejemplo, si quisiéramos hacer una ficha de un vehículo con el <i>Tabber</i>:</div><div><br /></div><div><div>{tab=Descripción}</div><div>Texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo texto descriptivo del vehículo. </div><div>{tab=Galería fotográfica}</div><div>{gallery}galprueba{/gallery}</div><div><div>{tab=Punto de venta}</div><div>{mosmap width='500'|height='400'|lat='52.052312'|lon='4.447141'|zoom='15'|mapType='Satellite'|text='Texto del bocadillo'}</div></div><div>{tab=Información de contacto}</div><div>Telefóno: 948111222</div><div>Email: aaa@aaa.com</div><div>Persona de contacto: Juan Pérez</div><div>{/tabs}</div></div><div><br /></div></div><div>Sin olvidar el código de cierre de pestañas {/tabs}. Tened en cuenta que ambos sistemas de pestañas son compatibles con la inserción de contenido extra fuera de las mismas, que será visible en el artículo en todo momento.</div><div><br /></div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-16818575619374111422011-11-10T19:31:00.003+00:002011-11-10T19:41:11.645+00:00Libro de visitasLa opción de que el usuario pueda dejar su opinión sobre el sitio web era muy popular hace años. Hoy en día la comunicación con los usuarios se ha ido desviando hacia las redes sociales. Sin embargo, ya que nuestra página de referencia (<a href="http://segundafamilia.com/index.php?option=com_phocaguestbook&view=phocaguestbook&id=1&Itemid=79">Segunda Familia</a>) dispone de un libro de visitas, y conocemos la alta calidad de las extensiones de Phoca, vamos instalar y configurar <a href="http://extensions.joomla.org/extensions/contacts-and-feedback/guest-book/3451">Phoca Guestbook</a>.<div><br /></div><div>Desde <b>Download </b>descargamos com_phocaguestbook_v2.0.1.zip, compatible con nuestro Joomla, y lo instalamos como siempre.</div><div><br /></div><div>Al tratarse de un componente, accedemos a él desde <b>Componentes -> Phoca Guestbook</b>. En la demostración hemos creado (pulsando <b>Guestbooks->Nuevo</b>) dos libros de visitas denominados:</div><div><ul><li>Libro de visitas</li><li>Danos tu opinión</li></ul><div><b>Visualización:</b></div></div><div><br /></div><div>Desde <b>Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Phoca Guestbooks-> Guestbook</b>, seleccionando en el campo <b>Select Guestbook</b> a la derecha el libro que deseamos activar en este menú.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-29815017316109132132011-11-10T19:18:00.002+00:002011-11-10T19:27:21.116+00:00Phoca MapsUna segunda opción de inserción de mapas, nos la proporciona <a href="http://extensions.joomla.org/extensions/maps-a-weather/maps-a-locations/maps/8590">la extensión Phoca Maps</a>. Se trata de un componente completo con un panel de control donde se gestionan y organizan nuestros mapas, y que se visualizan desde los menús.<div><br /></div><div>Desde <b>Download </b>hay que descargar el siguiente fichero compatible con nuestro Joomla 1.7: com_phocamaps_v2.0.2.zip.</div><div><br /></div><div>Tras su instalación:</div><div><br /></div><div><b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b></div><div><br /></div><div>entramos al componente: Componentes -> Phoca Maps. Desde <b>Maps-> Nuevo</b> creamos tantos mapas como queramos indicando la<b> latitud, longitud, zoom y dimensiones de visualización</b> (entre otros parámetros).</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Se lleva a cabo desde la sección de menús: <b>Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Phoca Maps -> Map View</b>. En el formulario de edición del elemento de menú, seleccionaríamos el mapa que deseamos ver desde el campo: <b>Select Map</b>.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-59930923177381486252011-11-10T18:56:00.004+00:002011-11-10T19:14:16.852+00:00Mapas dinámicos en nuestra página: Googlemaps PluginLa tecnología Google Maps permite la creación de mapas dinámicos con gran cantidad de funcionalidades en nuestra página. Vamos a instalar una extensión de tipo <i>plugin</i> para que mediante un simple código que insertemos en cualquier artículo, Joomla nos muestre una mapa de este tipo.<div><br /></div><div>La <a href="http://extensions.joomla.org/extensions/maps-a-weather/maps-a-locations/maps">sección de geolocalización del portal de extensiones de Joomla</a> ofrece una gran variedad de posibilidades. Vamos a localizar <a href="http://extensions.joomla.org/extensions/maps-a-weather/maps-a-locations/maps/1147">Googlemaps Plugin</a> y acceder a su ficha. Desde Download vamos a descargar el fichero plugin_googlemap_J16_J17.2.14.zip, el cual es compatible con Joomla 1.7 y pasaremos a instalar como siempre:</div><div><br /></div><div><b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b></div><div><br /></div><div>Al tratarse de un <i>plugin</i> confirmaremos que esté activado en: <b>Extensiones -> Gestor de plugins -> Google Maps</b>. Si no lo estuviera, lo activamos.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Accedemos a la edición del artículo donde queremos insertar nuestro mapa y escribimos el siguiente código:</div><div><br /></div><div>{mosmap}</div><div><br /></div><div>Vemos el resultado en la página. Nos debe aparecer un mapa situado en Estados Unidos. ¿Cómo controlamos el punto exacto del icono del mapa? Pues ampliando los parámetros del código anterior:</div><div><br /></div><div>{mosmap width='500'|height='400'|lat='52.052312'|lon='4.447141'|zoom='15'|mapType='Satellite'|text='Texto del bocadillo'}</div><div><br /></div><div>¡Ojo! El texto anterior se debe escribir evitando cualquier retorno de carro o carácter extra que hayamos incluido al pegarlo. Las variables con las que jugar serían:</div><div><ul><li><b>width </b>y <b>height </b>son las dimensiones que queréis que tenga el mapa en vuestra página</li><li><b>lat</b> y <b>lon</b> son las coordenadas en las que se centrará. Como referencia, podéis coger los de la UPNA: lat='42.800116'|lon='-1.636233'</li><li><b>zoom</b> es el valor del zoom en el rango 0-19. Cuanto mayor zoom, imágenes más cercanas</li><li><b>text </b>es el texto que mostrará el bocadillo del icono</li></ul><div><br /></div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-4065330043031495412011-11-10T18:30:00.005+00:002011-11-10T18:51:25.718+00:00Galería fotográfica en Flash: Ozio GalleryLa tecnología Flash permite utilizar efectos mucho más vistosos. Es el caso de esta galería que podéis ver en funcionamiento <a href="http://oziogallery.joomla.it/">en esta demo</a>. <a href="http://extensions.joomla.org/extensions/photos-a-images/photo-flash-gallery/4883">La ficha de esta extensión</a> se halla en la <a href="http://extensions.joomla.org/extensions/photos-a-images/photo-flash-gallery">sección Photo Flash Gallery</a> del portal de extensiones de Joomla. Observad la <b>C</b> verde al lado del título indicando que es un componente completo extra.<div><br /></div><div>Pulsando <b>Download</b> accedemos la sección de descarga de la web del desarrollador. Desde esta misma página descargaríamos el fichero com_oziogallery2.6.zip a nuestro equipo, y lo instalaríamos como siempre:</div><div><br /></div><div><div><b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b></div><div><br /></div><div>veréis que en el menú desplegable de <b>Componentes</b> en la administración de Joomla se ha creado el elemento correspondiente: <b>oziogallery3</b>.</div></div><div><br /></div><div>Las imágenes se deben subir a una carpeta desde el <b>Gestor Multimedia</b> de manera similar a como se ha hecho con la <a href="http://upnajoomla.blogspot.com/2011/11/la-galeria-fotografica-sige-simple.html">galería SIGE</a>. Podría valer la misma carpeta <i>galprueba </i>que hemos creado en dicha entrada.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Tenemos que crear el elemento de menú correspondiente: <b>Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Ozio Gallery 3</b>, desde donde podemos seleccionar una serie de opciones muy vistosas:</div><div><ul><li>Tilt 3D viewer</li><li>Skin Flashgallery</li><li>Skin Futura</li><li>Skin Carousel</li><li>Skin Imagerotator</li><li>Skin Accordion</li><li>Skin Mediagallery</li><li>Skin Cooliris</li><li>Skin Flickr PictoBrowser</li><li>Skin Picasa PictoBrowser</li><li>Skin Pup 'n Goo Skin</li></ul></div><div>Recomiendo ir probando todas ellas. Antes de guardar el nuevo elemento de menú, debemos indicar en el campo <b>Gallery folder path</b> (a la derecha del formulario de creación de este tipo de menú) la carpeta donde hemos subido las correspondientes imágenes. En este caso de ejemplo sería: <i>images/galprueba</i>.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-133081205424355542011-11-10T18:15:00.003+00:002011-11-10T18:29:10.533+00:00Galería fotográfica Phoca GalleryLa ficha de esta extensión en el <a href="http://extensions.joomla.org/extensions/photos-a-images/photo-gallery/3150">portal de extensiones de Joomla</a>, muestra que se trata de un componente completo (icono verde con una <b>C</b>). Pulsando <b>Download </b>se debe descargar el fichero de instalación com_phocagallery_v3.1.1.zip desde el portal de su desarrollador.<div><br /></div><div>Si procedéis a su instalación:</div><div><br /></div><div><b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b></div><div><br /></div><div>veréis que en el menú desplegable de <b>Componentes </b>en la administración de Joomla se ha creado el elemento correspondiente. Pulsando sobre él pasamos al panel de control de Phoca Gallery.</div><div><br /></div><div>Debemos crear primero categorías (<b>Categories</b>) que se corresponderán con nuestros álbumes, y después podremos subir las imágenes desde <b>Images</b>. Al subir una foto es obligatorio clasificarla en una categoría que hayamos creado previamente.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>A diferencia de la galería SIGE de la entrada anterior, en este caso demos entrar a Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Phoca Gallery desde donde podemos enlazar a:</div><div><ul><li>Listado de todas las categorías o álbumes</li><li>Listado de imágenes de una única categoría.</li></ul><div>El resultado será algo similar a <a href="http://www.phoca.cz/demo/modal-box">la demo en la página de Phoca Gallery</a>.</div></div><div><br /></div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-73446615112905485362011-11-10T17:47:00.003+00:002011-11-10T18:51:05.576+00:00La galería fotográfica SIGE (Simple Image Gallery Extended)Hemos visto cómo insertar imágenes en un artículo de Joomla desde el editor de artículos (<a href="http://upnajoomla.blogspot.com/2011/09/insercion-de-imagenes-videos-y.html">ver entrada correspondiente</a>). Si queremos ofrecer al usuario la opción de ampliar una imagen pulsando sobre ella, o queremos crear una serie de imágenes en miniatura que sean ampliables (lo que sería una galería fotográfica), necesitamos utilizar extensiones de terceros que deberemos instalar, configurar y visualizarlos desde el administrador.<div><br /></div><div>En el portal de extensiones de Joomla podéis observar una gran variedad de opciones en la <a href="http://extensions.joomla.org/extensions/photos-a-images/photo-gallery">sección Photo Gallery</a>.<br /><div><br /></div><div>En esta primera entrada al respecto, vamos a utilizar la galería fotográfica <b>SIGE (Simple Image Gallery Extended)</b> que podéis confirmar que <a href="http://extensions.joomla.org/extensions/photos-a-images/photo-gallery/13762">no tiene licencia comercial y es compatible con Joomla 1.7</a>. Observad también que a la derecha del nombre aparece un icono morado con una <b>P</b> indicador que se trata de una extensión del tipo <i>plugin</i>.</div></div><div><br /></div><div><b>Descarga:</b></div><div><br /></div><div>Pulsando Download accedemos al portal del desarrollador desde donde podemos descargar el fichero plg_sige_v1.7-2.zip a nuestro equipo.</div><div><br /></div><div><b>Instalación:</b></div><div><br /></div><div>Todas las extensiones que iremos viendo y publicando se instala de la siguiente manera: <b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (seleccionamos el que hemos descargado a nuestro equipo) -> Subir e instalar</b>. Suficiente.</div><div><br /></div><div><b>Configuración básica:</b></div><div><br /></div><div>Las extensiones del tipo <i>plugin </i>se instalan por defecto generalmente (no siempre) como <i>desactivadas</i>. Por ello, lo primero que debemos hacer es confirmar su estado en <b>Extensiones -> Gestor de Plugins -> Buscamos 'SIGE' -> Confirmamos que el icono en la columna Activado está verde</b>. Si no, pulsamos sobre él para modificarlo.</div><div><br /></div><div>Para la creación de la galería fotográfica debemos crear una carpeta con las imágenes en el <b>Gestor Multimedia (Contenidos -> Gestor Multimedia)</b>. En clase, hemos creado la carpeta galprueba y subido a la misma varias imágenes.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>¿Cómo visualizamos la galería? Pues es suficiente con entrar al artículo donde la queréis insertar y escribir el siguiente código en el mismo:</div><div><br /></div><div>{gallery}galprueba{/gallery}</div><div><br /></div><div>donde galprueba es el nombre del directorio que hemos utilizado para subir las fotos. Refrescando la web podréis confirmar el resultado.</div><div><br /></div><div>Lógicamente es posible insertar tantas galerías como se desee en un mismo artículo como en otros, si creamos la correspondiente carpeta y utilizamos este código.</div><div><br /></div><div><b>Más opciones de configuración:</b></div><div><br /></div><div>Es posible controlar gran cantidad de parámetros de esta galería, como el tamaño de las miniaturas, el efecto de ampliación y apertura, textos de pies de fotos, etc. Esto se hace desde <b>Extensiones -> Gestor de Plugins -> SIGE - Simple Image Gallery Extended J1.7</b> seleccionando diferentes opciones a la derecha del formulario de configuración hasta dar con la que más os gusta.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-45206377818810635692011-11-08T19:19:00.003+00:002011-11-08T19:35:26.898+00:00Las plantillas de diseñoCambiar radicalmente el diseño y dotarle de una línea gráfica acorde a nuestra temática y gustos, es muy sencillo. Existen cientos de plantillas que podemos utilizar en nuestra página. Un portal donde podemos encontrarlas es <a href="http://www.joomla24.com/">Joomla24</a>. Hemos de tener en cuenta la versión que estamos utilizando, por lo que deberemos entrar a <a href="http://www.joomla24.com/Joomla_1.7_Templates/Joomla_1.7_Templates.html">Joomla 1.7 Templates</a>.<div><br /></div><div>Esta sección ofrece una demo o previo de la plantilla para confirmar su diseño. Una vez seleccionada la de interés pasamos a descargarla desde <b>Download</b> para obtener un fichero comprimido que guardaremos en nuestro equipo.</div><div><br /></div><div><b>Instalación:</b></div><div><br /></div><div>Tan simple como: <b>Extensiones -> Gestor de extensiones -> Subir Archivo de Paquete -> Seleccionar archivo (el que hemos descargado -> Subir e instalar</b>.</div><div><br /></div><div><b>Activación y configuración:</b></div><div><b><br /></b></div><div><b>Extensiones -> Gestor de Plantillas -> Clicamos la casilla de la nueva plantilla -> Establecer por defecto (arriba a la derecha)</b>.</div><div><br /></div><div><b>Problemas con los módulos:</b></div><div><br /></div><div>Es probable que al refrescar vuestra página para ver cómo ha quedado, hayan desaparecido la mayor parte (si no todos) de los módulos que habéis ido creando hasta ahora. Esto se debe a que cada plantilla utiliza diferentes nombres para las posiciones. Por ejemplo, es probable que la <b>position-7 </b>que utiliza la plantilla por defecto, se denomine en la nueva como <b>left</b>.</div><div><br /></div><div>Para conocer las nueva posiciones de una plantilla podéis escribir el código ?tp=1 al final de la URL de vuestro sitio. Por ejemplo: http://localhost/joomla1/?tp=1. Recordar que se deben dar permisos para activar esta función: <b>Extensiones -> Gestor de plantillas -> Opciones -> Vista previa de las posiciones de los módulos -> Activado</b>.</div><div><br /></div><div>Y desde <b>Extensiones -> Gestor de módulos</b> debéis re-colocar la posición de cada uno de ellos utilizando las nuevas denominaciones.</div><div><br /></div><div>Por ello es recomendable seleccionar ya vuestra plantilla definitiva para evitar este tipo de problemas conforme vayáis creando los módulos definitivos de vuestro proyecto web.</div><div><br /></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-76346800457696776952011-11-08T18:52:00.003+00:002011-11-08T19:18:47.622+00:00Extensiones, componentes, plugins y módulosA partir de ahora vamos ampliar la funcionalidad de nuestra página con componentes de terceros que iremos instalando y configurando en nuestro Joomla. Para un aprendiz de Joomla suelen ser confusos los conceptos del título de esta entrada y viene bien tener una idea de a qué se refieren:<div><ul><li><b>Módulo</b>. Ya hemos visto que un módulo es un <b>bloque </b>que podemos situar en diferentes posiciones que nos proporciona la plantilla, y controlamos los menús en los que queremos que sea visible.</li><li><b>Plugin</b>. Se trataría de una <b>pequeña mejora</b> de una funcionalidad más completa. Por ejemplo, el editor de artículos que emula a Word es un plugin.</li><li><b>Componente</b>. Se trata de una <b>funcionalidad mayor y completa</b> que se añade a las básicas de Joomla. Un foro sería un componente. También una tienda virtual, un componente de descargas, etc.</li><li><b>Extensiones</b>. Este concepto engloba a todos los anteriores. Los <b>módulos, plugins y componentes son extensiones de Joomla</b>, ya sea para proporcionar una pequeña nueva funcionalidad, como para ser un componente. Incluso las plantillas de diseño serían una extensión en el vocabulario de Joomla.</li></ul><div><br /></div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-71329806482172398482011-11-08T18:41:00.004+00:002011-11-08T18:50:02.005+00:00Componente de gestión de enlaces websEste componente ofrece la posibilidad de gestionar la típica sección Enlaces amigos o Links de interés donde listamos páginas que el usuario puede enlazar desde nuestra página.<div><br /></div><div>En Componentes -> Enlaces Web creamos al menos una categoría donde clasificaremos nuestros enlaces. Un enlaces es básicamente un Título legible para el usuario y un link o enlace al que se le dirigirá al pulsarlo.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>La visualización de Enlaces se lleva a cabo desde la sección de menús: <b>Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Enlaces Web</b> desde donde creamos un elemento de menú a:</div><div><ul><li>Todas las categorías de la sección de enlaces</li><li>Los enlaces de una categoría</li><li>Un enlace individual</li></ul><div>Ver como ejemplo la sección de <a href="http://www.segundafamilia.com/index.php?option=com_weblinks&view=categories&Itemid=48">Enlaces de interés de Segunda Familia</a>.</div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-3877897132636610082011-11-08T17:57:00.003+00:002011-11-08T18:41:12.393+00:00Noticias externas o feedsEn la página de Segunda Familia que seguimos como referencia de portal Joomla hay configurada una sección alimentada con contenido externo, denominada <a href="http://www.segundafamilia.com/index.php?option=com_newsfeeds&view=category&id=50&Itemid=103">Servidor de Noticias</a>. Es posible extraer contenidos de otros portales, filtrarlos por palabras clave según nuestro interés y visualizarlo en nuestra propia página. Esto es posible gracias a la tecnología denominada RSS (<a href="http://es.wikipedia.org/wiki/RSS">ver referencia en la Wikipedia</a>).<div><br /></div><div>La mejor manera de entenderlo es configurarlo en nuestra página. Accedemos a <b>Componentes -> Noticias externas</b> y creamos una categoría denominada, por ejemplo, <b>Navarra </b>(<b>Noticias -> Categorías -> Nuevo -> Título: Navarra -> Guardar y Cerrar</b>).</div><div><br /></div><div>Si entramos a crear una Noticia externa (<b>Noticias externas -> Nuevo</b>), vemos que el campo Enlace es obligatorio. ¿Cómo conseguimos este dato? Vamos por ejemplo al portal del <a href="http://www.noticiasdenavarra.com/">Diario de Noticias</a> y localizamos el icono correspondiente al RSS que ofrecen la mayoría de portales (parte superior derecha) y lo pulsamos. Vemos un listado de secciones donde pulsaremos Navarra. Copiamos desde la barra de direcciones la URL o dirección de esta página y la copiamos en nuestra Joomla.</div><div><br /></div><div><a href="http://www.diariodenavarra.es/">Diario de Navarra</a> también ofrece este servicio, pero no lo categoriza. El icono que nos ofrece la URL lo encontraréis también en la parte superior derecha.</div><div><br /></div><div><b>Visualización:</b></div><div><br /></div><div>Para publicar o visualizar nuestra sección de noticias externas se debe crear un nuevo elemento de menú: <b>Menús -> Menú Principal -> Nuevo -> Tipo Elemento Menú -> Noticias externas</b> y probáis el resultado enlazándolo a la <b>Categoría o a una noticia individual</b>.</div><div><br /></div><div>Podéis alimentar esta sección con feeds de cualquier gran portal de noticias, localizando el icono RSS.</div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-63569248385666955252011-10-25T17:33:00.003+01:002011-10-25T17:48:35.808+01:00Componente de Contactos y Formulario de ContactoOtro componente disponible en una instalación básica de Joomla es el componente de Contactos (Componentes -> Contactos). Su principal utilidad es la definición de la dirección o ubicación ya sea de la única oficina de la empresa/asociación/persona gestora de la web, o de todas las direcciones de interés de una empresa mayor (distintas oficinas, delegaciones, departamentos, etc.)<div><br /></div><div>Antes de proceder a crear un contacto, se deben organizar en Categorías para los que el campo más importante es el Título, al igual de en el caso de los artículos y banners.</div><div><br /></div><div>Desde la pestaña de Contactos pasaríamos entonces a crear los Contactos. Los campos más importantes son:</div><div><ul><li>Nombre</li><li>Categoría en la que se desea organizar dicho contacto</li><li>En la columna derecha, en la pestaña <b>Detalles Contacto</b> indicamos información como: email, dirección, ciudad, provincia, código postal, teléfono, sitio web, etc.</li><li>Y en la pestaña Formulario de contacto, confirmamos que el campo <b>Mostrar Formulario de Contacto</b> está com <b>Mostrar</b>.</li></ul><div><b>VISUALIZACIÓN:</b></div></div><div><br /></div><div>Iríamos a <b>Menús -> Menú principal -> nuevo -> Tipo Elemento Menú -> Contactos</b>, y probamos todos ellos:</div><div><ul><li>Lista todas las categorías de Contacto</li><li>Lista de Contactos en una Categoría</li><li>Contacto único</li><li>Contactos Destacados</li></ul><div>Es algo muy práctico el hecho de que Joomla nos muestre un formulario en cada página de contacto.</div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-82560500664716196312011-10-25T17:14:00.003+01:002011-10-25T17:31:03.549+01:00Banners o anuncios publicitariosUn banner es un espacio de una página web, generalmente una imagen animada en formato GIF o una animación en FLASH, que se dedica a mostrar publicidad y que enlaza con el portal donde se ofrece el concepto publicitado.<br /><br />Portales con muchas visitas ofrecen espacios para publicidad de sus clientes y el formato de venta suele ser:<br /><div><ul><li>Venta de un espacio de la página que mostraría en determinadas secciones</li><li>Venta de un porcentaje determinado de apariciones</li><li>Venta de un número de veces determinado que se le muestra el anuncio en la página</li><li>Venta de un número determinado de clics que hagan los usuarios interesados</li></ul>Todas estas ideas se pueden gestionar con el Componente Banners de Joomla (Componente -> Banners).</div><div><br /></div><div>Desde esta sección definimos primero una serie de categorías para clasificar nuestros anuncios (por ejemplo, electrónica, libros, aplicaciones, etc). Observaréis que estas categorías funcionan de una manera muy similar a las categorías de artículos. El campo más importante, y único obligatorio es el nombre de la Categoría.</div><div><br /></div><div>En un segundo paso necesitamos definir los clientes que hayan solicitado un banner. Los campos obligatorios en este caso, son 3: Nombre, Contacto e Email.</div><div><br /></div><div>Finalemente podemos crear anuncios desde la pestaña Banners indicando la siguiente información:</div><div><ol><li>Nombre o título</li><li>Categoría a la que pertenece</li><li>Imagen del anuncio</li><li>URL a la que se redirigirá al usuario al pulsarla</li><li>Y Cliente, desde la columna derecha</li></ol><div>Estos serían los campos básicos. Observaréis que hay más, pero los podéis investigar y probar por vuestra cuenta.</div></div><div><br /></div><div><b>VISUALIZACIÓN:</b></div><div><br /></div><div>Iríamos a Extensiones -> Gestor de módulos -> Nuevo -> Anuncio-Banners. Indicaríamos los parámetros básicos de un módulo (Título, posición, menús en los que se visualizaría,...) y en la columna derecha podemos configurar:</div><div><ol><li>Si queremos ver un anuncio concreto</li><li>Si queremos ver los anuncios de una categoría alternativamente o todos a la vez</li><li>Si queremos ver los anuncios de un cliente en concreto</li><li>Textos que podemos situar antes y después del anuncio</li></ol><div><br /></div></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-69831602683359826822011-10-18T17:37:00.003+01:002011-10-18T17:46:32.047+01:00Más módulosUna vez familiarizados con el concepto de módulo, vamos practicar con los que vienen por defecto en Joomla. Al crear un módulo (<b>Extensiones -> Gestor de módulos -> Nuevo</b>) vamos a ir comprobando el funcionamiento de los más interesantes, que serían:<div><ol><li>Buscar. Inserta un buscador del sitio. Muy práctico para los usuarios.</li><li>Categoría artículos</li><li>Contenido más leído</li><li>Estadísticas</li><li>Personalizar HTML. Ver entradas anteriores.</li><li>Quién está en línea</li><li>Ruta</li><li>Últimas noticias</li></ol><div>En este vídeo insertan y configuran varios módulos:</div></div><br /><iframe width="400" height="250" src="http://www.youtube.com/embed/ZJAkU-zUPSo" frameborder="0" allowfullscreen></iframe>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-68260005445932156072011-10-18T17:30:00.002+01:002011-10-18T17:37:22.780+01:00Las posiciones para colocar módulosLa verdad que las posiciones para colocar los módulos de la plantilla por defecto de Joomla no son nada intuitivas. Existe un pequeño truco muy práctico que permite localizar visualmente las posiciones de una web.<div><ol><li>Primero se debe dar permiso a Joomla para lo visualice. Esto se hace una única vez: <b>Extensiones -> Gestor de plantillas -> Opciones -> Vista previa de las posiciones de los módulos -> Activado</b>.</li><li>Si ahora escribís los caracters <b>?tp=1</b> al final de la url de vuestra página en el navegador, se muestran los nombres y situación de las posiciones para colocar módulos. Por ejemplo: <b>http://localhost/joomla1/?tp=1</b></li></ol></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-15195037156042849282011-10-18T17:07:00.002+01:002011-10-18T17:26:12.011+01:00Los módulos o bloques en JoomlaSi nos fijamos en la página de la ONG <a href="http://www.segundafamilia.com">Segunda Familia</a>, observamos que tanto en la columna de la izquierda, como en la derecha, incluso en el pie, hay una gran variedad de bloques con información u otro tipo de funcionalidades. Vemos un acceso restringido, un bloque de últimas noticias, una encuesta, banners, un pequeño calendario de eventos, etc. Este concepto de bloque que se visualiza, no en el centro del contenido, sino en posiciones secundarias, se denomina <b>Módulo</b>.<div><br /></div><div>Vamos a crear un bloque o módulo del tipo más sencillo para familiarizarnos con este término. Pulsamos <b>Extensiones -> Gestor de módulos -> Nuevo</b>. Surge una ventana emergente con una gran variedad de funcionalidades. Vamos a seleccionar <b>Personalizar HTML</b> para insertar un texto libre.</div><div><br /></div><div>Aparece un editor similar al de los artículos, pero debemos tener en cuenta que la información que insertemos se va a ver como un bloque más reducido. Los campos más importantes serían:</div><div><ol><li>El <b>Título </b>del módulo</li><li>El texto de edición libre <b>Salida personalizada</b>. Podemos escribir algo llamativo como ¡CONOCE NUESTROS PRODUCTOS¡ con hipervínculo al correspondiente menú para intentar dirigir la atención del usuario a nuestras secciones más importantes.</li><li>En el campo <b>Posición </b>indicamos dónde queremos visualizar este módulo. Estas posiciones van a depender de la plantilla de diseño que tengamos activada. En el caso de la plantilla por defecto de Joomla, la columna izquierda es la posición <b>position-7</b>.</li><li>Y por último, podemos seleccionar en qué menús queremos hacer visible este bloque. En <b>Menú Asignado</b> (en la parte inferior) podemos seleccionar en qué páginas de nuestro sitio se visualizará el módulo.</li></ol></div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-75801703896354123232011-10-18T16:56:00.004+01:002011-10-25T17:31:23.441+01:00Secciones en formato blogEn entradas anteriores hemos creado elementos de menú enlazados a un solo artículo. Son muy útiles secciones con un formato tipo blog donde se relaciona un elemento de menú, no a un único artículo, sino a varios que se muestran como un listado. Este formato puede valer para realizar fácilmente tanto un blog, como una sección de Noticias, Proyectos realizados, etc.<br /><br />La idea es muy sencilla en Joomla:<br /><ol><li>Se parte de una categoría, por ejemplo Noticias, donde clasificamos una serie de artículos con la información más novedosa (ver entrada anterior).</li><li>Creamos un nuevo menú de la siguiente manera: <b>Menús -> Menú principal -> Nuevo -> Tipo Elemento Menú -> Categoría Blog</b>, lo titulamos Noticias, y en la columna derecha <b>Elegir una Categoría</b> seleccionamos la categoría Noticias.</li></ol><div>Si refrescamos la página, veremos que este menú muestra un listado de todos los artículos de dicho grupo.</div><div><br /></div><div>Un detalle muy simple pero muy práctico es diferenciar en un artículo el texto resumen que aparece en el listado con la información completa. Esto se hace desde el propio editor del artículo, pulsando el botón 'Leer más' en la parte inferior del editor.</div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-30378846720094794862011-10-18T16:41:00.004+01:002011-11-10T19:14:38.970+00:00La organización de artículos en CategoríasEs posible que nos encontremos la necesidad de organizar de alguna manera los artículos que vamos generando en nuestro portal. Joomla permite agrupar y organizar artículos mediante el concepto de Categorías y funcionan como si se tratara de carpetas.<br /><br />Así podemos crear, por ejemplo, una categoría 'Empresa' con los artículos que hablan de la misma (Historia de la empresa, Filosofía, Ubicación, Quiénes somos, etc); una segunda categoría 'Productos' englobaría los artículos que muestran información de los mismos; y una tercera por ejemplo 'Noticias y Novedades' con la información más dinámica del sitio.<br /><br />Las Categorías se crean y gestionan desde Contenido -> Gestor de categorías. El campo más importante, y el único obligatorio, a la hora de crear una categoría es el Título.<br /><br />Un artículo se incluiría en una Categoría determinada desde el editor de artículos (Contenido -> Gestor de artículos -> Clic en un artículo), desde el selector 'Categoría' que aparece bajo el título.<br /><br /><iframe width="400" height="250" src="http://www.youtube.com/embed/jXeQw1VNzmI" frameborder="0" allowfullscreen=""></iframe>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-3198842867623682712011-09-29T17:44:00.008+01:002011-11-10T19:14:53.041+00:00Los menúsUna idea que debemos interiorizar es que nos artículos que vamos generando en el backend, no van a ser visibles en la parte pública hasta que creemos en menú de navegación correspondiente que lo muestre al usuario.<div><br /></div><div>Supongamos que hemos generado varios artículos en las pruebas anteriores. Vamos ahora a Menús -> Menú principal -> Nuevo (esquina superior derecha) y configuramos los siguientes campos:</div><div><ol><li><b>Tipo elemento menú: Artículo simple</b>. Queremos que al pulsar este menú nos habra un artículo concreto.</li><li><b>Título menú</b></li><li>Y a la derecha en <b>Seleccione el Artículo</b>, elegimos el artículo.</li><li><b>Guardar y cerrar</b></li></ol><div>Si refrescamos la pestaña donde visualizamos la parte pública, veremos el resultado.</div></div><div><br /></div><div>Hay infinidad de vídeos explicativos con estos pasos. Por ejemplo:</div><div><br /></div><br /><iframe width="320" height="315" src="http://www.youtube.com/embed/0memR1j_qlI" frameborder="0" allowfullscreen=""></iframe>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0tag:blogger.com,1999:blog-5234280307711971106.post-38994591312917798252011-09-29T08:53:00.005+01:002011-10-25T17:31:43.108+01:00Inserción de imágenes, vídeos y documentos en un artículo<b>IMÁGENES:</b><div><b><br /></b></div><div>Para insertar una imagen desde nuestro equipo cuando estamos editando un artículo, pulsamos el botón Imagen en la parte inferior del campo de edición de texto. Se superpone una pantalla que nos permite dos cosas:</div><div><ol><li>Desde la sección Subir archivos en la parte inferior, podemos seleccionar una imagen de nuestro equipo y subirla al servidor web.</li><li>Una vez completada la subida, veremos la imagen en las miniaturas que se muestran desde donde la seleccionaremos y pulsaremos Insertar para colocarla en el artículo.</li></ol><div>Nota: Recordad que se debe Grabar o Aplicar el artículo para guardar la imagen definitivamente.</div></div><div><br /></div><div><b>VÍDEOS:</b></div><div><br /></div><div>Las plataformas de vídeos más utilizadas son Youtube y Vimeo. En ambos casos ofrecen el código que se debe insertar en la página para visualizarlos integrados en la propia web, En el caso de Youtube, cuando se visualiza un vídeo se debe pulsar <b>Compartir </b>en la parte inferior del vídeo, y después <b>Insertar</b>. Copiamos el código que aparece y vamos a nuestra página. Entramos a editar el artículo deseado, pulsamos el botón HTML en el editor y pegamos el código en la posición deseada. Seguidamente damos <b>Actualizar </b>y grabamos el artículo.</div><div><br /></div><div>En el caso de Vimeo, al visualizar el vídeo pulsamos <b>Embed </b>para que nos genere el código a insertar en nuestro artículo.</div><div><br /></div><div><b>DOCUMENTOS:</b></div><div><br /></div><div>Para insertar un documento, primero debemos subir el documento desde el Gestor multimedia y después enlazarlo como hipervínculo en nuestro artículo. Así pulsamos Contenido -> Gestor multimedia para acceder a esa especia de explorador de archivos de nuestro servidor. Desde aquí se pueden crear carpetas para organizar nuestra documentación y podemos subir todo tipo de archivos.</div><div><br /></div><div>Podemos por ejemplo, crear una carpeta que se denomina <b>docs</b>. Entramos a dicha carpeta y subimos (desde el botón inferior) un fichero de nuestro equipo. una vez subido, a este fichero le corresponde una URL o dirección de internet que tiene la siguiente forma:</div><div><ol><li>La dirección de nuestro dominio (en este caso localhost): <b>http://localhost/</b></li><li>El directorio que Joomla nos deja gestionar: <b>/images/</b></li><li>La ruta de carpeta + nombre de nuestro fichero, por ejemplo: <b>/docs/nombrefichero.pdf</b> (no olvidar la extensión</li><li>Para dar lugar a: <b>http://localhost</b><b>/images/</b><b>docs/nombrefichero.pdf</b></li></ol><div>Podéis probar escribir esta URL en nua pestaña del navegador. Se debería abrir el documento.</div></div><div><br /></div><div>Por último entramos al artículo desde donde queréis que se pueda descargar este documento y escribís el texto para el usuario. por ejemplo:</div><div><br /></div><div>Puede descargar el documento pulsando aquí (PDF, 2.5MB)</div><div><br /></div><div>Seleccionáis el texto, pulsáis el botón de hipervínculo (la cadenita en la segunda fila de botones del editor) y en <b>URL del hipervínculo</b> pegáis la dirección anterior del documento. <b>Insertar y Guardar</b>.</div>Markohttp://www.blogger.com/profile/07495101373353519404noreply@blogger.com0