Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación...

18
Editar mi sitio web con Wordpress Para la Fundación Sumaj Huasi Presentado por Patricia Charest Mugwaneza, Septiembre 2012

Transcript of Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación...

Page 1: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

Editar mi sitio web con Wordpress Para la Fundación Sumaj Huasi Presentado por Patricia Charest Mugwaneza, Septiembre 2012

Page 2: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

2

Tabla de contenidos TABLA DE CONTENIDOS ........................................................................................................................ 2 1. ACCEDER AL GESTOR DE WORDPRESS ....................................................................................... 3 2. PUBLICANDO CONTENIDO ................................................................................................................ 3

2.1. Publicar una entrada ................................................................................................. 3 2.1.1 Para publicar una nueva entrada: ................................................................................ 3

2.1.2 Para modificar una entrada: ................................................................................... 5 2.2. Publicar una pagina .................................................................................................. 5 2.3. Editar el menú de navegación del sitio web ............................................................. 6 2.4. Añadir medios al sitio web ...................................................................................... 9 2.5. Añadir un documento a la página Documentos (submenú de publicaciones) ....... 10

3. MODIFICAR LAS HERRAMIENTAS DE LA BARRA LATERAL DEL SITIO WEB ................ 14 3.1. Modificar el contenido de la barra lateral .............................................................. 16

4. RECURSOS INTERACTIVOS DE WORDPRESS ............................................................................ 17 5. ¿OTRAS PREGUNTAS? ....................................................................................................................... 17

Page 3: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

3

1. Acceder al gestor de Wordpress Se puede acceder al editor de tu sitio web WordPress a través de la siguiente dirección:

http://www.sumaj.org/wp-admin En el formulario que aparece tienes que introducir tu nombre de usuario y contraseña que son: Nombre de usuario = admin Contraseña = 2007200705

2. Publicando contenido WordPress ofrece diferentes maneras de publicar contenido en su sitio web, ya sea mediante ENTRADAS o PÁGINAS: a. Entradas: Es contenido sensitivo a fechas y se muestra en orden cronológico inverso, es decir, el más reciente aparece el primero. Se le pueden asignar categorías y son parte del archivo del “blog” o del sitio web. b. Páginas: Son contenidos que se pueden acceder mediante enlaces o mediante el menú principal del sitio web.

2.1. Publicar una entrada Cada entrada corresponde a una noticia del sitio web, y va a aparecer en la sección NOTICIAS del sitio web en orden cronológico inverso. Los títulos de las últimas entradas aparecerán también en la barra lateral a la derecha de algunas páginas del sitio web.

2.1.1 Publicar una nueva entrada: 1) En el panel de administración (Escritorio), hay que seleccionar Entradas (a la izquierda). 2) En el submenú de Entradas, seleccionar Añadir nueva 3) Aparece un espacio donde es posible redactar mediante un editor que tiene varias funciones 4) Elige un titulo eficaz en el espacio TITULO 5) Entra el texto de la noticia en el espacio ENTRADA.

Page 4: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

4

Los botones de la barra de herramientas permiten editar el texto aparecen así:

El editor tiene dos pestañas principales: Visual y HTML. Asegúrate que la pestaña Visual esta seleccionada, de esta manera, no verás los códigos HTML que están detrás de lo que publicas. El editor facilita el que puedas incluir los estilos del texto de una manera similar a cualquier paquete de edición de texto, como WORD. 6) Una vez que todo el texto esta escrito y las imágenes insertadas, pulsa sobre “Publicar” (al lado derecha del espacio de edición del texto) si quieres que aparezca publicado en el sitio web o “guardar borrador” si deseas mantenerlo como borrador. El sistema hace copias de seguridad de manera automática. Una vez guardado una copia-borrador, aparece la opción de “vista previa” con la que puedes comprobar cómo se verá la entrada en el sitio web antes de publicarlo. En este apartado también hay otras funciones como la de programar la publicación de la entrada para que se publique en un momento determinado. Para ello tenemos que seleccionar la opción de “editar” que se encuentra al lado de “publicar inmediatamente” para introducir la fecha deseada. También se puede controlar desde este apartado el estado de publicación de la entrada. Se puede ponerla de nuevo como Borrador o dejarlo en revisión según los que necesitas.

Page 5: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

5

2.1.2 Modificar una entrada: 1) En el panel de administración (Escritorio), hay que seleccionar Entradas a la izquierda. 2) En el submenú de Entradas, seleccionar Todas las entradas 3) Aparece la lista de todas las entradas. Debajo del título de la entrada deseada, pulsa Editar 4) Sigue las etapas 4) 5) y 6) de la sección “2.1.1 Para publicar una nueva entrada”

2.2. Publicar una nueva página El procedimiento y las herramientas para publicar una página es básicamente los mismos que para una entrada. Sólo tiene unas pequeñas diferencias. Por lo que se refiere al editor todo es exactamente igual. Las diferencias las encontramos a la hora de escribir una página, tenemos que precisar al sitio web donde ubicarla. Si no lo precisas, no va a aparecer la pagina en el sitio web. Para crear una nueva pagina 1) En el panel de administración (Escritorio), hay que seleccionar Paginas a la izquierda. 2) En el submenú de Páginas, seleccionar Añadir nueva 3) Aparece un espacio similar al espacio de edición de entrada, adonde es posible redactar el contenido de la pagina. Sigue las mismas etapas que las de “2.1. publicar una entrada” 4) Una vez publicada, hay que precisar donde ubicar la pagina. Para hacer eso, sigue las etapas de la próxima sección: “2.3. Editar el menú de navegación del sitio web”

Page 6: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

6

2.3. Añadir una imagen a una entrada o a una página Puedes añadir en una entrada algunas fotos, vídeos o audio, desde otro sitio web, desde tu propio disco duro, o desde una librería de multimedia que ya hemos subido al sitio web. 1) Entra en la entrada o en la página que quiere modificar (pulsando el botón Editar debajo de su título) 2) Haz clic en Subir/Insertar (ubicado arriba de la barra de herramientas de edición de texto)

3) Según si es una imagen que subiremos desde nuestro ordenador (pestaña Desde el ordenador) o es una imagen que se encuentra desde una URL o es una imagen que ya hemos subido al sitio web (Librería multimedia), las etapas son diferentes.

3.1) Desde su computadora a. Elije la pestaña Desde el Ordenador

b. Pulsa Eligir archivos c. Selecciona el archivo deseado en su computadora d. Una vez subida, la imagen aparecerá debajo del cargador, adonde encontrara informaciones

sobre la imagen. Llenar los campos es opcional. e. Debajo de los detalles, pulsa Insertar en la entrada.

Page 7: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

7

f. Cerrar al pop-up. Vas a ver que la imagen ya esta subida en la entrada! g. Pulsa Actualizar para guardar los cambios hechos en la entrada.

3.2) Desde una URL a. Elije la pestaña Desde una URL

b. Pegar la dirección de la imagen en el campo URL. c. Pulsa Insertar en la entrada d. Cerrar al pop-up. ¡Vas a ver que la imagen ya esta subida en la entrada! e. Pulsa Actualizar para guardar los cambios hechos en la entrada.

Page 8: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

8

3.3) Desde la librería Multimedia Es posible que la imagen que quiere insertar en su pagina o entrada ya está subida al sistema.

Entonces no es necesario subirla de nuevo (además que eso cargaría el sistema inútilmente), lo que se debe hacer es solamente identificarla en la librería electrónica del sistema. Para hacer eso, sigue los pasos siguientes:

a. Elije la pestaña Librería multimedia

b. Pulsa Mostrar para ver los detalles de la imagen que necesita. ¡Ojo! Si no se encuentra la imagen

que busca pero estas segur@ que ya la subiste, es posible que se ubica en otras “pagina de vista”. Para ver las otras imágenes, elije otras páginas.

c. Los detalles de la imagen aparecerán. d. Debajo de los detalles, pulsa Insertar en la entrada.

Page 9: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

9

e. Cerrar al pop-up. Vas a ver que la imagen ya esta subida en la entrada! f. Pulsa Actualizar para guardar los cambios hechos en la entrada.

2.4. Añadir archivos (imagen, documentos) al la librería del sitio web

Se puede subir diferentes tipos de archivo al sitio web. Los tipos de archivo permitidos son del formato: jpg, jpeg, png, gif, pdf, doc, ppt, odt, pptx, docx, pps, ppsx, xls, xlsx.

Para añadir un archivo al sitio web: 1) En el panel de administración (Escritorio), seleccionar Multimedia. 2) En el submenú de Multimedia, seleccionar Añadir nuevo 3) Sube el nuevo archivo desde su computadora. Para hacer eso, haga clic sobre “Elegir archivos” botón.

Page 10: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

10

4) Selecciona su archivo, y pulsa Subir. ¡Ya subiste el documento! Una vez subido, aparece la lista de los medios ya subidos, con el más recién arriba de la lista. Se puede Editar, Borrar o Ver cada archivo subido.

2.5. Añadir un enlace hasta un documento en una página o en una entrada

Se ha desarrollado una página en el sitio web para presentar documentos tal como informes, estudios de caso, powerpoint, etc, a los visitantes del sitio web. También, en algunos casos, es interesante proponer documentos relacionados a algunos eventos o noticias (en este caso, una entrada). En ambos casos, hay que seguir los siguientes pasos: 1) Sigue las etapas para “2.3. Añadir una imagen a una entrada o a una página” (página 6). 2) Automaticamente, se añade el título del documento con un enlace hasta este documento. Las palabras del titulo aparecen de color azul para indicar que dispone de un enlace. 3) Pulsa Actualizar o Publicar, para guardar los cambios de su entrada. ¡Ojo! No se puede probar que el enlace realmente funciona desde la pentalla de edición de la entrada. Para verificar si el enlace funciona, pulsa Vista previa y probale desde esta nueva pentalla, o Ctrl+Clic y elige Abrir Vinculo en Nueva Pentalla.

2.6. Sacar y incorporar una imagen de caratula de un documento

Hay posibilidad de agregar a la página o a la entrada una imagen de la caratula del documento para atraer más la atención. Para hacer eso, sigua los siguientes pasos: A. Obtener una imagen de caratula 1) Abre el documento o informe deseado 2) Haz una impresión de pantalla (asegurase que se ve toda la caratula del informe en tu pantalla), pulsando la tecla de su teclador IMP PNT 3) Abre tu paquete de imagen preferido, por ejemplo “Paint” 4) Haz Ctrl+V para pegar la imagen en el programa 5) Recorta la imagen como lo desea 6) Bajo Archivo, elige “Guardar como”, y guarda la imagen en formato JPG en el lugar de su elección

Page 11: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

11

B. Incorporar la imagen de caratula en la Página o entrada deseada 1) Entra en el escritorio de Wordpress, selecciona el menú PÁGINAS > Todas las páginas o ENTRADAS > Todas las entradas. 2) Pulsa Editar debajo del título de la página o de la entrada 3) Sube la imagen de la caratula en la entrada deseado, siguiendolas etapas dictadas en la sección 2.3, Desde su computadora (p.6) de este documento. 4) Redimensiona la imagen para que sea del mismo tamaño que las otras caratulas. ¡Ojo! No olvida Actualizar la página después. EN EL CASO ESPECIAL DE LA PÁGINA “DOCUMENTOS” (submenú de PUBLICACIONES del Sitio web) En esta página, aunque no se parece, la información esta organizada en una tabla. Entonces, para asegurar una presentación estética de los documentos, cuando se añade un documento, hay que integrar una nueva célula arriba de la tabla. Para hacer eso, sigue los siguientes pasos: 1) Entra en el escritorio de Wordpress, selecciona el menú PÁGINAS > Todas las páginas 2) Pulsa Editar debajo del título de la página DOCUMENTOS 3) Añade una fila arriba de la tabla. Para hacer eso, pon el cursor en la tabla, en la izquierda de la imagen.

4.2) Pulsa el botón para añadir una fila en la barra de herramienta.

4) Una vez la fila agregada, incorpora la imagen de caratula en la célula izquierda (revisar los pasos para incorporar una imagén en una entrada, p.6) y el texto en la célula derecha. Aconsejo respetar el mismo formato para los títulos:

TÍTULOS

Page 12: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

12

Autor: Fecha de publicación Enlace para descargar el documento (peso del documento)

5) Para añadir el enlace hasta el documento deseado, sigua los pasos de la sección 2.5 (p. 12).

2.7. Añadir galeria de fotos en una página o una entrada 1. Hay que entrar lo siguiente en el espacio edición de la entrada o de la página: [gallery id="000" size="project"]

2. En lugar de id="000", entra el número de id que pertenece a la entrada que detiene la galeria. 3. Haz clic sobre Actualizar para guardar los cambios. ¡Ojo! Para funcionar, la entrada identificada con id= “000” necesita tener una galeria de foto. A. Añadir una galería de foto en una entrada. 1) Entra en la entrada o en la página que quiere modificar (pulsando el botón Editar debajo de su título) 2) Haz clic en Subir/Insertar (ubicado arriba de la barra de herramientas de edición de texto)

Page 13: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

13

3) Pulsa Eligir archivos

4. Selecciona el archivo deseado en su computadora 5. Una vez subida, la imagen aparecerá debajo del cargador, adonde encontrara informaciones sobre la imagen. 6. Cierra la pantalla, pulsando el “X”. 7. Haz clic sobre el botón “ACTUALIZAR” B. Encontrar el número de “id” de una entrada 1) En el panel de administración (Escritorio), hacer clic sobre Entradas (a la izquierda). 2) En el submenú de Entradas, seleccionar Todas las entradas 3) Aparece la lista de todas las entradas. Debajo del título de la entrada deseada, poner la mano sobre el título de la entrada SIN HACER CLIC! 4) Debajo de su pantalla, aparecerá el vinculo con el nombre de ”id”

Page 14: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

14

3. Editar el menú de navegación del sitio web El menú de navegación del sitio web es totalmente editable. Se puede añadir y eliminar paginas. Para añadir páginas al menú de navegación del sitio web: 1) En el menú del panel de administración (Escritorio), hay que seleccionar Apariencia 2) En el submenú de Apariencia, seleccionar Menús

3) En el aparto Páginas, chequear la(s) página(s) deseada(s) y pulsar Añadir al menú.

Page 15: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

15

4) En el aparto hallado a la derecha, arrastrar y soltar la(s) pagina(s) donde quieres ubicarla(s).

5) Pulsar el botón Guardar menú arriba o abajo de la lista del menú. Para eliminar páginas del menú de navegación del sitio web: 1) En el menú del panel de administración (Escritorio), hay que seleccionar Apariencia 2) En el submenú de Apariencia, seleccionar Menús 3) En el cuadrado hallado a la derecha donde se encuentran la lista de las páginas del menú, pulsar el triangulo a la extremidad derecha del titulo de la página, para poder editar el elemento del menú. 4) Pulsar Eliminar 5) Pulsar el botón Guardar menú debajo de la lista del menú.

Pulsar el triangulo para abrir y ver las opciones

Page 16: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

16

4. Modificar las herramientas de la barra lateral del sitio web

4.1. Modificar el contenido de la barra lateral La mayor parte de las plantillas para sitio web tienen lo que se conoce como una barra lateral (sidebar) y se utiliza para incluir herramientas o funciones como calendario, imágenes, enlaces recomendados, últimas noticias, categorías, etc. Nota que la barra lateral va a aparecer en TODAS las páginas de tu sitio web, pero se puede eligir en cuales páginas se desea cual tipo de herramienta. Mediante lo que Wordpress llama widgets puedes añadir las herramientas que desea a la barra lateral de tu sitio web sin tener que preocuparte por modificar los códigos. a. Para manejar los widgets de tu sitio web : Pulsa sobre el enlace “Apariencia” en el panel de administración y, en el submenú, selecciona el botón “Widgets”.

- Por defecto hay una seria de widgets que se pueden utilizar y que están presentados en un enmarcados con el título “Widgets disponibles”. Esos no están activados, entonces, no aparecen en la barra lateral de su sitio web.

- Hay otro enmarcado a la derecha, con titulo: “Barra lateral 1” que lista todos los widgets activados.

Widget activados

Widget desactivado pero disponibles

Page 17: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

17

b. Para añadir un widget a la barra lateral: Hay que arrastrar y soltar el botón del widget deseado donde lo prefieras a dentro del aparato “Widgets disponibles”.

- Se puede configurar cada widget, pulsando el triangulo ubicado a la derecha de cada botón de Widget. ¡Ojo! No olvidas pulsar el botón Guardar después los cambios.

c. Para Borrar un widget: Pulsa el triangulo ubicado a la derecha del botón de Widget activado, y pulsa Borrar.

5. Recursos interactivos de Wordpress 1) Para conocer más sobre las herramientas Wordpress: http://es.wordpress.com/features/ 2) Existen los foros de ayuda de Wordpress adonde se puede encontrar las repuestas a algunos preguntas y problemas: http://es.forums.wordpress.com/ 3) Se puede añadir un nuevo tema de discusión en el foro. Para hacerlo, solo hay que abrir una sesión con el mismo nombre de usuario y contraseña que lo que tiene para el sitio web. 4) Si lees el inglés, el sitio de soporte tiene bastante repuestas a las preguntas comunes: http://en.support.wordpress.com/

6. ¿Otras preguntas? No dudes en escribirme o llamarme

Pulsar los triángulos para ver los detalles de cada widget

Para Eliminar el widget, pulsa Borrar. Si cambias de idea y quiere reactivar este widget, se ibicará en la sección de los widget disponibles.

Page 18: Editar mi sitio web con Wordpress - SumajEditar mi sitio web . con Wordpress . Para la Fundación Sumaj Huasi . Presentado por . Patricia Charest Mugwaneza, Septiembre 2012

18

Patricia Charest Mugwaneza Asesora en comunicación CECI-Uniterra [email protected] telf.: 7888 27 97