35
INTALACION DE JOOMLA 1. INSTALAR APPSERV a. Server : localhost b. Puerto: 8080 2. DESAMPAQUETAR JOOMLA, con la opción Extraer en Joomla, dentro de www a. Cambiar de nombre por Joomla dentro de www 3. En PHPAdmin crear base de datos bdejemplo 4. Desde internet explorer instalarlo http://localhost:8080/joomla CUANDO SE CREAR DENTRO DE WWW EL NOMBRE DE UN PROYECTO COMO CARPETA 1. DESAMPAQUETAR JOOMLA, con la opción Extraer en Joomla, dentro de www/Empresaseguridad a. Cambiar de nombre a Joomla por www/empresaseguridad 2. En PHPAdmin crear base de datos bdejemplo 3. Desde internet explorer instalarlo http://localhost:8080/empresaseguridad/ CUANDO SE CREAR DENTRO DE WWW EL NOMBRE DE UN PROYECTO COMO CARPETA 4. Crear la carpeta dentro de www Ejm. EmpresaSeguridad

Intalacion de joomla

Embed Size (px)

Citation preview

Page 1: Intalacion de joomla

INTALACION DE JOOMLA

1. INSTALAR APPSERVa. Server : localhostb. Puerto: 8080

2. DESAMPAQUETAR JOOMLA, con la opción Extraer en Joomla, dentro de www

a. Cambiar de nombre por Joomla dentro de www

3. En PHPAdmin crear base de datos bdejemplo

4. Desde internet explorer instalarlo http://localhost:8080/joomla

CUANDO SE CREAR DENTRO DE WWW EL NOMBRE DE UN PROYECTO COMO CARPETA

1. DESAMPAQUETAR JOOMLA, con la opción Extraer en Joomla, dentro de www/Empresaseguridad

a. Cambiar de nombre a Joomla por

www/empresaseguridad2. En PHPAdmin crear base de datos bdejemplo3. Desde internet explorer instalarlo http://localhost:8080/empresaseguridad/

CUANDO SE CREAR DENTRO DE WWW EL NOMBRE DE UN PROYECTO COMO CARPETA

4. Crear la carpeta dentro de www Ejm. EmpresaSeguridad5. DESAMPAQUETAR JOOMLA, con la opción Extraer en Joomla, dentro de

www/Empresaseguridad

a. Cambiar de nombre por Joomla dentro de

www/empresaseguridad6. En PHPAdmin crear base de datos bdejemplo

Page 2: Intalacion de joomla

7. Desde internet explorer instalarlo http://localhost:8080/empresaseguridad/ o8. Desde internet explorer instalarlo http://localhost:8080/empresaseguridad/joomla9. Al final acceder con el usuario admin y contraseña admin

DEFINIR PLANTILLA

ACTIVAR VISTA PREVIA DE LA PLANTILLA1.Seleccionar opciones

2.Activar vista previa de la plantilla

Page 3: Intalacion de joomla

3.Luego clic en vista previa para saber como se llaman las posiciones

CAMBAIR MENU A HORIZONTAL1. Seleccionar gesto de menú

2. Seleccionar menú principal y cambiar de posición

3. Seleccionar plantilla Benz-20y seleccionar posición 1 para el menú

Page 4: Intalacion de joomla

4. Activar check para ver menú secundario5. Haciendo el mismo procedimiento puede cambiar si desea a la posición 6 ques barra

lateral derecha,luego en la posición 1 y desactivar texto Menu principal

CREAR CONTENIDO CREAR CATEGORIAS1. Seleccionar categoría

2. Agregar categoría para crear objeto de opciones de menú

CREAR CONTENIDOS

1. Crear contenido es con opción de artículos

Page 5: Intalacion de joomla

2. Configurar contenidoa. Agregar contenido (primera opción del menú) y añadirlo al menú

3. Para agregar contenido puede copia textos de la paina de Lorem Ipsum

4. Si desea puede cambiar el aspecto de los textos

ASOCIAR ARTICULO CREADO Y MOSTRAR EN EL MENU PRINCIPAL

1. Seleccionar Menu/Gestor de menú y seleccionar menú principal2. Crear Nuevo Menú3. Seguir la secuencia siguiente asociándolo al articulo que desee Ejm. Nosotros4. Pero activar en la parte superio Menu principal como indica el paso 9.

CAMBIAR PAINA DE INICIO A MOSTRAR

5. Seleccionar Menu/Gestor de menú y seleccionar menú principal6. Crear Nuevo Menú

Page 6: Intalacion de joomla

7. Seleccionar en tipo de menu, por el momento menú simple ya q tenemos solo una opción

8. Luego seleccionar la pagina a mostrar al inicio

9. Clic en al articulo la pagina inicio

10. Establecer por defecto pagina nueva de inicioa. Seleccionar Menu/Gestor de menú y seleccionar menú principalb. Clic en icono por defecto

11. Hacer clic en Ver Sitio y luego eliminar home12. Para ocultar modulo de logueo desactivar en gesto de modulos, haciendo clic en icono

verde

Page 7: Intalacion de joomla

13. Repetir el proceso para crear otro articulo que se asocia a la opción Nosotros (x ejemplo)a. Crear articulo y asociarlo al MenuPrincipalb. Crear menú y asociarlo al articulo Nosotrosc. Al ver sitio sucede este error

d. Para solucionar solo hacer clic en el icono reconstruir.

Page 8: Intalacion de joomla

CREAR PROYECTO

CREAR CATEORIA RAICESPRESENTACION

VisionMisionPRODUCTOS

VentasSERVICIOS

PersonalesNOTICIAS

Promociones

Agregar imagens desde el botón imagen de la parte inferior de la ventana del articuloEl botón mas permite mostrar el botón siuiente el la parte inferior del articulo en vista previa.

Page 9: Intalacion de joomla

CREAR PROYECTO

CREAR CATEORIA RAICESINSTITUCION

VisionMisionLocales

PRODUCTOSPersonalesEmpresariales

SERVICIOSVentasReservacion

NOTICIASPromocionesEncuéntranos

Page 10: Intalacion de joomla

CREAR PAGINA TIPO BLOG1. Crar categoría

a. Contenido/Gestor de categoríab. Ponerle el nombre novedades

2. Crear articulo con nombre PARTE I :a. Asociarlo a la categoría Novedadesb. Insertar imagenc. Insertar dentro de párrafos, Leer Mas usando icono

3. Crear articulo con nombre PARTE I :a. Asociarlo a la categoría Novedadesb. Insertar imagenc. Insertar dentro de párrafos, Leer Mas usando icono

4. Dentro de menú principal crear menú tipo bloa. Seleccionar tipo blog

b. Seleccionar en categoria Novedades

Page 11: Intalacion de joomla
Page 12: Intalacion de joomla

c. Se mostraría las dos paginas en una ventana, con su Leer mas

d. Para q la parte 2 se vea en una sola columna hacer este cambio, donde indica el Nro. De artículos a mostrar y numero de columnas

DESACTIVAR LINEAS DE CREACION QUE SE MUESTRA POR DEFECTO

Page 13: Intalacion de joomla

a. Se ven líneas como categoría, publicación y otros, b. Ubicar en Contenido/Gestor de artículosc. Seleccionar el icono opciones y deshabilitar las opciones que no quiere q se vean

Categoria, Visitar, Publicado y otros

MOSTRAR PAGINAS DESTACAS AL INICIO DE LA PRESEN TACION DE LA WEB

NOTA:

1. Debería tener activa la opción por defecto que es al articulo inicio2. O debería de crear en la opción presentación, como articulo destacado3. O crear una nueva opción desde el menú como articulo destacado, y cambiar el orden

para que se vea primero.

PROCEDIMIENTO

1. Desde gestor de artículos2. Activar destacas de parte i y ii x ejemplo

Page 14: Intalacion de joomla

3. Para que se vean ordenados los artículos que se mostrarían por defecto en la pagina de inicio, activar desde el gestor de menú a opción inicio y cambiar el numero de artículos principales a mostrar a 2

CAMBIAR ORDEN DE OPCIONES PRINCIPALES

1. Editar opción por ejemplo cliente2. Luego en ordenar seleccione la opción, la cual se ubicar detrás de la elegida

3. También puede mover a través de hacer clic en las flechas de desplazamiento

CREAR BANNER PRINCIPAL PARA SITIO WEB

BUSCAR EXTENSIONES JOOMLA

a. Buscar extensiones joomla en google es decir en la web

Page 15: Intalacion de joomla

b.

c. Descargar desde esta pagina

Son modulor para agregar a su web

1. Ingresar a googlea. Buscar como extensiones joomlab. Buscar ari image sliderc. Descargar modulo de galería de imágenesd. Instalar este zio desde Extensines/Gesto de Extensiones

2. Crear en la images la carpeta slidea. Copiar una serir de imágenes con el ancho de 1030 y 323 o el tamaño que desee

según el tamaño del espacio q lo contiene

Page 16: Intalacion de joomla

3. Puede redimensionar lasimagenes que desea mostrar en el slide usando photoshop

Page 17: Intalacion de joomla

COMO CAMBIAR LOGO DE JOOMLA CON UN SLIDE DE IMÁGENES

Debe de crear una posición para poder agregar el slide y como no existe hay q definirla modificando los siguientes archivos que se encuentran en la carpeta

1. Crear div para pisiciona. Modificar el archivo index.php

Línea 114

< div id ="header">< div class ="logoheader">añadir este div

<div class ="slideshow"><jdoc:include type="modules" name="slideshow" style="beezDivision" /></div> < h1 id="logo">

2. Crear posicion para ubicar el diva. Editar TemplateDetails.xml

Page 18: Intalacion de joomla

b. Y en linea 44 mas o menos agregar posicion<position>position-13</position><position>position-14</position>

<position>slideshow< /position></positions>

3. Cambiar caracteristicas del bannera. En carpeta CSS abrimos position.cssb. Edita #header

#header{ display:block !important; position:relative; padding:0px 0 0 0; overflow:hidden;

width:100%;height:300px;/*cambio*/

}

4. Crear clase slideshow, para dar las caracteristicas del lugar donde se muestran las imagenes

a. Copiar la clase #header y corregir con el nombre #slideshow

#slideshow

{ display:block !important; position:relative;

z-index:1000; padding:0px 10px 0 10px; overflow:hidden;

width:100%;height:300px;/*cambio*/

margin:0 0 0 0;}

4. Activar Gestor de modulosa. Extensiones/Gestor de Modulob. Seleccionar el posición creada llamada slideshow sino escribirla

Page 19: Intalacion de joomla

c. Cambiar propiedades para mostrar imágenes

Cambiar el ancho a 1030 q es el ancho de la plantilla, desde seleccionar el modulo de ariimageslider, este ancho es para que cuadro con el borde del menú

d. Establecer la carpeta de donde se tomaran la imágenes

Page 20: Intalacion de joomla

e. Seleccionar en la paginas que desea mostrar el slide

DESACTIVAR LA IMAGEN POR DEFECTO DE JOOLMA Q SE VE COMO FONDO

1. Abrir el archivo personal.cssa. Ubicarse en la clase logoheader y comentar todo este código, para que no cargue

la imagen personal2.png

Page 21: Intalacion de joomla

Buscar 45 mejores plantillas joomla

CAMBIOS ADICIONALES

1. Mostrar opciones del menú o noa. Seleccionar Configuracion globalb. Seleccionar Si para que se muestre el menúc. Seleccionar No para que no se muestre el menú

MOSTRAR BOTONES INFERIOR DE IMÁGENES, AL HACER CLIC Q SE MUESTRE LA IMAGEN

Page 22: Intalacion de joomla

a. Boton de navegaciónb. En CSS en archivo position.css modificar la propiedadc. Height : 270 px es decir 20 px mas de lo normal

ADICIONALES

MOSTRAR SUB MENU

a. Solo ubicar le opción que desea dentro de otra opción y no de la raíz

ELIMINAR ELEMENTOS ELIMINADOS

a. Cuando se borran los elemento del menú, y se vuelven a crear con el mismo nombre sale un mensaje de error q elemento ya existe

b. Para eliminarlo desde la papelera y dejar crear elemento con el nombre anterior

Page 23: Intalacion de joomla

c. Seleccione Gestos de Menud. Seleccionar estado “eliminado” y elimine los elementos

e. Volver a crear con el mismo nombre

CREAR FORMULARIO CONTACTENOS

1. Desde gestor de menú2. Seleccionar nuevo3. Seleccionar “contacto único”

4. Cambiar propiedades

En este video muestra crear slider descargando la plantilla

http://www.youtube.com/watch?v=IGJ7tVnZrmQ

Page 24: Intalacion de joomla

AGREGAR ARTICULOS LA PARTE INFERIOR DE LA PLANTILLA

1. Observar la posición en donde quiere asociar un articulo2. Hacer vista previa de plantilla

3. Crear Categorias

4. Crear contenido de artículos y asociarlos a cada una de las categorías creadas

Page 25: Intalacion de joomla

5. Crear para las tres regiones

6. Crear modulosa. Desde el gestor de módulos crear nuevo modulo, eligiendo la opción

b. Yc.d.

b. Asociar la posición y el articulo

b. S i desea que el articulo muestra la imagen que se ha insertado activar la opción mostrar imagen, dentro de configuración de modulo

Page 26: Intalacion de joomla
Page 27: Intalacion de joomla

INSERTAR MODULO MENU EN UNA DE LAS PAGINAS O TODAS1. Insertar desde el Gestor de Modulos la opción Menu

2. Seleccionar Menu que desea agregar son sus respectivas sub opciones

Page 28: Intalacion de joomla

INSERTAR MENU EN LA PLANTILLA BEEZ-20

Cuando se agregan menú, estas opciones no se ven, debido a la plantilla, por ejemplo agregar dos opciones a una opción principal del menú

1. Crear dos artículos ejemplo Parte I y Parte II2. Luego insertar menú y asociar al articulo Parte I pero ubicarlo en menú padre Ultima

3. Hacer lo mismo para Parte II, debe quedar así

4. En vista previa se dará cuenta que no aparece, estas sub opciones o se muestran distorcionadas en otras posiciones.

DESCARGAR DE JOOMLA EXTENSIONES

1. Descargar swmenufreeWeb: extensions.joomla.org/extensions/structure-a-navigation/menu-systems/menu-editors/168

Page 29: Intalacion de joomla

2. Instalar este modulo desde Extensiones/Gestor de extensiones3. Desde Extensiones / Gestor de módulos, Despublicar Menu Principal4. Desde Extensiones / Gestor de Modulos Activar modulo de Swmenufree

5. Activar Menu principal de Swmenufree para hacer los cambios respectivos, desde opción Componente / Swmenufree

Page 30: Intalacion de joomla

6. Cambiar menú a horizontal, mediante el componente

7. Luego gurdar o hacer vista previa si desea u observe en la parte inferior los cambios que ocurren.

8. Cambiar el ancho de cada opción para ajustar el ancho del menú al ancho de la plantilla, debe mover solo el botón de deslizamiento

9. Puede cambiar también la altura o el espacio de la opciones con respecto a su posición

Page 31: Intalacion de joomla

10. Cambiar color de fondo del menú

11. Cambiar los bordes y estilo de borde delmenu principal

Page 32: Intalacion de joomla

12. Para mostrar sub opciones delante de los banner copiar este códigoAñadir un código como el siguiente en el archivo templates/beez_20/css/layout.css y compruebelo:#outertable div.section, #outertable div.section a {z-index: 10000 !important;}

DESCARGAR MODULO MENU DESDE

http://www.joomlack.fr/en/download-joomla-extensions/view_category/3-maximenu-ck-joomla-2-5VIDEOhttp://www.youtube.com/watch?v=P2HDIX_6FDw