Manual de Publicacion2520DE%2520PUBLICACION.pdf · Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] Universidad Nacional de Educación a Distancia - 2 –

MANUAL DE PUBLICACIÓN EN PORTAL UNED

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] [email protected]

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected]

ÍNDICE 1. INSERTAR TEXTO EN LA PÁGINA........................................................................ 2 2. INSERTAR UN ARCHIVO EN LA PÁGINA............................................................ 6 3. INSERTAR UNA IMAGEN EN LA PÁGINA ........................................................... 9 4. ENCABEZADOS....................................................................................................... 13 5. FORMATO DE TEXTO ............................................................................................ 15 6. CÓMO INSERTAR ENLACES A OTRAS PÁGINAS ............................................ 21 7. CREAR SUBPÁGINAS............................................................................................. 30 CÓMO CREAR UN MENÚ DE NAVEGACIÓN USANDO UN PORTLET ............. 35

Universidad Nacional de Educación a Distancia


Universidad Nacional de Educación a Distancia - 2 –

1. INSERTAR TEXTO EN LA PÁGINA

1º Situarse en la página que se va a editar.

2º Pulsar en el Botón “Edición” que indica en la siguiente imagen:

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 1. INSERTAR TEXTO EN LA PÁGINA


3º Se accede al modo “Edición” donde se muestra el área de trabajo, en la siguiente

imagen la zona en rojo muestra el lugar donde se añadirá un texto de prueba, en dicha región también puede incluirse imágenes, archivos, etc.; las regiones en azul se utilizan para añadir “Portlets” que se explicará en otro manual.

4º Para añadir el texto hay que pulsar en el icono que se muestra en la siguiente imagen

(en las regiones de “portlet” no puede hacerse):



5º Se accede a una nueva pantalla donde seleccionamos el elemento que se quiera

añadir (texto):

Aceptar y añadir el texto:



NOTA: Si se edita con Internet Explorer automáticamente en la imagen anterior se muestra un editor de texto por defecto, lo mas recomendable es insertarlo usando código “HTML”, para ello recomendamos ver el manual de “HTML Básico” con las etiquetas mas comunes.

El resultado final usando “html” será más profesional que con el editor de texto de Internet Explorer. Si se utiliza “Firefox” no se muestra ningún editor. Por último se acepta y queda añadido el texto.



2. INSERTAR UN ARCHIVO EN LA PÁGINA

En el siguiente manual se explica como añadir archivos en las páginas de la UNED, dichos archivos pueden ser documentos PDF, comprimidos (zip y rar), documentos de Word, Access, Excel, etc. Como ejemplo se utilizará un documento PDF pero es valido para los demás tipos de archivo. 1. Acceder al modo edición de la página web donde se quiera añadir dicho archivo.

(Pulsar en la opción editar de la página).

2. Solamente se pueden añadir archivos en las regiones con el icono. Pulsar en

dicho icono en la región resaltada en rojo de la imagen anterior.

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 2. INSERTAR UN ARCHIVO


3. Se accede a un listado de elementos a añadir, seleccionar “archivo”:

4. La pantalla siguiente presenta varias opciones de las cuales nos interesan las que se

muestra en la imagen inferior. Son el nombre del archivo, la localización de éste en el ordenador y una descripción.

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 2. INSERTAR UN ARCHIVO


5. Al pulsar en el botón “Browse…” se muestra un navegador del ordenador para localizar el archivo que se quiere añadir.

6. Localizado el archivo se le añade el nombre y descripción y aceptamos. El resultado se muestra en la siguiente imagen.



3. INSERTAR UNA IMAGEN EN LA PÁGINA

El proceso se asemeja a insertar un archivo o elemento de texto. 1. Acceder al modo edición de la página web y pulsar en el icono.

2. En la siguiente pantalla seleccionamos el elemento imagen:

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 3. INSERTAR UNA IMAGEN


3. Como en todos los elementos se muestran una serie de opciones de las cuales hay que destacar, la localización de la imagen en nuestro equipo para subirla a portal y el mapa de imagen que permite inserta código “html” y así añadirle acciones como enlaces y la descripción (recomendable):

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 3. INSERTAR UNA IMAGEN


Antes de nada hay que localizar la imagen que se quiere subir a portal en el ordenador, para ello pulsar en “Browse …” y en la ventana nueva localizar dicha imagen.

4. Por último aceptar para ver el resultado.



4. ENCABEZADOS

Los encabezamientos condicionan la importancia del texto que les acompaña. Para que se puedan reconocer fácilmente las jerarquías ofrecemos de varios tamaños que han de insertarse siguiendo un patrón.

El código html que utilizaremos es muy simple, consta de una etiqueta de apertura <h1>y otra de cierre </h1>entre las cuales va el título deseado. El número representa la importancia o tamaño del encabezado siendo el 1 el más grande y el 5 el más pequeño.

<h1>Encabezado a mostrar</h1>

Ejemplos:

Encabezamientos <h1>no se usará

Encabezamientos <h2> títulos de documentos

Encabezamientos <h3> Subtítulos de páginas

Encabezamientos <h4> Títulos de secciones

Encabezamientos <h5> Subtítulos de sección

Hay casos en los que nos interese insertar en un recuadro o separador un título para darle más relevancia, esto es posible añadiendo a la etiqueta del encabezamiento correspondiente una clase.

Ejemplo: Encabezamiento <H3 class=separador>Encabezamiento importante </h3>

que da como resultado:

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 4. ENCABEZADOS


NOTA: El tamaño base a emplear en los encabezados es <h2> en el Título de la sección o subpágina web el cual es de color azul y alineado a la izquierda. Los subtítulos que se añadan después han de respetar la numeración decreciente <h3>, <h4> y <h5> manteniendo la homogeneidad del web.



5. FORMATO DE TEXTO

El párrafo forma la parte principal de contenido de una página web, por defecto aparece alineado a la izquierda y sin justificar.

Existen varios tipos que se pueden utilizar según las necesidades:

5.1. Párrafo s imple

Las etiquetas html que utiliza son <p> para la apertura y </p> para cerrar. Entre las dos va el texto del párrafo.

Ejemplo: <p>Este es un párrafo simple y que será el más utilizado en nuestro trabajo.</p>

Este es un párrafo simple y que será el más utilizado en nuestro trabajo. Este es un párrafo simple y que será el más utilizado en nuestro trabajo. Este es un párrafo simple y que será el más utilizado en nuestro trabajo.

5.2. Párrafo del imitado por dos l íneas:

Utiliza una clase llamada "item" que enmarca entre dos líneas horizontales el texto del párrafo. Usa una capa con clase, la etiqueta de las capas es <div> texto del párrafo </div> la clase "item" se añade a la capa del siguiente modo <div class="item"> texto del párrafo </div>

Ejemplo: <div class="item">Esto es un párrafo delimitado por dos líneas horizontales.</div>

Esto es un párrafo delimitado por dos líneas horizontales. Esto es un párrafo delimitado por dos líneas horizontales. Esto es un párrafo delimitado por dos líneas horizontales. Esto es un párrafo delimitado por dos líneas horizontales. Esto es un párrafo delimitado por dos líneas horizontales.

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 5. FORMATO DE TEXTO


5.3. Párrafo Destacado

Utiliza la clase "parrafodestacado" en la etiqueta de capa para resaltar información. La etiqueta quedaría del siguiente modo. <div class="parrafodestacado"> texto del párrafo </div>.

Ejemplo: <div class="parrafodestacado"> Esto es un párrafo destacado por ser importante.</div>

5.4. Divisores o Recuadros

Utiliza la clase "parrafoconrecuadro" en la etiqueta capa creando subdivisiones de la página. Recomendable para subelementos. Las etiquetas son <div class="parrafoconrecuadro"> texto del párrafo </div>.

Ejemplo:

<div class="parrafoconrecuadro"><h3>Titulo de la sección </h3>

<p>Esto es una subsección que además tiene un titulo <h3> al comienzo. Esto es una subsección que además tiene un titulo <h3> al comienzo. </p> </div>



5.5. Avisos destacados

Utiliza la clase "avisos" dentro de la etiqueta de capa para referirnos a los avisos importantes a destacar, uso recomendable en los menús de páginas. Las etiquetas son <div class="avisos"> texto del aviso </div>, se pueden insertar etiquetas de encabezado dentro de la de avisos para poner títulos.

Ejemplo: <div class="avisos"><h3>Aviso Destacado</h3> <p>Esto es un aviso destacado muy importante.</p> </div>.



5.6. LISTAS

Para editar con la aplicación y pode ordenar la la información se ofrecen dos tipos de listas: "Lista con viñetas" y "Lista numerada".

5.6.1. Lis ta con viñetas

Estas listas aparecen alineadas a la izquierda y con una viñeta marcando cada elemento. El código html es el siguiente: La etiqueta <ul> abre la lista y </ul> la cierra. Cada elemento de la lista va entre las etiquetas <li> y </li> como se muestra en el ejemplo siguiente.

Como quedaría en Portal:

• Elementos de la lista • Elementos de la lista • Elementos de la lista

5.6.2. Lis ta numerada

Es similar a la anterior salvo que no utiliza viñetas, enumera los subelementos. El código html es el siguiente: La etiqueta <OL> abre la lista y </OL> la cierra.



Cada elemento de la lista va entre las etiquetas <LI> y </LI> como se muestra en el ejemplo siguiente.

Como quedaría en Portal:

1. Elementos de la lista numerados 2. Elementos de la lista numerados 3. Elementos de la lista numerados



6. CÓMO INSERTAR ENLACES A OTRAS PÁGINAS

Existen dos tipos de enlaces para añadir en las páginas web:

• Enlaces de página (a las propias páginas del Portal UNED)

• Enlaces externos (a páginas fuera de la UNED) Enlaces de Página Acceder al modo edición en la página donde se quiere añadir el enlace.

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 6. AÑADIR ENLACES


En la región resaltada en rojo de la imagen anterior añadir elemento y seleccionar “enlace de página”:

Se muestra la siguiente imagen:



El enlace será a una página del propio Portal, como ejemplo se tomará la subpágina “Cómo publicar en el WebUned” que se encuentra dentro de “Ayuda” en la siguiente dirección: http://portal.uned.es/portal/page?_pageid=93,550130&_dad=portal&_schema=PORTAL IMPORTANTE: Al pulsar en el icono se accede a una nueva ventana donde hay que buscar la página a la que se quiere enlazar en forma de explorador, en el ejemplo de este manual “como publicar en el WebUned” presenta la siguiente ruta:

UNED Inicio >> Ayuda >> Cómo publicar en el WebUNED

Cada una de las páginas que se quieran enlazar tiene una ruta de navegación de portal que ayuda a la hora de localizarlas en el explorador:



Se parte de “UNED Inicio” y se pulsa en el símbolo “+” que indica la flecha, con ello se accede a todas las páginas que “cuelgan” del Inicio de la UNED, en el caso del ejemplo hay que localizar “Ayuda”.

Dentro de ayuda se encuentra la página a la que se enlazará “Cómo publicar en WebUNED” para ello. Una vez localizada hay que pulsar en la opción “Objeto de Retorno” que se encuentra a la derecha como se muestra en la imagen siguiente.



Una vez que se añade la página que se quiere enlazar, se pone el nombre para mostrar en la web (ejemplo: Cómo Publicar en WebUNED ).



El resultado es el siguiente:



Enlaces Externos El procedimiento para añadir un enlace a una página externa a la UNED es el siguiente: 1. Necesitamos la URL de la página a la cual se va a enlazar, como ejemplo la web del Ministerio de Educación que es la siguiente: http://www.mec.es/ El elemento que hay que incluir es “ URL” como muestra la siguiente imagen:

2. Se añade la URL de destino y el Nombre a mostrar:



El resultado es el siguiente:



7. CREAR SUBPÁGINAS

Acceder al modo edición en la página web donde se va a crear la subpágina:

Pulsar en el icono que muestra la flecha roja de la imagen anterior para crear la subpágina, se muestra una nueva pantalla en la que se pide una serie de características para configurar la nueva página a crear. (Ver siguiente imagen):

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] 7. CREAR SUBPÁGINAS


Una vez que se han facilitado todos los datos y se activa (IMPORTANTE) la opción “Almacenar en Caché sólo Definición de Página” se pulsa en “Terminar”. NOTA: Para el ejemplo del manual el nombre de la subpágina es “Nueva página” Una vez pulsado “Terminar” se accede a la Subpágina creada en modo “edición” de forma que se puede trabajar con ella directamente. Por defecto tiene aplicada una plantilla del tipo: UNED-content-2.1 es decir un parte para el menú y otra para contenido. Para modificar tanto la plantilla hay que realizar los siguientes pasos.



MODIFICAR PLANTILLA: En el modo edición de la nueva página hay que pulsar en propiedades como se muestra en la siguiente imagen:

La siguiente ventana muestra varias opciones en forma de pestañas, pulsar en la pestaña “Plantilla”



Después tan solo hay que seleccionar en el menú la plantilla que se ajuste a las necesidades de edición. (Facultades, asignaturas, etc.)



Una vez seleccionada tan sólo hay que aceptar y ver la presentación preliminar.

Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] CREAR MENÚ DE NAVEGACIÓN


CÓMO CREAR UN MENU DE NAVEGACIÓN USANDO UN PORTLET

La finalidad de este manual es la creación de un menú de navegación. Dicho menú consiste en una página simple de “Portal” en la cual se ha eliminado la plantilla por defecto (de plantilla 2.1 pasa a 1) y modificado varias opciones para convertirla en “Portlet”. La ventaja de utilizar el menú “Portlet” consiste en que puede insertarse dicho elemento en cualquier lugar del web (páginas) y a la hora de modificarlo se aplicará a todas las páginas donde se encuentre, no será necesario ir una por una.

********************************

Tomaremos como ejemplo la siguiente imagen de la página que vamos a crear:

El cuadro rojo muestra el lugar donde se insertará el típico menú de navegación. En este caso se utiliza una página de prueba que representa el web que se quiera modificar.



Una vez situados en el web a modificar (página) accedemos al modo “Edición”.

Nombraremos la subpágina creada del siguiente modo incluida la “descripción”.



Pulsar en “Terminar” y se accede al modo gráfico donde se muestra la página vacía. En dicha pantalla hay que ir a “Propiedades de página” como se muestra en la siguiente imagen:

En propiedades se eliminará la plantilla y se le asignan las características de “Portlet” con las pestañas de la parte superior derecha.



Primero se eliminará la Plantilla:

El siguiente paso es en la pestaña de “Opcional” habilitar las características de “Portlet”:



Una vez realizado el paso anterior estará disponible la opción de eliminar regiones, eliminar todas las regiones menos una (la marcada en tono rojo) como se muestra en la siguiente imagen. Portal pedirá autorización para eliminar o suprimir contenido, aceptar siempre. NOTA: NO ELIMINAR LA REGIÓN MARCADA.

Una vez eliminada las regiones marcadas anteriormente la pantalla que debe aparecer es la siguiente:

En ella tan solo se dispone de una región donde se añadirán los elementos que interesen. Normalmente un título para el menú y los enlaces oportunos a las páginas del web.



Como ejemplo se añade un “Título de Menú” y dos enlaces de página como se muestra en la siguiente imagen: Nota: Para el color rojo del título del menú se ha empleado el siguiente código “html”

<p class=titmenu> Título del Menú </p>

Por última una vez incluidos los elementos necesarios ya disponemos del “Menú Portlet”. El siguiente paso es volver a la página anterior al “Portlet” creado, en el caso de este manual es “Prueba Portlet” como se muestra en la “Ruta de Acceso”:



Y después en modo de edición “LISTA” para localizar el Portlet creado:

IMPORTANTE: Si fuese necesario modificar el Portlet se accede a él con el modo “LISTA”.

***********

Con estos pasos ya estaría creado el portlet, ahora tan solo queda insertarlo en las páginas correspondientes. Lo primero es situarse en dicha página:

Se activa el modo “Edición”:



IMPORTANTE: Los “Portlets” solo pueden añadirse en Regiones para Portlets, ver imagen:

Pulsar en “Añadir Portlet” y en la siguiente pantalla en “Contenido de Portal Publicado”: NOTA: no tiene porqué aparecer todas las opciones mostradas en la siguiente imagen, depende del usuario.



En la siguiente pantalla seleccionar la opción: “WEB UNED” donde se accede a un listado de todos los portlets creados en Portal, los más recientes aparecen en la parte inferior de la lista:





Pulsar en “Aceptar” y se volverá al modo gráfico donde aparece ya el “Menú Portlet” creado.



El resultado final es el siguiente:

Para cualquier tipo de duda o consulta [email protected] .

Documents

Manual de Publicacion2520DE%2520PUBLICACION.pdf · Manual de Publicación en PORTAL-UNED Equipo WEB. [email protected] Universidad Nacional de Educación a Distancia - 2 –