CURSO JOOMLA AVANZADO

Contenidos del curso: • Requerimientos técnicos para servidor local o remoto

• Nuestro PC como servidor de páginas web Joomla

• Instalación personalizada con Quickstart

• Instalación mediante aplicaciones propias del servidor

• Copia de seguridad. Backup y restore.

• Migración entre servidores y de local a remoto

• Gestión de permisos en archivos y directorios

• Proteger acceso administrador

• Instalación manual y mediante webservice de extensiones

• Extensiones: módulos, plugins y componentes recomendados

• Administración de publicidad, propia y de terceros

• Insertar código personalizado: Java, HTML, PHP

• Instalación y configuración de tienda simple

• Instalación y configuración de tienda avanzada

• Configuración de sistema de pagos o donaciones con PayPal

• Crear y gestionar grupos de usuarios y niveles de acceso

• Creación de contenido (artículos, menús y módulos) orientado a niveles de acceso

• Gestor multimedia

• Modificación de un plantilla básica

• Creación de una plantilla personalizada para Joomla

Requisitos de instalación Acceso remoto: Para acceder a Joomla a

través de Internet no es necesario ningún otro software adicional para crear o editar contenidos. Es posible hacerlo a través de cualquier navegador conectado a la red: Internet Explorer, Firefox, Chrome, Opera, etc.

Acceso local: Si se desea instalar un sitio

web bajo Joomla en un computador local es necesario poseer un servidor web (Apache o Internet Information Services - IIS), capaz de interpretar el lenguaje PHP, y un programa para gestionar las bases de datos MySQL.

Requerimientos técnicos para servidor local o remoto

Nuestro PC como servidor de páginas web Joomla

WAMPSERVER Uno de los paquetes más sencillos de

utilizar en Windows. Es open source, libre y gratuito. Se instala muy fácilmente y su uso es muy intuitivo.

http://www.wampserver.com/en/

XAMPP Es open source, libre, gratuito y

multiplataforma (posee versiones para Windows, Linux y Mac). Incluye servidor de correo y aplicación de FTP.

http://www.apachefriends.org/es/xampp.html

Instalación con Quickstart

Descarga el Joomla quickstart package correspondiente a la plantilla a aplicar. Debe estar disponible en los sitios web de los desarrolladores

Descomprimir el contenido del Joomla quickstart package. Sube los archivos Joomla a tu servidor. Para ello, usarás tu cliente FTP o un sistema FTP

en línea. Iniciar la instalación del quickstart vía navegador web, indicando la url de destino Cumplimentar los diferentes pasos de instalación con los parámetros de nuestro sitio

web y de conexión con la base de datos, previamente creada Importante marcar la opción de instalar el contenido demo que se nos ofrece

Son muchos los desarrolladores de plantillas (JoomlArt, JoomlaBamboo, RocketTheme,TemplatePlazza, Gavick Pro, IceTheme, etc.) que facilitan instaladores de sus plantillas que a su vez contienen una copia completa de la versión con todos los datos de ejemplo necesarios para compilar la plantilla igual que la demo.

Instalación mediante aplicaciones del servidor

1.- Accederemos al panel de control de nuestro hosting con los datos que nos haya facilitado nuestro proveedor de servicios de alojamiento web

Instalación mediante aplicaciones del servidor

2.- Una vez hayamos metido nuestros datos de acceso al panel, nos debemos dirigir a la pestaña de aplicaciones, en el menú superior.

Instalación mediante aplicaciones del servidor

3.- Elegimos la instalación personalizada de Joomla y tras aceptar el aviso legal, configuramos los datos de instalación.

Instalación mediante aplicaciones del servidor

4.- Una vez finalizada la instalación, se nos mostrara en pantalla la información de la aplicación y los accesos a la misma

Copia de seguridad. Backup Cuando creamos un sitio Web, nuestro primer paso después de la instalación debiera ser una extensión de copias de seguridad. Las copias de seguridad las llevaremos a cabo con una imprescindible herramienta en el mundo Joomla!, Akeeba Backup.

1.- Al hacer clic en Ejecutar el asistente de configuración, hará una serie de pruebas en nuestro servidor para optimizarlo de la mejor forma.

Copia de seguridad. Backup 2.- Para realizar nuestro primer respaldo del sitio, hacemos clic en la pestaña que dice Respaldar ahora. Cuando nos retorna la pantalla, veremos que podemos completar con algunos datos para así tener de referencia cuando y por qué realizamos el respaldo.

Copia de seguridad. Backup 3.- Cuando ya completamos y leímos atentamente las recomendaciones procedemos al respaldo, haciendo clic en !Respaldar Ahora¡; Tengamos en cuenta que cuando estamos haciendo el respaldo No debemos navegar por otras pestañas desde la que estamos, a menos que salga un error o ya haya terminado nuestro respaldo.

Copia de seguridad. Backup 4.- Si todo salió bien después de unos minutos tendremos nuestro respaldo realizado.

Copia de seguridad. Restore 1.- Creamos una carpeta para una instalación y la base de datos de forma previa a la descompresión de los archivos de la copia de seguridad con Akeeba eXtract Wizard

Copia de seguridad. Restore 2.- Una vez descomprimida la copia, subimos la totalidad de los archivos a la carpeta elegida de nuestro servidor, para a continuación acceder vía url, donde se mostrara una pantalla similar a la siguiente.

Copia de seguridad. Restore 3.- Cumplimentaremos los datos que se nos solicitan en relación a la base de datos, servidor, usuario y contraseña (como haríamos en una instalación normal de Joomla), para una vez finalizada mostrarse nuestra web restaurada correctamente.

Migración de sitio web de local a remoto o entre servidores

Para migrar de un servidor local a un servidor de Internet, o entre diferentes servidores web emplearemos PhpMyadmin y un cliente FTP, aunque el proceso descrito en el capitulo de copias de seguridad también es aplicable. 1.- Migrar la base de datos completa. Accedemos a la página de inicio de PhpMyAdmin de nuestro servidor, elegiremos la base de datos de nuestro sitio web y pulsamos en “Exportar. 2.- El archivo se guarda en formato sql que luego importaremos sin necesidad de realizar modificación alguna en el mismo

Migración de sitio web de local a remoto o entre servidores

3.- Copiar los archivos y carpetas de nuestro servidor local de Joomla al nuevo servidor. Para hacerlo tendremos que conectarnos con el servidor remoto mediante FTP, por lo que necesitamos un cliente FTP y los datos de acceso al servidor.

Migración de sitio web de local a remoto o entre servidores

4.- Cuando hayamos subido todos los archivos, comprobaremos que los datos del archivo “configuration.php”, en especial los que hacen referencia a la base de datos, son correctos

5.-A partir de este momento, tendremos en el nuevo servidor, una web idéntica a la de nuestro servidor de origen, ya sea este local o remoto.

Gestión de permisos en archivos y directorios

El porqué de los permisos se aconseja sean son 755 para carpetas y 644 para archivos es encontrar un equilibrio ajustado entre la funcionalidad y la seguridad de un sitio web. Los permisos se pueden modificar mediante protocolo FTP o a través de un administrador de archivos que disponen los paneles de control del Alojamiento, por ejemplo cPanel.

Recomendación importante, no tener archivos o carpetas en 777, debido a que puede leer, escribir y ejecutar todo el mundo, y eso es una vulnerabilidad.

Proteger acceso administrador Para proteger el acceso a la administración de Joomla!, vamos a utilizar Kareebu Secure, aunque también se puede proteger dicho acceso mediante la modificación del archivo .htaccess 1.- Una vez descargado el plugin de su web oficial http://www.kareebu.com/downloads, procederemos a acceder a su configuración desde el panel de extensiones

Proteger acceso administrador 2.- Una vez descargado el plugin de su web oficial http://www.kareebu.com/downloads, procederemos a acceder a su configuración desde el panel de extensiones 3.- En "Opciones básicas" marcaremos "Enable" a "Sí", en "Password" introduciremos la contraseña que luego utilizaremos para el acceso a la administración de Joomla! 4.- En la pestaña "Detalles" marcaremos en "Estado" la opción "Habilitado", y guardamos la configuración

Proteger acceso administrador A partir de ahora, si introducimos la URL: http://miweb.com/administrator , nos redireccionará a la página inicial del sitio Para acceder a la administración de Joomla! a partir de ahora deberemos introducir la URL: http://miweb.com/administrator/?contraseña , (donde "contraseña" será la contraseña establecida en el paso anterior). En ese momento se nos solicitará usuario y contraseña para el acceso a la administración de Joomla!

Instalación manual y mediante webservice de extensiones

Instalar extensiones se supone que es una tarea sencilla, que apenas implica uno o dos minutos de tiempo. Métodos de instalación: Instalar desde Web (Install from Web). Instalar desde directorio (Install from Directory). Instalar desde URL (Install from URL). Subir archivo e Instalar (Upload Package File). ¿Que podemos instalar mediante estos métodos? Componentes. Módulos. Plugins. Bundles (componente, módulos, plugins, idiomas). Archivos de idiomas. Plantillas.

Instalación manual y mediante webservice de extensiones

Extensiones recomendadas

Publicidad en Joomla Aunque existen multitud de extensiones de Joomla para la gestión de banners vamos a usar el componente de banners que viene incluido en la propia instalación de Joomla. Con este componente, junto con su módulo asociado, podremos: mostrar los banners asociados a un determinado cliente o categoría, elegir el número de banners a mostrar en una posición, hacer que en un mismo lugar se vayan cargando los banners de forma aleatoria, asociar nuestros banners con nuestros contenidos en función de sus etiquetas, etc. Además, podremos controlar el número de impresiones del banner, el número de veces que se ha pulsado en él, indicar una fecha de caducidad, etc. De esta forma, podremos tener un control total de los banners en Joomla, en caso de que estemos cobrando a determinados clientes por colocarlos en nuestra web.

Publicidad en Joomla

Código personalizado en Joomla Joomla dispone mecanismos para que podamos insertar determinado tipo de código embebido en artículos y módulos. Editores como JCE permiten insertar código, aunque esto no está exento de excepciones. Por ello vamos a distinguir en este manual tres formas de insertar código personalizado: 1.- Configurando nuestro sistema sin editor de contenido dentro de la configuración global, podremos insertar en las cajas de edición el código deseado.

Código personalizado en Joomla 2.- Con el módulo Easy Custom Code para cargar elementos mediante código en módulos de una plantilla

Permite insertar código HTML, CSS y JavaScript Elegir en qué posición debe colocarse.

No contiene enlaces ocultos o código encriptado que puedan ser penalizados.

Utiliza la función de diferir el código JavaScript para mejorar su carga.

Permite instanciar la módulo (clonar) las veces que sea necesario.

Util para añadir código JavaScript, CSS o archivos sólo a ciertas páginas.

Ideal para insertar código de Google Analytics o código de AddThis.

Añadir código de Google Maps o de vídeos de YouTube.

Código personalizado en Joomla 3.- Con el plugin Sourcerer, insertamos PHP y cualquier tipo de código de estilo HTML (incluyendo CSS y JavaScript). No sólo en sus artículos, sino también en secciones, categorías, módulos, componentes, etiquetas META, etc.

Sistema de pagos con PayPal

Cuando en nuestra web queremos poner en marcha un sistema de pagos sencillo y que utilice Paypal, tenemos varias opciones, en lo que a extensiones se refiere, para ponerla en marcha. En este curso vamos a utilizar Instant Paypal. La versión gratuita básica nos permite construir el comercio electrónico utilizando la sintaxis plugin de Joomla para incrustar botones de Paypal directamente dentro de los artículos y los módulos de Joomla

Sistema de donaciones con PayPal SimplePayPal permite al usuario decidir la cantidad a donar antes incluso de pulsar cualquier botón. Opción muy atractiva ya que no se somete al usuario a formulario alguno acerca de sus datos y su acceso a Paypal, cosa que no suele gustar mucho, ya que la mayoría de los posible donantes lo querrán hacer de forma rápida y anónima y muchos de ellos simplemente obedeciendo a un impulso inicial que se puede ver frenado en el momento en que una simple acción de donar se convierte en una odisea.

Grupos de usuarios y niveles de acceso

El siguiente elemento que encontramos dentro de la gestión de usuarios de Joomla son los “Niveles de acceso”. Desde la pantalla principal de esta sección veremos todos los niveles de acceso existentes en nuestro sitio web y cada uno de ellos contendrá uno o varios grupos de usuarios.

Grupos de usuarios y niveles de acceso

Aquí veremos una lista con todos los usuarios de nuestro sitio, su estado, grupo al que pertenecen, fechas de visitas, etc. Podremos activar y desactivar sus cuentas o modificar su perfil entre otras opciones. Una novedad en J! 3 es que desde el gestor de usuarios se pueden añadir notas directamente, desde el botón que hay debajo del nombre del usuario.

Grupos de usuarios y niveles de acceso

Todos los usuarios de Joomla tienen que pertenecer a algún grupo. La gestión de los grupos la realizaremos desde “Usuarios > Grupos”. Aquí veremos una lista con los grupos existentes por defecto en nuestro Joomla junto con el número de usuarios que lo integran.

Contenido orientado a niveles de acceso

Cualquier contenido de nuestro sitio web: menú, módulo, artículo, etc., es configurable en relación a estos niveles, permitiendo así relacionar contenidos con usuarios y accesos.

Gestor multimedia En Joomla 3 la gestión de las imágenes que se usen, es una tarea bastante sencilla, como podrás comprobar a través del gestor multimedia desde el cual podremos crear y eliminar carpetas, subir y eliminar contenido multimedia, tanto en vista en miniatura, como en vista detalle. Este sistema nos evita la utilización de un gestor ftp.

Modificación de un plantilla básica Hay dos métodos disponibles para acceder a la funcionalidad de personalizar una plantilla del gestor de plantillas. La interfaz Personalizar Plantilla permite editar el código que se encuentra en los archivos de la plantilla, crear modificaciones de plantilla (overrides) y manipular los archivos de la plantilla.

Modificación de un plantilla básica Para acceder a la funcionalidad "Personalizar Plantilla": Directamente - Haga clic en el nombre de la plantilla en la columna Plantilla

Modificación de un plantilla básica Indirectamente - Estilos estará resaltada; haga clic en Plantillas justo debajo, lo que cambiará la vista a Gestor de Plantillas: Plantillas.

Creación de una plantilla para Joomla

Empezar desde cero, creando nuestra propia carpeta de la plantilla y todos los archivos necesarios en su interior es un trabajo para el que son necesarios conocimientos de CSS y de trabajo con capas (div). En el ejemplo de la imagen podemos ver un ejemplo de la estructura de una plantilla de Joomla para la versión 3.X

Creación de una plantilla Desde la versión 3 de Joomla! el proyecto decidió incluir Bootstrap framework en el núcleo de Joomla! (Bootstrap Version 2.3.2). Bootstrap contiene HTML y CSS-based en el diseño de las plantillas para la tipografía, formas, botones, gráficos, navegación y otros componentes de la interfaz, así como extensiones de JavaScript opcionales. A menudo se comienza con un diseño de dos o tres columnas con una barra de navegación en la parte superior y un pie de página al final. El diseño es dos columnas sería así:

Creación de una plantilla El diseño de tres columnas así:

Cada columna se representa a través de la clase "span". mediante "span4", que quiere decir que 4 de las 12 columnas, están ocupadas por este elemento, "span6" ocupará 6 columnas, y así sucesivamente. Cada área de columna debe incluirse en una "fila".

Creación de una plantilla La página entera de Joomla se denomina objeto o instancia. Para estar seguro de tener los valores correctos de todas las variables que se utilizan en la plantilla, es necesario contar con estas tres líneas en el archivo index.php , con diseño de 2 columnas $doc = JFactory::getDocument(); $this->language = $doc->language; $this->direction = $doc->direction; Cuando combinamos el index.php obtenemos este código <?php defined( '_JEXEC' ) or die; $doc = JFactory::getDocument(); $this->language = $doc->language; $this->direction = $doc->direction; ?> Para integrar plenamente bootstrap sólo tenemos que llamar al archivo bootstrap.css en el tag HTML head.

CURSO JOOMLA AVANZADO