SITIOS WEB Taller de creación de sitios web en Wordpress.

Presentación del tema: "SITIOS WEB Taller de creación de sitios web en Wordpress."— Transcripción de la presentación:

1 SITIOS WEB Taller de creación de sitios web en Wordpress

2 Primer sitio web (1990) http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

3 WEB 1.0 (1990- 2000)

4 WEB 2.0 (2000-2010)

5 WEB 3.0 (2010- presente)

6

7 Modelo Jesse James Garrett

8 Wireframe - Maqueta visual del sitio web. - Útil para tener una idea general sobre cómo estará organizado el diseño del sitio - Se puede realizar tanto con programas pagados como con aplicaciones en línea. - Maqueta visual del sitio web. - Útil para tener una idea general sobre cómo estará organizado el diseño del sitio - Se puede realizar tanto con programas pagados como con aplicaciones en línea.

9 Estructura de contenidos -Muestra cómo se organizan los contenidos que existen en el sitio. -Muestra cómo están organizados los diversos tipo de menús del sitio. -Explica cómo se dividen los contenidos en relación a las divisiones presentadas en el wireframe. -Muestra cómo se organizan los contenidos que existen en el sitio. -Muestra cómo están organizados los diversos tipo de menús del sitio. -Explica cómo se dividen los contenidos en relación a las divisiones presentadas en el wireframe.

10 Elementos para montar un sitio web Dominio Hosting CMS

11 Dominio: ¿Cómo se llamará el sitio web? Fácil de escribir, escuchar y leer Fácil de recordar Debe representar el contenido

12 Web Hosting El servicio donde se aloja todo el contenido que tenemos en nuestro sitio. Pagados y gratuitos Algunos ofrecen mantenimiento y diversas opciones para facilitar la experiencia del usuario.

13 Conectar dominio con hosting Para conectar nuestro dominio con el hosting debemos enlazarlos con los DNS que otorga el servicio de hosting al momento de la confirmación de compra. DNS: Domain Name Server (traduce IP a un nombre de dominio.)

14 Conectar dominio con hosting Dependerá de cada de servicio de dominio, pero en la mayoría de los casos sólo se solicitarán los DNS primario y secundario. *El DNS primario es el único que puede hacer cambios en el sitio, todos los otros trabajan en función de este. *El proceso puede demorar hasta 48hrs, para que dominio y hosting puedan estar conectados. Dependerá de cada de servicio de dominio, pero en la mayoría de los casos sólo se solicitarán los DNS primario y secundario. *El DNS primario es el único que puede hacer cambios en el sitio, todos los otros trabajan en función de este. *El proceso puede demorar hasta 48hrs, para que dominio y hosting puedan estar conectados.

15 CPanel Interface de administración del hosting Desde aquí podemos administrar archivos, bases de datos, dominios, webmail, seguridad

16 Elementos del CPanel Webmail: Nos permite tener casillas de mails propias de nuestro sitio (ej. nombre@midominio.cl). Se puede combinar con servicios de gmail, Outlook, entre otros. MySQL: Crea las bases de datos que nos permiten hacer que el sitio funcione. PHPMyAdmin: Nos permite administrar y editar las bases de datos. FTP (File transfer Protocol): Permite la transferencia de archivos cliente-servidor. Se puede trabajar desde una plataforma online o con programas que se pueden bajar.

17 Cms (content management system)

18 INSTALACIÓN WORDPRESS Taller de creación de sitios web en Wordpress

19 Wordpress vs Wordpress www.wordpress.com - plataforma simple para usuarios de nivel básico. -sistema de “red social” que permite relacionarse con otros autores. - Se debe contratar par acceder a más opciones wwww.wordpress.org

20 Wordpress vs Wordpress www.wordpress.com -Plataforma gratuita -Código abierto -Diversidad de diseños -Todo se puede editar wwww.wordpress.org

21

22 Elementos necesarios para la instalación Paquete de instalación de wordpress: contiene todos los archivos necesarios Base de datos: Crea una base para el hospedaje de los archivos en nuestro servidor y el correcto funcionamiento del cms. Cliente FTP : Nos permite conectar y transferir los archivos de nuestro ordenador al servidor. Editor HTML: Nos permite hacer las modificaciones necesarias en los archivos de wordpress para completar la instalación. Paquete de instalación de wordpress: contiene todos los archivos necesarios Base de datos: Crea una base para el hospedaje de los archivos en nuestro servidor y el correcto funcionamiento del cms. Cliente FTP : Nos permite conectar y transferir los archivos de nuestro ordenador al servidor. Editor HTML: Nos permite hacer las modificaciones necesarias en los archivos de wordpress para completar la instalación.

23 Paquete de instalación La versión más reciente y en español la encontraremos en http://es.wordpress.org http://es.wordpress.org Fácil instalación. La “famosa instalación en 5 minutos” la podemos encontrar en el mismo sitio que bajamos el archivo. La versión más reciente y en español la encontraremos en http://es.wordpress.org http://es.wordpress.org Fácil instalación. La “famosa instalación en 5 minutos” la podemos encontrar en el mismo sitio que bajamos el archivo.

24 Instalación en 5 minutos 1.Descarga el paquete de la última versión WordPress y descomprímelo en una carpeta vacía de tu ordenador. 2.Abre el archivo wp-config-sample.php con un editor de texto plano y rellena los datos de la conexión a tu base de datos. 3.Guarda el archivo como wp-config.php. 4.Sube todo a tu servidor. 5.Abre http://tudominio.com/wp-admin/install.php en tu navegador. Con esto deberán crearse las tablas necesarias para tu sitio. Si hay algún error, haz el favor de revisar tu archivo wp-config.php y probar de nuevo. Si vuelve a fallar visita los foros de soporte (en inglés) con todos los datos que puedas aportar.foros de soporte 6.Anota la contraseña que se te proporcionará o elígela tu mismo (desde WordPress 3.0 y en versiones anteriores se genera automáticamente). 7.El programa de instalación te enviará entonces a la página de acceso. Accede con el nombre de usuario elegido (o admin en versiones anteriores a WordPress 3.0) y la contraseña creada durante la instalación. Ahora podrás hacer clic en ‘Perfil’ y cambiar la contraseña. 1.Descarga el paquete de la última versión WordPress y descomprímelo en una carpeta vacía de tu ordenador. 2.Abre el archivo wp-config-sample.php con un editor de texto plano y rellena los datos de la conexión a tu base de datos. 3.Guarda el archivo como wp-config.php. 4.Sube todo a tu servidor. 5.Abre http://tudominio.com/wp-admin/install.php en tu navegador. Con esto deberán crearse las tablas necesarias para tu sitio. Si hay algún error, haz el favor de revisar tu archivo wp-config.php y probar de nuevo. Si vuelve a fallar visita los foros de soporte (en inglés) con todos los datos que puedas aportar.foros de soporte 6.Anota la contraseña que se te proporcionará o elígela tu mismo (desde WordPress 3.0 y en versiones anteriores se genera automáticamente). 7.El programa de instalación te enviará entonces a la página de acceso. Accede con el nombre de usuario elegido (o admin en versiones anteriores a WordPress 3.0) y la contraseña creada durante la instalación. Ahora podrás hacer clic en ‘Perfil’ y cambiar la contraseña.

25 Wpconfig-sample.php ¿Cómo podemos ingresar a este archivo? -Adobe Dreamweaver -Wordpad -Bloc de Notas -Sublime Text 2 * Para ingresar los datos que se necesitan para concluir la instalación se debe crear una base de datos en el MySQL del CPanel ¿Cómo podemos ingresar a este archivo? -Adobe Dreamweaver -Wordpad -Bloc de Notas -Sublime Text 2 * Para ingresar los datos que se necesitan para concluir la instalación se debe crear una base de datos en el MySQL del CPanel

26 MySQL Debemos crear una base de datos y un usuario y contraseña para esta base

27 MySQL Crear usuario y contraseña En el mismo recuadro podemos añadir el usuario a la BD

28 Wpconfig-sample.php Al tener los datos de la BD podemos completar los datos que se solicitan en el archivo. En la gran mayoría de los casos el ítem “DB_HOST” no será necesario cambiarlo, de ser así el cpanel nos advertirá que debemos modificarlo. Una vez realizado los cambios, es necesario modificar el nombre del archivo a “wpconfig.php” Al tener los datos de la BD podemos completar los datos que se solicitan en el archivo. En la gran mayoría de los casos el ítem “DB_HOST” no será necesario cambiarlo, de ser así el cpanel nos advertirá que debemos modificarlo. Una vez realizado los cambios, es necesario modificar el nombre del archivo a “wpconfig.php”

29 FTP Lo vamos a utilizar para transferir el paquete de WP a nuestra web Para poder trabajar con este protocolo se puede desde la opción online que ofrece el Cpanel o desde programas que cumplen la misma función. En este caso ocuparemos el programa Filezilla, un software gratuito que está dentro de los mejores considerados para esta tarea. Filezilla se puede bajar desde su propio sitio, donde se baja por “Filezilla Client” sitio Lo vamos a utilizar para transferir el paquete de WP a nuestra web Para poder trabajar con este protocolo se puede desde la opción online que ofrece el Cpanel o desde programas que cumplen la misma función. En este caso ocuparemos el programa Filezilla, un software gratuito que está dentro de los mejores considerados para esta tarea. Filezilla se puede bajar desde su propio sitio, donde se baja por “Filezilla Client” sitio

30 Filezilla Para trabajar desde Filezilla debemos tener una cuenta ftp creada en Cpanel. En la mayoría de los casos viene una creada por defecto con los mismos accesos que se nos dan para ingresar a Cpanel. Si tenemos más usuarios que trabajarán en el sitio podemos crear más cuentas, a las que le podremos dar accesos sólo a directorios específicos

31 Filezilla Servidor: La dirección es la misma que la de nuestro dominio principal pero anteponiendo FTP (ftp.midominio.com)ftp.midominio.com Puerto: interfaz para comunicarse con la red. (21 por defecto) Sitio Local: Nuestro ordenador, desde dónde saldrán los archivos Sitio Remoto: Nuestra web, donde trasladaremos los archivos. Servidor: La dirección es la misma que la de nuestro dominio principal pero anteponiendo FTP (ftp.midominio.com)ftp.midominio.com Puerto: interfaz para comunicarse con la red. (21 por defecto) Sitio Local: Nuestro ordenador, desde dónde saldrán los archivos Sitio Remoto: Nuestra web, donde trasladaremos los archivos.

32 Filezilla En sitio local debemos buscar la carpeta donde tenemos alojado el paquete de instalación de wordpress Una vez encontrada buscamos en el sitio remoto la carpeta Public_html, carpeta raíz de nuestro sitio web, y trasladamos todos los archivos a esta. La instalación suele durar un par de minutos. Precaución: no debemos hacer que los archivos pasen a la carpeta cgi-bin que se encuentra alojada ahí. Ahí están los archivos que permiten la correcta ejecución del sitio web en general. En sitio local debemos buscar la carpeta donde tenemos alojado el paquete de instalación de wordpress Una vez encontrada buscamos en el sitio remoto la carpeta Public_html, carpeta raíz de nuestro sitio web, y trasladamos todos los archivos a esta. La instalación suele durar un par de minutos. Precaución: no debemos hacer que los archivos pasen a la carpeta cgi-bin que se encuentra alojada ahí. Ahí están los archivos que permiten la correcta ejecución del sitio web en general.

33 Finalizar instalación Cuando estén todos los archivos arriba, ingresamos a nuestro sitio con la siguiente dirección para ir al último paso de la instalación. Completamos el formulario con los datos solicitados, creando un usuario y una clave que nos va a permitir ingresar a la administración de nuestro sitio. www.midominio.com/wp-admin/install.php

34 Desde ahora en adelante para ingresar a nuestro sitio lo debemos hacer a través de nuestro dominio y agregando “/wp-admin” desde ahí podremos ingresar al administrador de nuestro wordpress.

35 Actualización de wordpress Cada cierta cantidad de tiempo wordpress va haciendo mejoras de diversos en diversos ámbitos a su administrador de contenidos. Las actualizaciones son opcionales y optar por ellas va a depender de las necesidades de nuestro sitio. Se recomienda siempre tomar precauciones al momento de actualizar. Cada cierta cantidad de tiempo wordpress va haciendo mejoras de diversos en diversos ámbitos a su administrador de contenidos. Las actualizaciones son opcionales y optar por ellas va a depender de las necesidades de nuestro sitio. Se recomienda siempre tomar precauciones al momento de actualizar.

36 Actualización de wordpress PRECAUCIONES -No actualizar inmediatamente, esperar siempre un par de días. - Desactivar todos los plugins e ir reactivándolos de a poco (esto en caso de que este sea muy antiguo y pueda generar conflicto con una actualización de WP) -Revisar que todo lo que instalamos sea compatible con la nueva versión o en su defecto tenga una actualización propia que lo haga compatible. -Hacer un respaldo de la carpeta “wp-content” (carpeta donde se encuentran plantillas y plugins que pueden sufrir cambios con la actualización) -Tener un respaldo de la última versión de wordpress que se utilizó. PRECAUCIONES -No actualizar inmediatamente, esperar siempre un par de días. - Desactivar todos los plugins e ir reactivándolos de a poco (esto en caso de que este sea muy antiguo y pueda generar conflicto con una actualización de WP) -Revisar que todo lo que instalamos sea compatible con la nueva versión o en su defecto tenga una actualización propia que lo haga compatible. -Hacer un respaldo de la carpeta “wp-content” (carpeta donde se encuentran plantillas y plugins que pueden sufrir cambios con la actualización) -Tener un respaldo de la última versión de wordpress que se utilizó.

37 Cambiar de directorio ¿Qué pasa si tengo mi sitio en el directorio www.midominio.com/wordpress pero quiero que esté en www.midominio.com ?www.midominio.com/wordpresswww.midominio.com ¿Qué pasa si tengo mi sitio en el directorio www.midominio.com/wordpress pero quiero que esté en www.midominio.com ?www.midominio.com/wordpresswww.midominio.com

38 Cambiar de directorio Crear un respaldo de todos nuestra carpeta WP y nuestra base de datos Modificar las direcciones que aparecen en AJUSTES>GENERAL por las nuevas que vamos a utilizar. Crear un respaldo de todos nuestra carpeta WP y nuestra base de datos Modificar las direcciones que aparecen en AJUSTES>GENERAL por las nuevas que vamos a utilizar.

39 Cambiar de directorio Modificar la Base de datos ingresando a la aplicación “PHPMyAdmin en le Cpanel. Ir al archivo “Wp_Options” y revisar si están modificadas las tablas “Siteurl” y “home”. Si no es así se debe colocar la nueva dirección en donde estará nuestro sitio, en ambas. Modificar la Base de datos ingresando a la aplicación “PHPMyAdmin en le Cpanel. Ir al archivo “Wp_Options” y revisar si están modificadas las tablas “Siteurl” y “home”. Si no es así se debe colocar la nueva dirección en donde estará nuestro sitio, en ambas.

40 Cambiar de directorio Copiar todos los archivos y carpetas de nuestro antiguo sitio al nuevo lugar donde estarán hospedadas. Una vez hecho este proceso debemos ingresar a nuestro sitio desde la nueva dirección agregando “/wp-admin” (ej. www.nuevodominio.com/wp- admin) www.nuevodominio.com/wp- admin Copiar todos los archivos y carpetas de nuestro antiguo sitio al nuevo lugar donde estarán hospedadas. Una vez hecho este proceso debemos ingresar a nuestro sitio desde la nueva dirección agregando “/wp-admin” (ej. www.nuevodominio.com/wp- admin) www.nuevodominio.com/wp- admin

41 Cambiar de directorio Para finalizar es necesario modificar los Permalinks (Enlaces permanentes) del sitio, para modificar los archivos que aún puedan tener información con respecto a la url anterior. Los Enlaces permanentes modifican cómo queremos ver una dirección que se encuentre en nuestro dominio. Para finalizar es necesario modificar los Permalinks (Enlaces permanentes) del sitio, para modificar los archivos que aún puedan tener información con respecto a la url anterior. Los Enlaces permanentes modifican cómo queremos ver una dirección que se encuentre en nuestro dominio.