Conociendo el Mundo de WordPress
Conociendo el Mundo de WordPress ANTES DE COMENZAR
Antes de Comenzar <ul><ul><li>No le teman a WP, amenlo, quieranlo e incluso salgan a pasear con él. </li></ul></ul><ul><ul...
Conociendo el Mundo de WordPress INSTALACIÓN
Instalación <ul><ul><li>Descomprimir los archivos de Wordpress en el root. </li></ul></ul><ul><ul><li>Edición del archivo ...
Instalación Edición del archivo wp-config.php:   Renombrar el archivo wp-config-sample.php a wp-config.php, abrirlo y fija...
Instalación URL para realizar la instalación:   http://www.dominio.com.ar/wp-admin/install.php   Ingresan a la url (con su...
Conociendo el Mundo de WordPress CONFIGURACIÓN BASICA
Configuración Básica Ajustes de Lectura:   Si queremos personalizar el home de nuestro Sitio Web, se realiza en este lugar...
Configuración Básica Cambiar los permalinks para que sean mas amigables:   http://www.dominio.com.ar/wp-admin/options-perm...
Conociendo el Mundo de WordPress CATEGORÍAS, ENTRADAS  Y PÁGINAS
Categorías, Entradas y Páginas Categorías:   Las categorías van a ser primordiales a la hora de organizar nuestro sitio we...
Categorías, Entradas y Páginas Entradas:   Serían las noticias de nuestro Sitio Web, pero haciendo un buen uso de las cate...
Categorías, Entradas y Páginas Algunas etiquetas que se usan frecuentemente en las Entradas (y demás):   <?php the_permali...
Categorías, Entradas y Páginas Páginas:   Las Páginas son como las Entradas, excepto que pueden hacer mucho más que las En...
Conociendo el Mundo de WordPress INSTALACIÓN Y PERSONALIZACIÓN DE PLUGINS
Conociendo el Mundo de WordPress ESTRUCTURA DE UNA PLANTILLA
Estructura de una Plantilla Ficheros que componen una Plantilla:
Estructura de una Plantilla Sobre el index.php: El directorio de la plantilla se debe situar en el directorio  /wp-content...
Estructura de una Plantilla Sobre el single.php: En el caso en que se muestre una entrada en concreto, en lugar de la pági...
Estructura de una Plantilla Sobre el style.css: Esto tiene que estar en el comienzo del style.css /* Theme Name: Nombre de...
Estructura de una Plantilla Sobre el sidebar.php: El sidebar se almacena en el fichero sidebar.php, y en el mostraremos la...
Estructura de una Plantilla
Estructura de una Plantilla Sobre el header.php: <title>     <?php bloginfo('name'); ?> <?php wp_title(); ?> </title> La f...
Estructura de una Plantilla
Estructura de una Plantilla Sobre el page.php: Para poder levantar la información que hay en una página, se tiene que pone...
Estructura de una Plantilla Múltiples archivos page.php: Para crear diferentes archivos  page.php  tenemos que crear otro ...
Estructura de una Plantilla ¿Donde esta la diferencia entre index.php y page.php?: Ambos archivos utilizan un loop para le...
Estructura de una Plantilla Otros archivos: Por ejemplo, si le pinchamos sobre una categoría para ver los posts de la mism...
Estructura de una Plantilla Otros archivos: En  screenshot.jpg  guardaremos un thumbnail (miniatura) de nuestra plantilla ...
Estructura de una Plantilla La Barra de Navegación (menú): El menú de nuestro sitio web es una parte esencial y tenemos qu...
Estructura de una Plantilla Generando archivos personalizados: Si se generan archivos externos a la estructura base, como ...
Estructura de una Plantilla <ul><li>Tags de WordPress: </li></ul><ul><li>Son llamadas que se utilizan en la plantilla del ...
Conociendo el Mundo de WordPress HOJA DE AYUDA
Hoja de ayuda Hoja de Ayuda para WP: Es muy común olvidarse algún snippet / funciones de WordPress por lo tanto es recomen...
Conociendo el Mundo de WordPress CONSIDERACIONES CUANDO SE REALIZA UNA PLANTILLA
Consideraciones cuando se realiza una plantilla <ul><li>Para tener en cuenta: </li></ul><ul><ul><li>Cuando el sitio no tie...
Conociendo el Mundo de WordPress XHTML A WORDPRESS
XHTML a WordPress Pasos a seguir: 1) Tener la estructura del WP realizada (con todos los archivos que se necesiten según e...
Conociendo el Mundo de WordPress CONSEJOS PARA WORDPRESS
Consejos para Wordpress <ul><ul><li>Borrar los archivos wp-install.php, wp-upgrade.php </li></ul></ul><ul><ul><li>Bloquear...
Upcoming SlideShare
Loading in …5
×

Guia word press

1,142 views
1,067 views

Published on

Pequeña guía sobre WordPress

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,142
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
34
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Guia word press

  1. 1. Conociendo el Mundo de WordPress
  2. 2. Conociendo el Mundo de WordPress ANTES DE COMENZAR
  3. 3. Antes de Comenzar <ul><ul><li>No le teman a WP, amenlo, quieranlo e incluso salgan a pasear con él. </li></ul></ul><ul><ul><li>Olvídense de los subdirectorios de secciones. </li></ul></ul><ul><ul><li>Olvídense de rutas estáticas. </li></ul></ul><ul><ul><li>Olvídense de Flash (no es joda). </li></ul></ul><ul><ul><li>Tengan el Codex de WP (Biblia) siempre a mano. </li></ul></ul><ul><ul><li>No se frustren si sale &quot;Fatal Error&quot; o &quot;Warning&quot;. </li></ul></ul><ul><ul><li>No dejen código que no van a utilizar (trae problemas a futuro). </li></ul></ul><ul><ul><li>Intenten usar modo remoto y no local (hay varios problemas siempre) </li></ul></ul><ul><ul><li>WP no solo se usa para crear un &quot;blog&quot;, es una herramienta: flexible, fácil, práctica, potente, autosuficiente y desprende belleza al ser utilizado. </li></ul></ul>
  4. 4. Conociendo el Mundo de WordPress INSTALACIÓN
  5. 5. Instalación <ul><ul><li>Descomprimir los archivos de Wordpress en el root. </li></ul></ul><ul><ul><li>Edición del archivo wp-config.php. </li></ul></ul><ul><ul><li>Configuración del cliente FTP y subida de los archivos descomprimidos de Wordpress al servidor. </li></ul></ul><ul><ul><li>Instalación de Wordpress. </li></ul></ul><ul><ul><li>Configuración del idioma. </li></ul></ul><ul><li>  </li></ul><ul><li>==================================== </li></ul><ul><li>  </li></ul><ul><li>Aclaración: también pueden usar el &quot;Fantastico&quot; (tiene diversos nombres según el tipo de panel) para instalar WP, pero yo recomiendo hacer una instalación limpia y manual, para evitar problemas a futuro. (Spam y Seguridad) </li></ul>
  6. 6. Instalación Edición del archivo wp-config.php:   Renombrar el archivo wp-config-sample.php a wp-config.php, abrirlo y fijarse en esto: define('DB_NAME', ‘wordpress'); define('DB_USER', ‘username'); define('DB_PASSWORD', ‘password'); define('DB_HOST', ‘localhost');   ==========   DB_NAME = nombre de la base de datos. DB_USER = usuario que accede a la base de datos. DB_PASSWORD = contraseña para acceder a la base de datos. DB_HOST = donde está la base de datos (en el 95% suele ser localhost).   ========== Experiencia Personal: ¡No dejar espacios ni al comienzo ni al final del archivo! Ya que puede arrojar errores en el header.php!
  7. 7. Instalación URL para realizar la instalación:   http://www.dominio.com.ar/wp-admin/install.php   Ingresan a la url (con su dominio correspondiente) y siguen los pasos para finalizar la instalación. La instalación no dura más de 30 segundos.   ================   URL para entrar al panel de administrador:   http://www.dominio.com.ar/wp-admin   o   http://www.dominio.com.ar/wp-login.php
  8. 8. Conociendo el Mundo de WordPress CONFIGURACIÓN BASICA
  9. 9. Configuración Básica Ajustes de Lectura:   Si queremos personalizar el home de nuestro Sitio Web, se realiza en este lugar: Ajustes --> Lectura
  10. 10. Configuración Básica Cambiar los permalinks para que sean mas amigables:   http://www.dominio.com.ar/wp-admin/options-permalink.php   - Los Permalinks (permanent links o enlaces permanentes) va a condicionar toda la estructura del WordPress.   - La mejor estructura para los permalinks es /%postname%/ el resultado final sería:   http://www.dominio.com.ar/titulo-del-post   - Otra opción recomendable es /%year%/%monthnum%/%postname%/ para lograr un mayor orden con las diferentes entradas. Ambas opciones son recomendables, pero si o si hay que sacar el permalink que viene por defecto que no es amigable con el SEO y por supuesto es muy dificil de identificarlo:   Ejemplo:   http://www.dominio.com.ar/?p=123
  11. 11. Conociendo el Mundo de WordPress CATEGORÍAS, ENTRADAS  Y PÁGINAS
  12. 12. Categorías, Entradas y Páginas Categorías:   Las categorías van a ser primordiales a la hora de organizar nuestro sitio web, si por ejemplo queremos filtrar páginas mostrando determinado contenido. Para filtrar una categoría, hay que obtener el &quot;ID&quot; de la misma. Para mostrar las categorías hay que utilizar la siguiente función: <?php the_category(); ?> En caso de querer excluir determinadas categorías se agrega el parámetro correspondiente para filtrar las categorías: <?php wp_list_categories('orderby=name&exclude=3,5,9,16'); ?> Para mas info ver el codex   ================
  13. 13. Categorías, Entradas y Páginas Entradas:   Serían las noticias de nuestro Sitio Web, pero haciendo un buen uso de las categorías con filtros, se pueden agregar diferentes elementos para ser mostrados como testimonios, productos, etc. <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>      [ACA VA TODO EL CONTENIDO] <?php endwhile; else: ?>      <p>Mensaje de Error</p> <?php endif; ?> Ver este sitio para más información o bien el Codex de WP   ================
  14. 14. Categorías, Entradas y Páginas Algunas etiquetas que se usan frecuentemente en las Entradas (y demás):   <?php the_permalink() ?> Muestra el enlace permanente del post. <?php the_title(); ?> Muestra el título del post. <?php the_time(’F jS, Y’) ?> Muestra la fecha. Puedes encontrar los distintos formatos. <?php the_author() ?> Muestra el nombre del autor. <?php the_tags(’Tags: ‘, ‘, ‘, ‘<br />’); ?> Muestra las etiquetas (tags) asignadas al post, separadas por comas y seguidas por un salto de línea. <?php the_category(’, ‘) ?> Muestra las categorías igual que en el caso anterior de las etiquetas.
  15. 15. Categorías, Entradas y Páginas Páginas:   Las Páginas son como las Entradas, excepto que pueden hacer mucho más que las Entradas, y viven fuera de la cronología normal del blog. Se puede usar Páginas para organizar y manejar cualquier cantidad de contenido. Esta belleza fue implementada recién en la versión 1.5 de WP y permite hacer maravillas. ¿Pero cómo funcionan en realidad las Páginas en WordPress? El objetivo de este documento es intentar explicar lo que es una Página y lo que no es, describir lo que una Página puede hacer, y ofrecer algunos ejemplos. ================ Aclaración: Las Páginas NO son entradas, ni extractos. No hacen el ciclo por la página principal del sitio web (blog) y no pueden ser asociadas con las Categorías.
  16. 16. Conociendo el Mundo de WordPress INSTALACIÓN Y PERSONALIZACIÓN DE PLUGINS
  17. 17. Conociendo el Mundo de WordPress ESTRUCTURA DE UNA PLANTILLA
  18. 18. Estructura de una Plantilla Ficheros que componen una Plantilla:
  19. 19. Estructura de una Plantilla Sobre el index.php: El directorio de la plantilla se debe situar en el directorio /wp-content/themes de tu WordPress. El fichero principal, o punto de entrada en una plantilla es el fichero index.php , desde este fichero se cargará el header, el sidebar y el footer. Para llamar al resto de los archivos se van a utilizar las funciones: <?php get_header(); ?> <?php get_sidebar(); ?> <?php get_footer(); ?>
  20. 20. Estructura de una Plantilla Sobre el single.php: En el caso en que se muestre una entrada en concreto, en lugar de la página principal, nuestro punto de entrada en la plantilla sera el fichero single.php.   Desde single.php cargaremos el header y el sidebar de igual forma que desde index.php, pero además cargaremos también los comentarios y algunas cosas más que hay que tener en cuenta cuando se carga una entrada. En caso de que carguemos entradas de archivo nuestro punto principal será el fichero archives.php.
  21. 21. Estructura de una Plantilla Sobre el style.css: Esto tiene que estar en el comienzo del style.css /* Theme Name: Nombre de la Plantilla Theme URI: http://www.proyectosenior.net Description: Tema de prueba para la clase de WP, esta descripción es sublime. Author: Nombre del Autor Author URI: http://www.dominio.com.ar/ */   ===========   Aclaración: El archivo style.php es fundamental y debe llamarse así ya que la función de WP se limita a style.php y no a &quot;mi_estilo.php&quot;. En caso de querer usar otros archivos .css se tiene que usar @import url(&quot;mi_estilo.css&quot;);
  22. 22. Estructura de una Plantilla Sobre el sidebar.php: El sidebar se almacena en el fichero sidebar.php, y en el mostraremos las categorías, los archivos de la página por meses, los enlaces, tags, etc. Todo esto será lo que se muestre por defecto en nuestra plantilla, pero se puede retocar para que tenga contenido dinámico mediante widgets y la persona a cargo no tenga que estar modificando el sidebar.php específicamente.   if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_right') )     [aca va el contenido estático] <?php endif; ?> ¿Que se supone que hace esto? Comprobamos si nuestro WP esta preparado para widgets y si además hay algun widget en el sidebar_right, en caso de haberlo, se cargaran los widgets, pero si no hay widgets, se cargará el contenido estático que vamos a ver a continuación.   =========== Aclaración: si nosotros ponemos tan solo 1 widget, pisamos todo el resto estático que esta entro de sidebar.php.
  23. 23. Estructura de una Plantilla
  24. 24. Estructura de una Plantilla Sobre el header.php: <title>     <?php bloginfo('name'); ?> <?php wp_title(); ?> </title> La función <?php wp_title ?> nos brinda la sección en la que estamos, mientras que la función <?php bloginfo('name'); ?> nos da el título del Sitio Web.   <meta name=&quot;generator&quot; content=&quot;WordPress <?php bloginfo('version'); ?>&quot; /> Esta etiqueta puede ser usada o no, yo recomiendo no utilizarla para que nadie sepa que versión de WP usamos y así evitar posibles problemas.   Enlazamos a la hoja de estilos mediante la función bloginfo(‘stylesheet_url’) , también enlazamos al feed, para que el navegador pueda accederlo desde el icono de la barra de direcciones, para ello usamos la función bloginfo(‘rss2_url’) . Para llamar a otros archivos (img, .js, etc) vamos a tener que utilizar la función <?php bloginfo('template_url');?> hacer crear rutas dinámicas y que nuestro theme sea 100% flexible y sea posible reutilizarlo a futuro. ===========
  25. 25. Estructura de una Plantilla
  26. 26. Estructura de una Plantilla Sobre el page.php: Para poder levantar la información que hay en una página, se tiene que poner la misma estructura de cuando se quiere mostrar una entrada: <?php if (have_posts()) : while (have_posts()) : the_post();?>     [ACA VA EL CONTENIDO] <?php endwhile; endif; ?>   ===========
  27. 27. Estructura de una Plantilla Múltiples archivos page.php: Para crear diferentes archivos  page.php  tenemos que crear otro archivo, por ejemplo  page-ejemplo.php  y dentro al comienzo del archivo poner: <?php  /* Template Name: Pagina de Ejemplo */  ?> Para seleccionar nuestra plantilla personalizada, hay que ir a la página creada y asignarle la que queremos. Esto es muy beneficioso si tenemos páginas estáticas con diferente diseño, como por ejemplo sin una barra lateral, etc.   ===========
  28. 28. Estructura de una Plantilla ¿Donde esta la diferencia entre index.php y page.php?: Ambos archivos utilizan un loop para levantar la información y son exactamente iguales, el truco esta en la jerarquización de archivos. WordPress automáticamente al detectar que una pagina se quiere mostrar, busca en el directorio el archivo page.php, si no encuentra ninguno, sigue por los archivos page.php personalizados y si no encuentra ninguno, llama directamente al archivo index.php. Para más información sobre Jerarquización ver el Codex de WP . ===========
  29. 29. Estructura de una Plantilla Otros archivos: Por ejemplo, si le pinchamos sobre una categoría para ver los posts de la misma, el fichero que se cargará será archives.php , lo mismo con los archivos por mes , día y año. También esta el fichero search.php , que lo utilizaremos como plantilla para las búsquedas que se realicen en el Blog. El fichero comments.php donde cargaremos los comentarios. El fichero 404.php sirve para enviar una salida personalizada de error 404 cuando alguien haga una petición al servidor que genere un error 404. Las imágenes las almacenaremos en el directorio img.
  30. 30. Estructura de una Plantilla Otros archivos: En screenshot.jpg guardaremos un thumbnail (miniatura) de nuestra plantilla terminada y que se mostrara en el panel de administración del WordPress. Por último tenemos el fichero funtions.php , que básicamente actúa como un plugin… si el fichero existe, se carga automáticamente durante la inicialización de WordPress. Lo podemos usar como fichero donde declarar funciones que vayamos a usar después en la plantilla. =========== Experiencia Personal: El uso del functions.php puede ser una bendición si lo utilizamos correctamente, pero muchas veces puede que salgan múltiples errores si usamos diferentes funciones que se pisen entre sí a la hora de mostrarse en el Sitio.
  31. 31. Estructura de una Plantilla La Barra de Navegación (menú): El menú de nuestro sitio web es una parte esencial y tenemos que darle un giro para que sea dinámico. En nuestro menú se van a cargar las diferentes Pages (pages.php) que vayamos creando. Para llamar a la función que permite obtener las Pages hay que usar: <?php wp_list_pages(‘depth=1&title_li=’); ?> En caso de querer filtrar algunas secciones podríamos retocar el código y usar: <?php wp_list_pages(‘title_li=&depth=1&exclude=6,4′); ?> =========== Aclaración: en caso de tener un menú que utilice imágenes y/o posicionamiento, hay que implementar condicionales en el navbar, para eso hay que ver cada caso en particular y leerse el Codex de WP . (comentar en clase los pro y contra de un menú dinámico)
  32. 32. Estructura de una Plantilla Generando archivos personalizados: Si se generan archivos externos a la estructura base, como por ejemplo sidebar2.php, footer-especial.php, header-solo-php vamos a tener que utilizar la función include de PHP pero con unos detalles a tener en cuenta: <?php include (TEMPLATEPATH . '/ejemplo.php'); ?> El parámetro &quot;TEMPLATEPATH&quot; sirve para insertar dinámicamente la ruta de nuestra plantilla, nosotros podríamos poner a mano la ruta, pero si queremos reutilizar a futuro nuestra plantilla en otro sitio web (dominio) no nos va a servir.
  33. 33. Estructura de una Plantilla <ul><li>Tags de WordPress: </li></ul><ul><li>Son llamadas que se utilizan en la plantilla del Sitio Web, para mostrar información de forma dinámica. Casi todas son personalizables para que uno puedan generar diferentes resultados. Hay de tipo: </li></ul><ul><ul><li>Generales </li></ul></ul><ul><ul><li>Autor </li></ul></ul><ul><ul><li>Categorías </li></ul></ul><ul><ul><li>Comentario </li></ul></ul><ul><ul><li>Entradas </li></ul></ul><ul><li>Para mas información en detalle sobre cada una visitar el Codex de WP . </li></ul>
  34. 34. Conociendo el Mundo de WordPress HOJA DE AYUDA
  35. 35. Hoja de ayuda Hoja de Ayuda para WP: Es muy común olvidarse algún snippet / funciones de WordPress por lo tanto es recomendable tenerlos a mano a la hora de desarrollar una plantilla.   Link para Descargar
  36. 36. Conociendo el Mundo de WordPress CONSIDERACIONES CUANDO SE REALIZA UNA PLANTILLA
  37. 37. Consideraciones cuando se realiza una plantilla <ul><li>Para tener en cuenta: </li></ul><ul><ul><li>Cuando el sitio no tiene una sección de noticias/novedades (blog) el sitio es mas un CMS que otra cosa, es por eso que hay que definir bien que archivos se van a utilizar y cuales no, por ejemplo los comments.php y archive.php no se usarían. </li></ul></ul><ul><ul><li>Hacer dinámicas y flexibles todas las rutas. (¡Utilicen las funciones de WP!) </li></ul></ul><ul><ul><li>No dejar contenido estático en el back-end y que a futuro traiga problemas en el frond-end. </li></ul></ul><ul><ul><li>Realizar comentarios en la estructura del sitio web, especialmente si a futuro se le van a hacer modificaciones. </li></ul></ul><ul><ul><li>Comentar absolutamente todo el archivo functions.php para que sea mas fácil editarlo a futuro si se utilizan muchas funciones. </li></ul></ul><ul><ul><li>Saber cuando utilizar  <?php include (TEMPLATEPATH . '/ejemplo.php'); ?> </li></ul></ul>
  38. 38. Conociendo el Mundo de WordPress XHTML A WORDPRESS
  39. 39. XHTML a WordPress Pasos a seguir: 1) Tener la estructura del WP realizada (con todos los archivos que se necesiten según el caso).   2) Comentar el código XHTML con el &quot;comienzo y fin&quot; de cada parte (contenedor, encabezado, contenido, lateral, pie, etc). Esto sirve mucho para acelerar el proceso de &quot;corte&quot; y que no tengamos divs abiertos sin cerrar. 3) Pegar cada bloque de código en su respectivo archivo. Por ejemplo: todo el pie de página en el footer.php, el encabezado y el menu en el header.php, etc. 4) Llamar a las respectivas funciones de Wordpress (get_footer, get_sidebar, etc) en los archivos base, como index.php, page.php, single.php 5) Remplazar toda linea estática por dinámica (funciones base de Wordpress), como en el tittle del Sitio Web, hoja de estilo, archivos .js, etc. 6) Subir la plantilla finalizada, habilitarla y comenzar a realizar las pruebas (dolores de cabeza). ===========
  40. 40. Conociendo el Mundo de WordPress CONSEJOS PARA WORDPRESS
  41. 41. Consejos para Wordpress <ul><ul><li>Borrar los archivos wp-install.php, wp-upgrade.php </li></ul></ul><ul><ul><li>Bloquear el listado de archivos de los directorios clave, como wp-content, específicamente el de los plugins </li></ul></ul><ul><ul><li>Si se puede dejar de lado un plugin, hacerlo y optar por la filosofía “ Without a plugin ” para evitar vulnerabilidades y compatibilidad a futuro. </li></ul></ul><ul><ul><li>Actualizar siempre WordPress y tener presente que el diseño/plugins pueden sufrir cambios de incompatibilidad. </li></ul></ul><ul><ul><li>Realizar full-backups frecuentes y de manera manual de ser posible (no confiar en plugins) </li></ul></ul><ul><ul><li>Desactivar el registro de usuarios si no se lo va a utilizar. </li></ul></ul><ul><ul><li>Borrar el usuario admin base que se genera al instalar el WP. </li></ul></ul>

×