tutorial%20web borrador

13
TUTORIAL DA WEB Tutorial para o uso da Web: cxabeiro.org Última modificación 21/10/2013 Contacto: [email protected] EQUIPO DE INFORMÁTICA

Upload: centro-xuvenil-abeiro

Post on 25-Jul-2016

251 views

Category:

Documents


5 download

DESCRIPTION

http://cxabeiro.org/extradata/Tutorial%20web_borrador.pdf

TRANSCRIPT

Page 1: Tutorial%20web borrador

TUTORIAL DA WEB

Tutorial para o uso da Web:

cxabeiro.org

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 2: Tutorial%20web borrador

TUTORIAL DA WEB

Índice1. Os Usuarios......................................................................................................................................32.- Crear unha nova..............................................................................................................................4

1.- Acceder co teu usuario:..............................................................................................................42.- Crear a nova:...............................................................................................................................4

Como inserir unha imaxe nunha nova.........................................................................................5Como inserir unha imaxe co efecto Lightbox nunha nova.........................................................5Como inserir un vídeo nunha nova.............................................................................................6

3.- Publicar a nova:..........................................................................................................................6Outras utilidades no editor de artigos:.............................................................................................7

3.- Subir fotos á galería........................................................................................................................8Engadir un álbum...........................................................................................................................10

4.- Engadir o calendario de Abeiro nun gCalendar.............................................................................115.- Anotarse na Sala Aberta................................................................................................................12

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 3: Tutorial%20web borrador

TUTORIAL DA WEB

1. Os Usuarios

Para entender o funcionamento da web e dalgúns pasos deste tutorial conven aclarar antes e brevemente como funcionan os usuarios.

A páxina de Abeiro está pensada para que a partir do usuario que a esté vendo se mostren certos contidos. No caso concreto desta páxina están organizado xerárquicamente de modo que cada tipo de usuario ten os mesmos poderes que o do tipo anterior mais os propios para él.

Os tipos de usarios da web son:

Público: son usuarios sen loguearse, só teñen permiso para ver os contidos públicos da web

Rexistrado: non se emprega actualmente, pero pode que nun futuro haxa contidos só para persoas rexistradas

Animador: son os usuarios dos animadores do Centro, poden crear artigos e engadir enlaces de interés. Ademais poden ver seccións ocultas ao público.

Agrupación: son usuarios das distintas agrupacións do centro, poden, a maiores que os animadores,engadir eventos ao calendario (para isto a maiores se necesita unha conta de google) subir arquivos á sección de descargas, acceder ao sistema de listas de correos e subir fotos á galeria.

Administrador: son os que teñen acceso á administración da web e teñen todos os poderes sobre ela, xD

Obviamente para poder usar estes poderes hai que loguearse na web.

With great power comes great responsibility

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 4: Tutorial%20web borrador

TUTORIAL DA WEB

2.- Crear unha nova.

Publicar unha nova na web de Abeiro é fácil, só hai que seguir estes tres pasos:

1.- Acceder co teu usuario:

Na barra superior da web fai clic en Conexión e despregarase o formulario de acceso e rexistro deusuarios,

Unha vez accedes como usuario aparecerá no lado dereito unha nova sección chamada "MENÚUSUARIO" no que a lista de opcións dispoñibles que aparecerá será en función do tipo de usuarioco que se acceda.

2.- Crear a nova:

No MENÚ USUARIO accede a CrearArtigo e aparecerá a páxina de edición dunartigo.

Esta páxina divídese nas seguintesseccións:

– Editor– Publicación– Idioma– Metadatos

Aquí só nos interesa a sección Editor naque temos os seguintes campos:

– Título: onde se escribe o título que se lle queira dar á nova– Categoría: este campo déixase en branco– Recadro de edición: onde se introduce o texto, dáselle formato e inclúese os contidos

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 5: Tutorial%20web borrador

TUTORIAL DA WEB

(imaxes, vídeos, enlaces, etc.)

Como redactar e/ou editar o texto é totalmente intuitivo, así que centrarémonos mellor agora encomo darlle outro tipo de contidos á nova.

Como inserir unha imaxe nunha nova

– Debaixo do recadro de edición, fai clic en Image e aparecerá a seguinte páxina dendeonde se poderá inserir a imaxe en función dunha das seguintes opcións:

– Se a imaxe atópase xa noservidor: vai ata a carpeta ondese atope a imaxe, selecciónalae comprobando que apareza adirección URL no campo URLda imaxe dáslle a Inserir arribaá dereita.

– Se a imaxe está noutra web: nocampo URL da imaxeintroduce directamente adirección da imaxe e dálle aInserir.

– Se a imaxeatópase no teu equipo: o primeiro é seleccionar a carpeta onde se gardará aimaxe (simplemente indo ata dita carpeta). A continuación na sección Subirficheiros (abaixo de todo) selecciónase a imaxe, faise clic en Comezar subidae unha vez estea subida a imaxe aparecerá enriba. Finalmente selecciona aimaxe e comprobando que apareza a dirección URL no campo URL da imaxedálle a Inserir.

As carpetas do servidor onde se gardan as imaxes para as novas son as seguintes:

– carteisactividade: aquí gárdanse os carteis das actividades– imaxesabeiro: aquí gárdanse as imaxes que se usan habitualmente no CX, son

básicamente os logotipos.– novasweb: caixón de xastre, aquí gárdanse as que non teñen cabida en outra

carpeta.

– Para editar a imaxe: selecciona a imaxe no recadro de edición e dálle clic aobotón que hai xusto arriba co debuxo dunha árbore. Na xanela que aparece podesindicar a aliñación e as dimensións da imaxe, o resto de opcións son para afinarmais en profundidade a presentación da imaxe.

Como inserir unha imaxe co efecto Lightbox nunha nova

O efecto Lightbox consiste en que ao facer clic na miniatura dunha imaxe, esta presentase

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 6: Tutorial%20web borrador

TUTORIAL DA WEB

automaticamente por riba da páxina centrada e cunha sombra ao redor dela que cubre o resto dapantalla.

Para facer isto tan só tes que copiar e pegar no recadro de edición o seguinte texto

{source}

<p style="text-align:right">

<a data-lightbox="title:titulo;" href="http://fedboscogal.org/images/stories/galerias/ADS11//P7220533.jpg"> <img src="http://fedboscogal.org/images/stories/galerias/ADS11//P7220533.jpg" width="180" height="124"></a>

</p>

{/source}

modificando os seguintes parámetros:

– En <p style="text-align:right"> pon right por right, left ou center según queiras que aminiatura da imaxe apareza na dereita, esquerda ou no centro da nova.

– En data-lightbox="title:titulo;" modifica titulo polo titulo da imaxe que queiras que semostre (se non queres mostrar titulo deixa "" en branco)

– En href="http://... mais en src="http://... cambia o que hai entre "" pola dirección URL daimaxe que queiras mostrar.

– En width="180" height="124" substitue 180 e 124 polo ancho e alto da miniatura da imaxe.

Truco para obter a dirección URL dunha imaxe que xa está no servidor ou que se quere subir dendeun equipo:

Seguindo os mesmos pasos que se explicaron no apartado anterior para cada un deses casos,xusto no instante antes de darlle a inserir en ambos casos, tes a dirección URL da imaxe quequeres no campo URL da imaxe.

Como inserir un vídeo nunha nova

Se se quere inserir un vídeo ou arquivo multimedia no artigo o mellor é poñerse en contacto co equipo de informática. Pois para subir vídeos e cancións á web só poden facelo eles.

NOTA: O ANCHO (WIDTH) MÁXIMO QUE SE LLE DEBE DAR A UNHA IMAXE NUNHA NOVA É DE 450(PIXELES)

3.- Publicar a nova:

Antes de rematar hai que completar os campos da sección Publicación:

– Categoría: (obrigatorio) aquí selecciónase entre as opcións do despregable a categoría quelle corresponda á nova. IMPORTANTE: a categoría ten que ser unha das subcategorías dacategoría Novas, estas son aquelas que aparecen inmediatamente despois de "Novas" eveñen precedidas dun '-' ou '- -'

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 7: Tutorial%20web borrador

TUTORIAL DA WEB

– Alcume do autor: nome do autor que queiras que apareza. Como xa aparecerá o do usuario,non fai falta poñer nada.

– Estado: ten que poñer publicado.– Featured: aquí indica si é unha nova destacada ou non.– Comezo e fin da publicación: útil se queres crear unha nova e que apareza na web a partir

dun determinado día, ou se queres tamén que deixe de estar publicada a partir dunha datadeterminada.

– Acceso: aquí seleccionas que tipos de usuarios poderán ver a nova.

O resto das seccións déixanse tal e como están e podes rematar dándolle a Gardar.

Outras utilidades no editor de artigos:

Hai unhas opcións que aparecen na páxina de edición de artigos que acompañan ao botón Imageque xa comentamos anteriormente aquí que aínda non se explicaron:

• Insert Code <>: Serve para introducir pedazos de código HTML, Javascript ou PHP noartigo e facer edicións avanzadas nos artigos. Conséguese a mesma función introducindo asetiquetas {source} e {/source} ao principio e ao final do código que se queira introducir.

• Article: serve para incluír unha referencia, ou un enlace, a un artigo que xa existe na web.Tan simple como facer clic no botón e seleccionar o artigo entre a lista que aparecerá contodos os artigos xa existentes.

• Quebra de páxina: o autor do tutorial descoñece a súa finalidade.• Read More: Serve para acortar a presentación do artigo. Por exemplo, se o artigo é moi

longo e non queres que ocupe todo o espazo que necesita cando se mostra na páxinaprincipal da web, poñendo a liña discontinua do editor no sitio a partir do cal queres que secorte a presentación, ao darlle ao botón de Read More aparecerá unha liña vermelladescontinua que dividirá o artigo en 2 anacos. Ao publicar o artigo verase só o que hai antesde dita liña e no lugar desta aparecerá un Ler máis >> que non é nada mais que un enlace aoartigo completo.

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 8: Tutorial%20web borrador

TUTORIAL DA WEB

3.- Subir fotos á galería

Para acceder á páxina da galería hai dúas opcións, unha é loguearse na páxina principal e no Menú de Usuario darlle a Subir fotos e a outra é acceder directamente á dirección www.galeria.cxabeiro.org

Por ambos camiños deberías chegar a ver a seguinte páxina:

A organización básica dos albumes é a seguinte:

O Noso Centro

Cursos anterioresTardes Abertas

Agrupacións Andaina

ADS

Principal Catecumenado

Animadores/as

Curso actual Conxuntas

Cafés Concertos

Campamento UrbanoPara engadir fotos diríxete ata o álbum correspondente.

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 9: Tutorial%20web borrador

TUTORIAL DA WEB

Unha vez alí fai clic no botón Show Options que hai na barra superior.

Na barra que se acaba de despregar fai clic en entrar.

E logueate co usuario agrupación (o nome e contrasinal é o mesmo que o empregado na web)

Agora no barra despregable aparecerá o menú de opcións do usuario:

Ao facer clic en Añadir aparecerá o seguinte menú:

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 10: Tutorial%20web borrador

TUTORIAL DA WEB

Neste menú preme engadir fotos e na ventá seguinte preme en Selecciona las fotos... selecciona as fotos que queres subir e dálle a OK.

Cando remate a subida dálle a Hecho e xa estarán as fotos subidas á galería.

Engadir un álbum

Se queres crear un novo álbum segue os mesmos pasos descritos para engadir fotos, sitúate no álbum/carpeta onde queres gardar o novo, logueate e no paso de engadir fotos simplemente dálle a Añadir un álbum.

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 11: Tutorial%20web borrador

TUTORIAL DA WEB

4.- Engadir o calendario de Abeiro nun gCalendar

Accede ao teu calendario de google (www.google.com/calendar) e na columna esquerda, na sección"Otros Calendarios", fai clic en "añadir calendario de un amigo"

Escribe redessociaisabeiro e dalle a intro.

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 12: Tutorial%20web borrador

TUTORIAL DA WEB

5.- Anotarse na Sala Aberta

Para anotarse de forma online na táboa da Sala Aberta son necesarios 2 requisitos e levar a cabo tan só 4 rápidos e sinxelos pasos:

Requisitos:

• Estar rexistrado na páxina web

• Ser Usuario Animador1

Os 4 rápidos e sinxelos pasos:

1. Loguearse na páxina web

2. No menú O RINCÓN DO/A ANIMADOR/A facer clic en SALA ABERTA

3. Na nova páxina que aparece buscar o día no que se queiraanotar e facer clic.

4. Cubrir os campos que se piden na ficha que aparece e dallea Crear Reserva

1 Como sei se son Usuario Animador ou non? Se tras loguearte correctamente na páxina web non che aparece ao ladoesquerdo desta un menú chamado O RINCÓN DO/A ANIMADOR/A teño malas novas para ti... Se precisas ser usuario animador ponte en contacto cos informátcos en [email protected]

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA

Page 13: Tutorial%20web borrador

TUTORIAL DA WEB

Este tutorial está incompleto, aínda así o Equipo de Informática de Abeiro espera quefose de utilidade e que respondese as súas dúbidas. Para calquera suxestión, pregunta

ou comentario estamos en [email protected]

Última modificación 21/10/2013 Contacto: [email protected]

EQUIPO DE INFORMÁTICA