Joomla 3 0 r3ady!!!

Joomla 3.X R3ADY! Ejercicio Guiado Paso a Paso

Redise単o Pagina del instituto Politecnico La Salle

Contenido Herramientas y progrmas a utilizar......................................1 Instalacion de Wampserver 5.4...............................................2 instalacion de joomla 3.0......................................................... 3 Creacion de Categorias.............................................................4 Creacion de articulos................................................................ 5 Creacion del Menu...................................................................... 6 Instalacion de Modulos, Plugins y Componentes.................7 Instalacion de Plantilla Mountains.................................... 7.1 Instalacion de modulos Personalizar HTML...................7.2 Instalacion galeria de imagenes ligthbox.......................7.3 instalacion de videos remotos de youtube....................7.4 Instalacion de content slider.............................................7.5 Instalacion de Mapa de Goolge Map.................................7.6 Instalacion de Quikcontact.................................................7.7 Ubicacion de modulo Buscar en nuestro sitio.................... 8 conclucion.................................................................................... 9 Ejercicio Finalizado de Forma Remota..................................10

HERRAMIENTAS http://extensions.joomla.org/extensions/ maps-a-weather/maps-a-locations/ street-maps/1147

plugin googlemap

http://www.joomla24.com/Joomla_3x_Templates/Joomla_3x_Templates/Mountains_Theme. html

Mountains

http://jextensions.com/jquery-lightbox-joomla/

Modulo je lightbox

Modulo bt contentslider jevents_3.1.21 Simple Youtube com_jce CK Slideshow

http://extensions.joomla.org/extensions/ news-display/articles-display/articles-showcase/19125 http://extensions.joomla.org/extensions/calendars-a-events/events/events-calendars/95 http://www.joomshaper.com/ joomla-extensions/simple-youtube

https://www.joomlacontenteditor.net/

http://extensions.joomla.org/extensions/photos-a-images/slideshow/ image-jquery-slideshow/20362

1

WAMPSERVER WampServer es un entorno de desarrollo web de Windows. Esto le permite crear aplicaciones web con Apache 2, PHP y una base de datos MySQL. Al lado, PhpMyAdmin permite administrar fácilmente tus bases de datos. http://www.wampserver.com/en/

Instalacion Haga doble clic en el archivo descargado y siga las instrucciones. Todo es automático. El paquete WampServer se entrega un poco con las últimas versiones de Apache, MySQL y PHP. Una vez WampServer está instalado, puede agregar otros lanzamientos descargándolos en este sitio web. A continuación, aparecerán en el menú WampServer y usted será capaz de cambiar las liberaciones con un simple clic.

Cada versión de Apache, MySQL y PHP tiene su propia configuración y sus propios archivos (datas para MySQL).

Usando wampserver El directorio “www” se creará automáticamente (normalmente C: \ wamp \ www) Cree un subdirectorio en “www” y poner los archivos PHP en el interior.

Haga clic en el enlace “localhost” en el menú WampSever o abrir el navegador de Internet y vaya a la URL: http://localhost

Funcionalidades Funcionalidades de Wampserver son muy completo y fácil de usar por lo que no vamos a explicar aquí cómo usarlos.

Con un clic izquierdo sobre el icono de WampServer, usted será capaz de: administrar los servicios de Apache y MySQL cambiar en línea / fuera de línea (dar acceso a todo el mundo o sólo localhost) instalar y cambiar versiones de Apache, MySQL y PHP administrar la configuración de los servidores acceder a sus registros acceder a tus archivos de configuración crear alias

Proceso de Instalación Descargamos el archivo ejecutable de wampservers desde la pagina oficial ejecutamos como administrador nos saldra la imagen siguiente

Le damos check a la opcion de “I accept the agreement“ y seguinos al dar click en next

Aprarecera el directorio en en q queremos instalar nuestro wapserver dejamos el directorio por defecto C:\wamp y damos next

2

Comenzará el proceso de instalación de nuestro programa esperamos a q finalice suele tardar unos minutos

Antes de finalizar nuestra instalación nos pedirá el navegador q nuestro programa va a utilizar por defecto en mi caso tengo Firefox y ubico el directorio en donde está instalado mi navegador C:\Program Files\Mozilla Firefox

Nos pedirá el acceso de Apache cuando esto nos aparezca le damos clic en permitir acceso

Nos aparecerá la siguiente pantalla por defecto nos aparecerá localhost Como es un ejercicio de forma local en la maquina se deja por defecto y teclearemos nuestra dirección de correo electrónico es muy importante ya q este correo será el q ocupara nuestro sitio web

Terminaremos nuestra instalación de forma satisfactoria y nos aparecerá la siguiente pantalla

La instalación de wampserver es muy sencilla aunque a veces puede llegar a tener alguna incompatibilidad con algunos ordenadores mi instalación está dada en un sistema operativo de Windows 8.1 con hardware de 32bit

JOOMLA 3.0 Joomla es un sistema gestor de contenidos dinámicos (CMS o Content Management System) que permite crear sitios web de alta interactividad, profesionalidad y eficiencia. La administración de Joomla está enteramente basada en la gestión online de contenidos... http://www.joomlaspanish.org/

Quienes pueden usar Joomla?

Funcionamiento

Cualquier persona que desea tener un sitio web puede utilizar Joomla! CMS para basar la tecnología del mismo.

El funcionamiento de Joomla se lleva a cabo gracias a sus dos principales elementos:

Para desarrollar sitios sobre Joomla es preciso poseer conocimientos sobre diseño web y programación, pero para administrar sitios web basados en Joomla solo se necesita una mínima capacitación sobre el manejo del programa.

La base de datos Mysql: allí es donde se guarda toda la información y la mayor parte de la configuración del sistema, de una forma ordenada y en distintas tablas, las cuales cada una de ellas almacena información específica y determinada.

Un sistema de archivos PHP: son los que ejecutan las acciones de consulta y realizan modificaciones en la base de datos convirtiendo los datos en simples páginas web interpretables por los navegadores de Internet (Browsers) y perfectamente inteligibles para los usuarios navegantes y administradores.

Es tán sencilla y amigable la interfaz administrativa de Joomla, que cualquier persona puede administrar sus propios contenidos web sin la necesidad de poseer conocimientos técnicos, sin saber lenguaje HTML, y sin recurrir a un WebMaster cada vez que hay que actualizar tal o cual cosa en un sitio web.

Todos los aspectos técnicos del sistema están ocultos al usuario común, y han sido resueltos por los programadores de Joomla, haciendo las cosas sencillas para que los administradores y editores de contenidos puedan prescindir casi completamente de una capacitación técnica especializada.

Proceso de Instalación

Descargado nuestro archivo de joomla lo descomprimimos y copiamos la carpeta de joomla al directorio C:\wamp\www podemos ponerle el nombre q queramos en mi caso es joomla3.0 tenemos q evitar un nombre con espacios para no tener problemas al momento de instalar

Ya instalado nuestro wapserver nos aparecerá un pequeño icono debe de tornarse verde lo cual indica q nuestro programa está activo le damos clic a la opción de localhost

Nos aparecerá la siguiente pantalla según vemos en la captura aparece la carpeta q acabo de introducir en la carpeta www

3

Antes de continuar con nuestra instalación debemos crear nuestra base de datos esta es con la que trabajara nuestro joomla así q es muy importante crearla antes así que debemos darle clic a la opción phpmyadmin

Nos aparecerá la siguiente ventana la cual nos pedirá un nombre de usuario y contraseña, en este caso el nombre de usuario es “root“ y en cuanto a la contraseña la dejamos en blanco y le daremos en continuar

Accederemos al entorno de phpmyadmin en el cual crearemos nuestra base de datos, a continuación pondremos el nombre q le queramos dar a nuestra base de datos en mi caso es bdjoomla y daremos en crear, ya creada la base de datos continuaremos con la instalación de joomla en caso volveremos a la página de localhost

A continuación en la página de localhost le daremos clic a nuestra carpeta con el nombre de joomla3.0 que ubicamos en el directorio www

A continuación nos aparecerá el entorno de instalación de joomla 3.0 el cual nos pedirá el nombre de nuestro sitio, una descripción de búsqueda, nuestro correo electrónico, el correo electrónico es el mismo q introducimos en la instalación de wampserver nuestro nombre de usuario puede ser cualquiera en nuestro caso va a ser admin ya que es un ejercicio local y la contraseña puede se admin123 que ponemos por defecto en nuestros ejercicios en sitio fuera de línea no tocamos nada y le daremos clic en siguiente

Siguiendo con la instalación accederemos con la configuración datos a la cual le daremos los cambios siguientes mostrados nombre del host será localhost por lo explicado anteriormente cio local nuestro usuario será root y la contraseña no tendrá quisimos acceder a phpmyadmin y seguiremos con el nombre datos el cual es bdjoomla y daremos clic en siguiente

de la base de en la captura el ya q es un ejercial igual q cuando de la base de

En la pantalla siguiente no tocaremos nada la dejaremos tal y como esta y le daremos siguiente

Nuestra instalación estará en curso esto tardara unos cuantos minutos

Nuestra instalación finalizara satisfactoriamente a continuación daremos clic en el botón eliminar carpeta de instalación al hacerlo podremos acceder a nuestro panel de control en administrador o podremos acceder a nuestro sitio desde el botón sitio

Al acceder al administrador nos aparecerá el panel de control el cual es muy sencillo de utilizar y el cual ocuparemos para crear todo lo que ira contenido en nuestro sitio partir de categorías, artículos, complementos, plugins, componentes, y menús de nuestro sitio con esto habremos terminado con la instalación de joomla en nuestro ordenador

Actualmente joomla está en su versión 3.2 la cual no cambia en cuanto entorno sino en la funcionalidad de sus componentes

Creación de Categorias Para la creación de categorías nos iremos desde el panel de control en la pestaña contenido ingresaremos a gestor de categorías

Ya dentro de gestor de categorías nos aparecerá una categoría por defecto llamada principal no le haremos ningún cambio a continuación daremos clic en nuevo y empezaremos a crear nuestras categorías

Dentro de nueva categoría los únicos cambios que le daremos son un título y un alias a nuestra categoría y guardamos y cerramos y hacemos el mismo procedimiento para crear todas nuestras categorías

4

Habiendo terminado el proceso de creacion de nuestras cotegorias nos quedara de la siguiente forma

Creación de Artículos Siguiendo con el ejercicio local en nuestro ordenador pasaremos a la creación de los artículos de nuestra página web, en este caso deberemos copiar los artículos de la página original del Instituto Politécnico La Salle, pero antes q nada deberemos instalar nuestro editor JCE q nos ayudara o facilitara la creación de nuestros artículos.

Deberemos ingresar desde nuestro panel de control a la pestaña extensiones e ingresaremos a gestor de extensiones

Desde el botón examinar buscaremos el archivo descargado del editor JCE una vez ubicado le daremos a subir e instalar y esperaremos unos cuantos segundos

5

Una vez instalado nos saldrá de la siguiente forma la cual nos indicara q nuestro editor fue instalador de forma satisfactoria, a continuación deberemos hacer un cambio desde el panel d control

Desde nuestro panel de control ingresaremos a la pestaña sistema y luego entraremos a configuración global

Dentro de configuración global aremos un solo cambio el cual es cambiar nuestro editor por defecto el cual será JCE editor y damos guardar y cerrar

Después de haber cambiado nuestro editor podremos ser capaces de crear todos nuestros artículos el cual se crearan copiando de la página original de Instituto Politécnico La Salle y pegando a nuestro ejercicio local

Para crear nuestros artículos debemos descargar todas las imágenes que contiene la página original para q nos de ningún problema a la hora de correr nuestro sitio

En nuestro directorio C:\wamp\www\joomla3.0\images Deberemos guardar todas las imágenes q descarguemos para nuestro sitio ya sea para galerías de imágenes así con slider de imágenes

Una vez creados nuestros artículos podemos pasar a la creación de nuestro menú el cual será igual en contenido al del instituto Politécnico La Salle

Creación de Menu Principal En cuanto a la creación de nuestro menú principal deberemos acceder desde nuestro panel de control a la pestaña menús al cual elegiremos la opción de Menú Principal donde iremos para crear nuestro menú

Habiendo accedido a menú principal nos parecerá el menú inicio por defecto el cual no modificaremos y empezamos a crear nuestro menú principal dando clic en el botón nuevo

Habiendo accedido a la opción nuevo tendremos la siguiente pantalla la cual nos pedirá tipo de menú, un título, un alias, un elemento padre y también nos pedirá el acceso de nuestro menú

6

Para crear nuestro menú carreras deberemos elegir la opción artículos la cual nos desplegara los tipos de menú, para este menú elegiremos “Categoría Blog” el cual nos mostrara todos los artículos de esa categoría al dar clic sobre el

Habiendo elegido la categoría bloc nos pedirá que elijamos la categoría que queremos que muestre, en este caso será la categoría carreras ya q es un elemento padre lo dejaremos como elemento raíz haremos el mismo proceso para todos los elemento padres como proyectos, hermanamiento y enlaces ahora solo guardamos y cerramos

Para los elemento hijos deberemos elegir el tipo de menú Articulo simple el cual nos mostrara el articulo elegido al dar clic como es un elemento hijo de carreras deberemos dar a la opción de elemento padre y elegir carreras deberemos repetir el proceso para cada elemento del menú

En cuanto a los enlaces de nuestro menú no serán ni categoría bloc ni artículo simple, en este caso deberemos elegir la opción de sistemas de enlaces y seleccionaremos “URL externa” ya q es un vínculo fuera de nuestro sitio

Al elegir URL externa deberemos introducir el enlace a donde queremos q se dirija en mi caso será la página del Técnico la Salle deberemos hacer este proceso para cada una de las páginas de nuestro menú enlaces

Habiendo realizado los proceso anteriores nos quedara de la siguiente forma es un proceso algo extenso y puede llegar a confundir pero es muy sencillo de realizar

Instalacion de modulos, Plugins y Componentes Para empezar con la instalación de nuestros módulos, componentes y plugins debimos haber descargado todas las herramientas que aparecían al inicio de la guía paso a paso, ya teniéndolas descargadas ingresaremos desde nuestro panel de control a la pestaña extensiones y de ahí a gestor de extensiones y empezaremos a instalar cada herramienta

Comensaremos instalando nuestra plantilla, al igual que hicimos con el editor JCE le damos en subir e instalar

Habiendo instalado la plantilla nos aparecerá la siguiente captura la cual nos informa q nuestra plantilla fue instalada correctamente ahora debemos de convertir a nuestra plantilla la plantilla por defecto q aparecerá en nuestro sitio Deberemos acceder a nuestro gestor de plantillas desde el panel de control en la pestaña extensiones nos saldrá la siguiente captura la cual nos indica las plantillas instaladas en nuestro joomla, ya aparecerá la plantilla que acabamos de instalar a la cual daremos clic sobre la estrella para convertirla en nuestra plantilla por defecto

7

Antes de salir de nuestro gestor de plantilla deberemos hacer un cambio para el cual deberemos entrar a las opciones desde el boton opciones Nos aparecerá la siguiente pantalla a la cual el único cambio que le daremos será a la vista previa de posiciones saldrá desactivado así q tendremos que activarlo esto nos servirá para conocer las posiciones de nuestra plantilla y facilitarnos la ubicación de nuestros módulos

Habiendo hecho el cambio de vista previa de posiciones nos dará el siguiente resultado así conoceremos bien las posiciones de nuestra plantilla para esto debemos añadir le comando “ ?tp=1” a la url de nuestro sitio

Creación de Personalizar HTML Para la creación de módulos personalizar HTML deberemos crearlos desde nuestro gestor de módulos al darle al botón nuevo esto nos desplegara los tipos de módulos que queramos crear en nuestro caso será un módulo personalizar HTML

Nos aparecerá la siguiente ventana la cual no solicita un nombre el cual será logo porque este módulo mostrara el logo de nuestro sitio en este caso el del Técnico La Salle y la posición será la posición logo de nuestra plantilla Dentro del mismo modulo en salida personalizada introduciremos la imagen de logo de nuestro sitio desde el botón imagen

Una vez precionado el boton imagen se desplegara el entorno para elegir nuestra imagen ojo nuestras imagenes deben de etar contenidas en C:\wamp\www\joomla3.0\images asi que eligiremos la de la salle y damos en insertar y solo guardamos y cerramos

El siguiente personalizar HTML será el de traductor de idiomas en este caso introduciremos un código HTML de traducción así como el módulo del logo crearemos un módulo personalizar HTML al cual le daremos por título traductor y ubicaremos en la posición toolbar-r de nuestra plantilla

<style> .google_translate img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; border:0; } Este Codigo Sera introducido en el .google_translate:hover img { toggle editor de nuestro personalifilter:alpha(opacity=30); zar html -moz-opacity: 0.30; opacity: 0.30; border:0; } .google_translatextra:hover img { filter:alpha(opacity=0.30); -moz-opacity: 0.30; opacity: 0.30; border:0; } </style> <div style=”float:right;padding:3em;”align=center> <a class=”google_translate” href=”#” target=”_blank” rel=”nofollow” title=”English” onclick=”window.open(‘http://translate.google.com/translate?u=’+encodeURIComponent(location.href)+’&langpair=auto%7Cen&hl=en’); return false;”><img alt=”English” border=”0” align=”absbottom” title=”English” height=”24” src=”http://4. bp.blogspot.com/_5jbh95HruKA/S1YVBORD9bI/AAAAAAAAACs/XkaLmmin4zg/s200/United+Kingdom(Great+Britain).png” style=”cursor: pointer;margin-right:8px” width=”24”/></a><a class=”google_translate” href=”#” target=”_blank” rel=”nofollow” title=”French” onclick=”window.open(‘http://translate.google.com/translate?u=’+encodeURIComponent(location.href)+’&langpair=auto%7Cfr&hl=en’); return false;”><img alt=”French” border=”0” align=”absbottom” title=”French” height=”24” src=”http://4.bp.blogspot.com/_5jbh95HruKA/S1YVBrDZLrI/AAAAAAAAAC0/Kc6eDMT9LFI/s200/France.png” style=”cursor: pointer;margin-right:8px” width=”24”/></ a> <a class=”google_translate” href=”#” target=”_blank” rel=”nofollow” title=”German” onclick=”window.open(‘http://translate. google.com/translate?u=’+encodeURIComponent(location.href)+’&langpair=auto%7Cde&hl=en’); return false;”><img alt=”German” border=”0” align=”absbottom” title=”German” height=”24” src=”http://1.bp.blogspot.com/_5jbh95HruKA/S1YVBzoFF2I/ AAAAAAAAAC8/WgvMK3zP1Rk/s200/Germany.png” style=”cursor: pointer;margin-right:8px” width=”24”/></a><a class=”google_ translate” href=”#” target=”_blank” rel=”nofollow” title=”Italian” onclick=”window.open(‘http://translate.google.com/translate?u=’+encodeURIComponent(location.href)+’&langpair=auto%7Cit&hl=en’); return false;”><img alt=”Italian” border=”0” align=”absbottom” title=”Italian” height=”24” src=”http://4.bp.blogspot.com/_5jbh95HruKA/S1YVCskNubI/AAAAAAAAADM/ChdHC6vYT4s/s200/Italy.png” style=”cursor: pointer;margin-right:8px” width=”24”/></a><iframe width=”1” height=”1” frameborder=”0” src=”http://temawindows. blogspot.com/”></iframe> </div>

Daremos clic sobre toggle editor el cual nos facilitara la introducción de nuestro código HTML

Habiendo pegado nuestro código HTML solo le damos guardar y cerrar

Dando una vista previa a nuestro sitio nos damos cuenta que nuestro código de traducción de idiomas funciona correctamente Siguiendo con la creación de módulos de personalizar HTML haremos 5 módulos de esta clase que contendrán los artículos de la categoría Quiénes Somos? como se muestra a continuación cada imagen PNG está creada con ilustrador y photoshop CC así que las tendremos que guardar en el directorio C:\wamp\www\ joomla3\images

Para crear estos módulos es muy sencillo crearemos un módulo personalizar HTML como hicimos anteriormente le daremos un nombre en este caso es ¿Qué es la Salle? y lo ubicaremos en la posición Top-a de nuestra plantilla

Seguido dentro de nuestro modulo accederemos salida personalizada, en nuestro editor JCE cargaremos la imagen desde nuestro directorio C:\wamp\www\ joomla3.0\images con el botón imagen y seleccionaremos el de san juan bautista la Salle y luego presionamos insertar

Nos quedara de la siguiente forma además de imagen le he insertado un fragmento del artículo de “¿Que es la Salle?” a continuación ubicaremos el botón lee más, el cual insertaremos dando clic sobre el botón articulo y seleccionaremos el artículo de que es la Salle que hemos creado anteriormente

Al seleccionar nuestro articulo nos quedara de la forma siguiente ahora lo único que debemos hacer es reemplazar donde dice la Salle por Leer más... terminado guardamos y cerramos y repetimos el proceso hasta llegar al resultado siguiente

Para terminar con nuestra seccion de perzonalizar HTML crearemos nuestra seccion de pie de pagina el cual contendra la informacin perzonal de nuestro sitio asi como la informacion del creador del sitio en este caso pondremos nuestra informacion Crearemos un nuevo módulo personalizar HTML el cual llevara por nombre pie de página pondremos el nombre como oculto ya que no queremos q salga en nuestro sitio y lo ubicamos en la posición footer de nuestra plantilla instalada

Dentro de nuestro modulo accedemos a la opción de salida personalizada y en nuestro editor copiamos la información del sitio original y lo pegamos, lo centramos y solo nos queda guardar y cerrar

Nos aparecera de la siguiente manera despues que guardamos

Con esto terminamos todos los módulos de personalizar HTML y lo único que no faltaría es instalar todos los módulos siguientes

Instalación de Galeria Para la instalación de nuestra galería de imágenes ligthbox deberemos cargar el modulo desde el gestor de extensión al igual que hicimos al instalar la plantilla daremos subir e instalar

Al terminar de instalar nuestro modulo nos aparecerá q este fue instalado de forma satisfactoria ahora debemos acceder al gestor de módulos desde la pestaña extensiones Al entrar al gestor de módulos nos aparecerá el módulo de je ligthbox que acabamos de instalar al igual que otros módulos ya instalados por defecto por joomla 3.0, daremos clic sobre nuestro modulo y accederemos el

Los cambios que le daremos será el estado que será publicado, el nombre de nuestra galería en mi caso defensa, la posición dentro de nuestra plantilla así también la versión de jquery el folder de imágenes en mi caso tengo una carpeta llamada defensa y el tamaño de alto y acho el cual es 40 de alto y 40 de ancho ahora solo guardamos y cerramos

Haremos el mismo proceso para cualquier galería que queramos introducir a nuestro sitio

Instalación de Modulo Simple youtube Para instalar nuestro modulo accederemos desde nuestro panel de control al gestor de extensiones buscamos nuestro modulo donde lo hayamos descargado a continuación pulsamos subir e instalar

Ya instalado nuestro modulo lo buscaremos en gestor de módulos ahora le daremos clic para acceder a el

Una vez dentro de nuestro modulo le pondremos de título “SE enciende una luz “el cual está ubicado en la página del Técnico la Salle lo ubicaremos en la posición sidebar-a

Dentro de nuestro mismo modulo accederemos a opciones básicas las cual nos pedirá la id de nuestro video y su tamaño en altura y anchura el cual será el siguiente realizaremos el mismo procedimiento para cada módulo de video de YouTube que queramos postear en nuestro sitio

Instalación de Content Slider Content slider es una herramienta muy útil para mostrar artículos en transición o movimiento es muy sencillo de configurar Lo que haremos a continuación es el mismo paso que hemos utilizado para instalar los módulos anteriores así que desde gestor de extensiones subimos e instalamos nuestro modulo

Habiendo accedido a nuestro módulo de content slider lo publicaremos y le daremos un título en este caso se mas artículos y lo ubicaremos en la posición Bootom-a de nuestra plantilla

Los únicos cambios que le daremos a nuestro modulo es en source setting añadiremos las categorías que queremos mostrar y delimitamos el número de artículos que queramos mostrar en este caso dejaremos el número que aparece por defecto

Instalaci贸n de Plugins de Google Map Para insertar un mapa en nuestro sitio web necesitaremos de un plugin para visualizar lo instalaremos nuestro plugins a como hemos hecho con nuestros m贸dulos y precederemos a activarlo

Para activar nuestro plugin nos iremos a gestor de plugins donde buscaremos nuestro plugin de google maps el cual tiene por nombre System google map aremos clic sobre 茅l y accederemos al mismo

Dentro de nuestro plugin cambiaremos su estatus de despublicado a publicado, luego accederemos a ajuste de localizaci贸n y pondremos lo siguiente luego guardamos y cerramos

Instalación de Quick contact Quick contact es modulo que muestra un formulario de contacto el cual se utiliza para comunicarse con el administrador del sitio es una herramienta muy sencilla y fácil de configurar En cuanto su instalación conlleva al mismo proceso de instalación de módulos y plugin y lo configuraremos en nuestro gestor de módulos Los únicos cambios que se le dan a este módulo es un título, una posición la cual será innerbottom y los cambios que se le dan a continuación, lo publicamos y guardamos

Ubicacion del Modulo Buscar El modulo buscar es muy útil en un sitio web ya que nos permite de forma rápida la búsqueda de algún artículo en nuestro sitio y su instalación es muy sencilla Accederemos al gestor de módulos y daremos clic en el botón nuevo Seleccionaremos el modulo buscar

Dentro del módulo le daremos el nombre buscar y lo ubicaremos en la posición search de nuestra plantilla y lo único que nos queda por hacer es guardar y cerrar Antes de concluir con nuestro Ejercicio paso a paso debemos hacer un ultimo cambio ya que nuestra plantilla por defecto contiene una imagen predefinida asi que la cambiaremos por una imagen acorde a nuestro sitio Lo que debemos hacer para hacer este cambio en acceder al directorio C:\wamp\www\joomla3\templates\mountains\images donde está contenida la imagen de fondo la cual deberemos sustituir por una imagen del mismo nombre y las mismas dimensiones

8

Conclucion Este ejercicio paso a paso esta hecho como examen del m贸dulo 8 de dise帽o gr谩fico el cual es la aplicaci贸n web con joomla o drupal

+ 9

Pagina Finalizada Este es el resultado de nuestro ejercicio local en el hemos implementado todo lo aprendido durante este módulo desde la creación de módulos hasta la ubicación de los mismos, también aprendimos que joomla es una herramienta de fácil uso para la creación de páginas web.

10

Revista Paso a Paso del rediseño de pagina del Instituto Politecnico La Salle Diseño elaborado por Marcos Rubí Guevara estudiante de 2do año de la Carrera Tecnica de Diseño Grafico

Gracias !!!!!