Sesión 5 Curso Avanzado SPIPEDU

50 %
50 %
Information about Sesión 5 Curso Avanzado SPIPEDU
Education

Published on February 25, 2009

Author: pedrojimenez

Source: slideshare.net

Description

Última sesión repaso de las 4 anteriores. Esta presentación puede serviros para imprimir y seguir con el trabajo no presencial

PROFUNDIZACIÓN AL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es QUINTA SESIÓN – 24 FEBRERO 2009 – CEP Alcalá de Guadaira 1. Esquema de supervivenvia para un SPIPEUR 2. Un paseo por la web 2.0 - Servicios avanzados de Google - Youtube – Dailymotion & Slideshare - Flickr o Picasa - Twitter - Facebook y Tuenti hapaxmedia.net / licencia creative commons BY ES 2.5 /

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es 1. ESQUEMA DE SUPERVIVENCIA DE UN SPIPEUR - Si eres usuario avanzado puedes llamarte SPIPEUR o SPIPERO - Este esquema no es más que un resumen de todo lo anterior. NUESTROS LENGUAJES: COSAS QUE PODEMOS HACER - Lenguaje HTML - Lenguaje CSS - Modificar la hoja de estilos - Lenguaje SPIP - Retocar la estructura visual NUESTRAS HERRAMIENTAS: - Aplicar mejoras y nuevas funciones - Editor online Esqueletos - Extensión Firebug - Instalar plugin o mejoras - www.spip.net/@ - alcala@hapaxmedia.net - Incluir servicios externos

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es EDITAR ESQUELETOS La edición de esqueletos es un PLUGIN activado en el MODELO 1 y MODELO 2 Permite que modifiquemos sustancialmente el diseño de nuestra página web. IMPORTANTE Sólo se recomienda el uso de este con conocimientos de · Sintaxis HTML · Sintaxis SPIP http://spip.net/@ · Sintaxis CSS 1. Edición del sitio 2. Botón Editar Esqueleto 3. Elegir Archivo a editar Manual de HTML http://www.desarrolloweb.com/manuales/21/

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es EDITAR ESQUELETOS 4. Modificar el lenguaje HTML o CSS o Modificar los Bucles de SPIP http://spip.net/@ - Se puede descargar el Archivo y editar con NVU - Se puede editar directamente el código 5. Guardar Modificaciones

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es EDITAR ESQUELETOS MODELO 1 Visualización de página no existe. Control de la agenda Cómo se ve el artículo Plantilla del Blog Plantilla del Artículo en la sección Blog Cabecera. Aunque la imagen de la cabecera se controla en la parte interna Comentarios

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es EDITAR ESQUELETOS MODELO 1 Menú de la columna derecha Menú de la columna derecha en la sección blogs Menú de Inicio de la columna derecha Menú de la columna izquierda Visualización de contenidos de las palabras clave. Pie Hoja de Estilo principal Página principal del sitio web. La portada de la página

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es EDITAR ESQUELETOS MODELO 2 Menú de la columna derecha - barra_lateral.html Barra Horizontal debajo de la cabecera Página principal del sitio web. La portada de la página

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es ETIQUETAS BÁSICAS DE LENGUAJE HTML * <html>: define el inicio del documento HTML, * <head>: define la cabecera del documento HTML * <title>: define el título de la página. * <link>: para vincular el sitio a hojas de estilo o icono * <style>: para colocar el estilo interno de la página * <body>: define el contenido principal o cuerpo del documento * <strong>: texto en negrita * <em>: texto en cursiva * <u>: texto subrayado * <h1>, <h2>, <h3>, <h4>, <h5>, <h6>: encabezados o títulos del documento CASI TODAS LAS ETIQUETAS SE CIERRA CON LA BARRA </ etiqueta >

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es

INTRODUCCIÓN AL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es CSS (Cascading Style Sheets) 3 maneras de incluir estilos: - inline: <input style=”border:1px solid black;” type=”text”> - etiqueta: <head> ... <style> border: 1px solid black; </style> … </head> - archivo .css: input { border: 1px solid black; } Sintaxis: selector { Selector: sobre que elementos queremos trabajar Atributo: identifica a que estilo nos referimos atributo: valor; Valor: como queremos que sea el atributo }

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es LENGUAJE PROPIO DE SPIP - Siempre escrito en mayúsculas - Balizas (balises), bucles (boucles), criterios (critères) y filtros (filtres) 2.1 BALIZAS - # (almohadilla) + palabra en francés - Ejemplo: #URL_SITE_SPIP escribe la dirección web del sitio. - Las más importantes: #TITRE escribe el título del artículo, sección, palabra clave... #TEXTE escribe el texto del artículo, sección, palabra clave... #LOGO_ARTICLE muestra el logotipo del artículo #LOGO_RUBRIQUE muestra el logo de la sección #URL_ARTICLE escribe la dirección web de un artículo #DESCRIPTIF escribe la descripción corta de un artículo #DATE escribe la fecha del artículo

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es 2.2 BUCLES - Sintaxis completa: <B_nombre> Código HTML opcional anterior “Esta sección contiene los elementos siguientes:” <BOUCLE_nombre(TYPE){criterio1}{criterio2}...{criteriox}> Código HTML + balizas SPIP </BOUCLE_nombre> - Sintaxis simple: Código HTML opcional posterior <BOUCLE_nombre(TYPE){criterio1}{criteriox}> </B_nombre> Código HTML + balizas Código HTML alternativo “Esta sección no contiene artículos.” </BOUCLE_nombre> <//B_nombre>

PROFUNDIZACIÓN DEL MANEJO DE SITIOS WEB DINÁMICOS http://www.spipedu.es

#titre presentations

Add a comment

Related presentations

Related pages

Sesión 5 Curso Avanzado SPIPEDU - Education

Download Sesión 5 Curso Avanzado SPIPEDU. Transcript. QUINTA SESIà N â 24 FEBRERO 2009 â CEP Alcalá de Guadaira 1.
Read more

Curso SPIPEDU. Profundización en la gestión del sitio web ...

Sesión 5 Curso Avanzado SPIPEDU ... Sesion4 curso avanzado SPIPEDU ... En esta segunda sesión de SPIPEDU hemos avanzado en uno de los contenidos básicos ...
Read more

Curso SPIPEDU avanzado - 10 Febrero - Education

Download Curso SPIPEDU avanzado ... ContenidosDinámicos 4.Glosariode SPIP yModelosde SPIPEDU 5. ... Sesión 5 Curso Avanzado SPIPEDU
Read more

www.spipedu

QUINTA SESIÓN – 24 FEBRERO 2009 ... hapaxmedia.net / licencia creative commons BY ES 2.5 / 1. ... - Si eres usuario avanzado puedes llamarte SPIPEUR o ...
Read more

Curso SPIPEDU avanzado - 10 Febrero - Education

Home; Education; Curso SPIPEDU avanzado - 10 Febrero; Curso SPIPEDU avanzado - 10 Febrero Jul 26, 2015 Education comcinco
Read more