PROCEDIMIENTO PARA LA CREACIÓN DE UN SITIO WEB COMPONENTES ESPECIALES

(1)

PROCEDIMIENTO PARA

LA CREACIÓN DE UN

SITIO WEB

COMPONENTES

ESPECIALES

(2)

(3)

Procedimiento Para la

Creación de un Sitio Web

Componentes

Especiales

Fondo de Información y

Documentación para la Industria

Av. San Fernando #37 Col. Toriello Guerra Del. Tlalpan México DF

(4)

El Copyright y las Marcas registradas INFOTEC WebBuilder, SemanticWebBuilder, el personaje Semius y demás logotipos, emblemas y características distintivas, así como elementos relacionados son propiedad de INFOTEC Fondo de Información y Documentación para la Industria, Centro de Investigación CONACYT.

Reservados todos los derechos. Queda estrictamente prohibido bajo las sanciones establecidas en las leyes, la reproducción parcial o total de esta obra por cualquier medio o procedimiento de alquiler o préstamos públicos de ejemplares de la misma, sin la autorización escrita de INFOTEC Fondo de Información y Documentación para la Industria, Centro de Investigación CONACYT.

(5)

Fecha de Elaboración: Enero del 2012.

INFOTEC CONACYT FIDEICOMISO. i

Prologo

SemanticWebBuilder (SWB) es una plataforma tecnológica desarrollada en INFOTEC, un Centro de Investigación y Desarrollo Tecnológico del CONACYT, por lo que es un producto hecho en México y por mexicanos que tiene como propósito principal el brindar los elementos y utilerías necesarias para permitir una construcción rápida y simple de Sitios y Portales Web Semánticos, así como desarrollo de aplicaciones con características semánticas.

La idea principal de aplicar Semántica a los Sitios y Portales Web o mejor dicho incorporarle Semántica a Internet, es permitir que la información pueda ser definida con un significado específico, de forma que conforme se le van incorporando descripciones y propiedades a cada elemento de información este pueda tener más aspectos que lo distingan de los demás y lo puedan identificar mejor, logrando con ello que pueda ser fácilmente consultado, interpretado y procesado ya sea por personas o incluso por otras aplicaciones y sistemas, es decir por maquinas.

Esta característica de la semántica que hace que la información tenga un mayor significado y en consecuencia sea fácilmente consultada por personas o sistemas, implica que el intercambio e integración de información sea de forma más natural sin importar el lugar físico donde se encuentre la información o la forma en que haya sido procesada originalmente.

Esto implica que podremos realizar una consulta de información y la respuesta será más completa y adecuada a nuestro criterio de búsqueda, pues la fuente de consulta podrá ser leída, interpretada e integrada a partir de la información publicada por diferentes organizaciones, a múltiples niveles técnicos y/o humanos, permitiendo con ello obtener información más completa y adecuada a los requerimientos específicos de cada usuario en la red.

(6)

(7)

INFOTEC CONACYT FIDEICOMISO. iii

Índice de Contenidos

Prologo ... i

Índice de Contenidos ... iii

Acerca de este manual ... iv

Objetivos ... iv

Convenciones usadas en este manual ... v

Calibri 14 color Azul Énfasis Negrita, es utilizada para los títulos de tema ... vi

Acerca del administrador de SemanticWebBuilder Portal (SWBPortal) ... vii

Comenzando a trabajar… ... x

Instalación SWB………..………..1

Generar un Usuario con Privilegios de SU (Súper Usuario)………..3

Desactivar al Administrador….………...5

Generar un Sitio Web………8

Generar una Plantilla……….10

Generar una Página Web..………15

Agregar un Componente de tipo Contenido HTMLContent.………..……….17

Asignar una Plantilla HTML a la Página Web…..……….….19

Generar un Menú (Componentes de Estrategia)………..……….21

Agregar Componentes de Estrategia (Menú)a la Plantilla………...23

Generar un Banner (Componentes de Estrategia)………25

Agregar Componentes de Estrategia (Banner) a la Plantilla………..28

(8)

INFOTEC CONACYT FIDEICOMISO. iv

Acerca de este manual

Este manual fue realizado con el objetivo de explicar el conocimiento mínimo necesario de los procesos para la generación de Páginas Web en una Arquitectura de Sitio construida dentro de una instancia de SemanticWebBuilder.

Indicándole además los mecanismos necesarios para implementar en cada Página los diferentes componentes de personalización y publicación que se incluyen en la herramienta, mostrando su uso y aplicación de forma que el resultado en Internet sea el deseado, presentando la información correcta a la persona correcta, en el momento correcto, en el contexto correcto.

Objetivos

General:

El objetivo de este manual es mostrar los pasos básicos para crear un Sitio Web y el manejo de algunas herramientas, para crear y visualizar una Página Web desde cero, creando un sitio, asignando una plantilla a Página Web y pueda visualizarla en un navegador

Específicos:

Al finalizar el tema de Procedimiento para la creación de un sitio Web el usuario será capaz de construir un Sitio Web mediante la administración de páginas o secciones de forma que le permitan asegurar que la información contenida en ellas se muestre de la forma adecuada y será capaz de modificar dichas características,.

(9)

INFOTEC CONACYT FIDEICOMISO. v

Convenciones usadas en este manual

Las siguientes convenciones son utilizadas en este manual para representar diferentes elementos de capacitación y recursos alternativos de aprendizaje:

Iconos

Sabías Que – Indica comentarios al margen en los que se extenderá el tema expuesto mediante recomendaciones o tips que mejoren el aprovechamiento de la herramienta

Consideraciones Importantes – Exponen puntos importantes que deben tenerse en cuenta para la correcta operación de las utilerías. Nota – Indica Información adicional que puede ayudarle a aprovechar mejor la funcionalidad expuesta.

Referencia – Indica la necesidad de consultar otro documento o dirección Web en donde se encontrara mayor información sobre el tema expuesto.

Procedimiento Guiado – Indica que se comenzara la descripción paso a paso de la operación de un proceso.

Ejercicio Guiado – A partir de este punto se comenzara la ejecución de un ejercicio que deberá realizar el usuario de manera guiada paso a paso con el manual.

Resultado – Expone el efecto final correcto de una operación o procedimiento.

Diagnostico – Por características de la tecnología involucrada, se generan resultados no deseados. Aquí se indicara como resolverlo. Improcedente – Indica situaciones tecnológicas en las que no es posible realizar una operación o que requiere de algún proceso alterno para obtener el resultado deseado.

(10)

INFOTEC CONACYT FIDEICOMISO. vi

Convenciones Tipográficas

Arial 26 Negrita

, es utilizada como título de tema

Calibri 14 color Azul Énfasis Negrita, es utilizada para los títulos de tema

Calibri 12 color Azul Énfasis 1 negrita, es utilizada para destacar subtemas

Arial 11, es utilizada como fuente principal para el cuerpo del texto

<Times New Roman 11> es utilizada para descripción de configuraciones o código

Arial 10 negrita color azul con recuadro y sombreado azul indica temas a resaltar y/o puntos importante en los que el lector debe prestar especial atención

Arial 10 en color azul con recuadro azul y sombreado azul, se utiliza para denotar puntos importantes en los que el lector debe prestar atención especial

(11)

INFOTEC CONACYT FIDEICOMISO. vii

Acerca del administrador de SemanticWebBuilder Portal (SWBPortal)

Para acezar a la administración de SemanticWebBuilder Portal (SWBPortal) es necesario que en el URL agregue al final “swbadmin”, como se muestra a continuación:

Portal Publico Administración del sitio

http://www.sitio.com/swb http://www.sitio.com/swb/swbadmin

Nota: El contexto “swb” indicado aquí puede ser opcional y cambiar de una instancia de SWB a otra dependiendo de la configuración específica establecida en cada caso.

A continuación se mostrará la ventana de identificación (login) de SWBPortal, en donde deberá proporcionar su usuario, su contraseña, para después presionar el botón entrar:

El administrador de SemanticWebBuilder Portal (SWBPortal) tiene diferentes zonas o áreas de trabajo en las cuales se presentan los elementos y componentes mediante los cuales es posible incorporar los diferentes recursos de configuración y administración con los que puede desarrollar y dar mantenimiento a su Sitio Web.

Las diferentes Zonas que se localizan en el sitio Administrador de SWBPortal se detallan en las imágenes siguientes:

(12)

INFOTEC CONACYT FIDEICOMISO. viii

Descripción Barra de

Menus

En esta barra se contienen las opciones generales de la administración de la herramienta

Acordeones de Estructura

En esta zona se mostraran en pestañas expandibles (Acordeones) diversos elementos de configuración de la estructura de los sitios generados en la herramienta, así como herramientas y funcionalidades de operación general.

Zona de Trabajo

Área en la que se despliega el detalle de la información, elementos de configuración y administración de los elementos de SWB

(13)

INFOTEC CONACYT FIDEICOMISO. ix

Descripción Catálogos

de Estructura

Se denomina “Catalogo de Estructura de…” a cada uno de los acordeones, donde se localizaran diversos catálogos de elementos que permiten la administración especifica de los diferentes recursos de SWB Zona de

Información

Esta zona mostrara la información básica del componente o recurso seleccionado en los acordeones de estructura. También se le conoce como la zona de metadatos del elemento.

Pestañas de Elementos

En esta zona se mostraran las pestañas de administración de cada uno de los componentes que sean abiertos dentro de SWB de forma que se pueda pasar de uno a otro sin perder la información o cambios que se hubieran efectuado en otro componente.

Pestañas de Configuración de Elemento

A segundo nivel en la zona de “Pestañas de Elementos” se muestran las pestañas de administración especifica del componente seleccionado, permitiendo la configuración a detalle de cada componente en el SWB

Barra Emergente de Estatus

Esta barra se mostrara de manera emergente en la parte inferior de la pantalla de Administración de SWB y mostrara mensajes sobre el éxito o no de la operación realizada

Zona de Trabajo y Configuración

Muestra el detalle de cada aspecto de configuración de las “Pestañas de Configuración de Elementos”, de forma que pueda trabajar con cada recurso y lo configure de acuerdo a sus requerimientos.

(14)

INFOTEC CONACYT FIDEICOMISO. x

Comenzando a trabajar…

PROCEDIMIENTO PARA LA

CREACIÓN DE UN SITO

(15)

INFOTEC CONACYT FIDEICOMISO. 1

Este manual es para mostrar los pasos básicos para crear un Sitio Web y el manejo de algunas herramientas para crear una Página Web asignar Plantilla a Página Web y pueda visualizarla en un navegador.

Instalación de SWB.

Procedimiento:

Nota: SemanticWebBuilder es una herramienta multiplataforma, por lo que se puede instalar en diferentes ambientes y se cuenta con los manuales referentes a esta como son:

Instalación Inicial SemanticWebBuilder

Instalación SemanticWebBuilder en GlassFish

Instalación SemanticWebBuilder para plataformas tipo Unix Instalación Inicial SemanticWebBuilder en JBOSS

Instalación Inicial SemanticWebBuilder en WebLogic Instalación SWB WebLogic_11g

1. Realizar la instalación de SemanticWebBuilder.

Referencia: Para el procedimiento de instalación de SemanticWebBuilder diríjase a la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

2. Una vez instalada la aplicación de SemanticWebBuilder, diríjase a abrir un navegador y escriba la siguiente ruta http://dirección_ip:puerto/swbadmin.

Nota: La ruta de navegación para entrar a la administración de SWB se arma de la siguiente manera:

http:// Protocolo

Dirección IP: Dirección del servidor donde se levantó la aplicación

Puerto: Puerto que se configuro en el AppServer para levantar la aplicación Swbadmin: prefijo para accesar a la administración de SWB

(16)

3. Se mostrará en el navegador la página de acceso para la administración de SWB, en el campo de “User” escriba “admin” y en el campo de “Password” escriba “webbuilder”, y dar clic en el botón de “Login”.

Resultado:

(17)

Generación de un usuario con privilegios de Súper Usuario (SU).

Procedimiento:

1. En la “Barra de Menús” localizar y seleccionar la opción “Usuarios”, y en el menú desplegable dar clic en la opción “Agregar usuario”

2. Se mostrará una ventana emergente, donde se tendrá que llenar los campos de “Repositorio de Usuarios”, “Usuario” y “Contraseña” con los datos solicitados. 3. Una vez llenado los campos dar clic en el botón de “Guardar”.

Nota: El “Admin User Repository”, es el repositorio que nos permite crear usuarios con privilegios, para la administración de SWB.

(18)

En el área de trabajo se mostrara las pestañas correspondientes al usuario que se generó.

4. Llenar los campos solicitados en la pestaña de “Información”, (los campos con asterisco son obligatorios), dar clic en check box de “Activo”. Y dar clic en el botón de “Guardar”.

5. Seleccionar la pestaña de “Grupos de Usuarios” y dar clic en el botón “Agregar de lista”.

(19)

Se enlistará los 2 roles para ser asignados al usuario, para este ejemplo se asignará permiso de “Súper Usuario”, seleccionar el check box de “Súper Usuario” y dar clic en el botón de “Agregar seleccionados”

Referencia: Para más información del procedimiento de creación de un usuario diríjase al manual “Creación_y_Administración_de_Usuarios” en la siguiente ruta:

http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

Resultado:

Se creó el usuario con el rol de Súper Usuario el cual tiene todo el acceso y los permisos para la administración de SWB.

Desactivar al administrador.

Procedimiento:

Una vez contando con el usuario con privilegios de SU, termine la sesión activa que se tiene con el usuario general.

1. En Barra de Menús del lado derecho está el botón de salir dar clic, para terminar la sesión con el usuario actual.

(20)

2. Iniciar sesión con el Usuario con privilegios de Súper Usuario que fue creado dirigiéndose a la ruta http://IP:Puerto/swbadmin y autenticarse.

3. En la “Barra de Menús”, seleccionar a Usuarios

4. Se mostrará un menú despegable, dar clic en “Buscador”.

5. Se mostrará un formulario con los criterios de búsqueda, en el campo “Repositorio de usuarios” seleccionar el repositorio “Admin User Repository” el cual es al que el usuario “admin” pertenece.

6. En “Nombre(s)” escribir el usuario “admin”. 7. Dar clic en el botón de “Buscar”

(21)

8. Se mostrará los resultados de la búsqueda, dar doble clic en el usuario “admin”.

Nota En el buscador de usuarios se puede definir solo un campo o todos los campos de los criterios de búsqueda para arrojar los resultados según la búsqueda de usuario definida.

9. Seleccionar la pestaña de “Información”, en donde se desactivara el check box de “Activo”, dar clic en el botón de “Guardar”.

(22)

Resultado:

El usuario General fue deshabilitado.

Generar un sitio Web.

Nota: Por default la herramienta tiene precargado un Sitio con el nombre de Demo.

Procedimiento:

1. En “Barra de Menús, Seleccionar “Archivo”, 2. Dar clic en la opción de “Crear Sitio Web” 3. Dar clic sobre la opción de “Nuevo”.

(23)

4. Se muestra una ventana emergente en donde se definirán los campos con la información que requerida, cuando se define el campo de “Título” de manera automática SWB lo toma como referencia para definir el campo de “Identificador”, este puede ser editado si así se requiere. En el campo de “Repositorio a utilizar” seleccione “Exclusivo” con fines de ejemplificación de este manual. Y por último en el campo de “Tipo de Sitio” seleccione “Sitio Web” y dar clic en el botón de “Guardar”

Nota: La definición de un ID debe de ser una cadena de valores que no contenga caracteres especiales ni espacios en blanco.

5. Se mostrará en el “Catalogo de Estructura” el Sitio que se creó, dar clic en “Sitio”, se mostrará en la “Zona de Trabajo y Configuración” la información.

6. Dar clic en el check box de “Activo”. 7. Dar clic en el botón de “Guardar”.

(24)

Referencia: Para más información del procedimiento de creación de Sitios diríjase al manual “Creación_y_Administración_de_Portales_SWB” en la siguiente ruta:

http://www.semanticwebbuilder.org.mx/es/swb/Manuales . Resultado:

El sitio se muestra activado mostrando la pestaña de “Información”.

Generar una Plantilla.

Procedimiento:

1. En el Catalogo de Estructura del Sitio, dar clic derecho sobre “Plantillas” y seleccionar la opción “Agregar Grupo de Plantillas”

(25)

2. Se mostrará una ventana emergente llenar el campo, y dar clic en el botón de “Guardar”.

3. Se mostrará la información general del Grupo de Plantillas que se acaba de crear, se puede llenar la “Descripción”, dar clic en el botón de “Guardar”.

Nota: El “Grupo de plantillas”, nos sirve para ordenar y/o clasificar en base a las características de presentación que se desee dar a las plantillas.

4. En el “Catalogo de Estructura”, dar clic sobre Plantillas, se mostrará un menú desplegable, dar clic en el “Grupo de plantillas” que se acabó de crear, dar clic en “Agregar Plantilla”.

(26)

5. En la Zona de Trabajo y Configuración se mostrará una ventana emergente la cual se tendrá que llenar el campo de “Título”, y dar clic en el botón de “Guardar”.

6. Se mostrará la información de la Plantilla en “Vista Previa” que se acaba de crear, dar clic en el check box de “Activo”, y dar clic en el botón de “Guardar”.

Referencia: Para más información del procedimiento de creación y propiedades de una plantilla diríjase al manual “Creación y Administración de Plantillas para la Presentación

de Páginas Web” en la siguiente ruta:

(27)

7. Seleccionar la pestaña “Editar Plantilla”. 8. Dar clic en el icono de edición.

Consideraciones Importantes: Al generar una nueva plantilla en SemanticWebBuilder se genera con el código inicial de una plantilla blanca, con tags, scripts y elementos necesarios para el buen funcionamiento de la plantilla y los componentes a asignar.

La zona de trabajo presentará el editor WYSIWYG en el modo “Texto” mostrando la plantilla a editar.

Referencia: Para más información del procedimiento de los SWBTags diríjase al manual

“Uso e implementación de SWBTags”, en la siguiente ruta:

En el editor de la plantilla muestra los botones que le servirán para la edición de la misma, estos son:

(28)

Nuevo: Genera una nueva plantilla

Abrir de Archivo: Permite cargar una plantilla HTML.

Guardar: Guarda las modificaciones realizadas a la plantilla.

Cargar Archivos: Permite la subida de archivos en la ruta donde se generó la plantilla.

Cortar: Permite cortar el texto seleccionado de la plantilla. Copiar: Permite copiar el texto seleccionado de la plantilla.

Pegar: Permite pegar el texto copiado de la plantilla Liga: Permite crear un hipervínculo a un archivo o página.

Imagen: Permite la subida de archivos.

Tabla: Permite crear una tabla dentro de tu plantilla.

Recurso: Te permite agregar un componente de estrategia y/o sistema a la plantilla.

Contenido: Permite agregar el SWBTag de <content/>que hace el llamado a los componentes de contenido asignados a las páginas web.

(29)

Resultado:

Se mostrará la Plantilla en HTML o Texto.

Dar clic en la pestaña de “HTML” para editar la Plantilla ya sea en Texto o en HTML.

Una vez que se termine la edición de la plantilla, dar clic en el botón de “Guardar”.

Referencia: Para más información del procedimiento y edición de una plantilla diríjase al manual “Administración_yCreación_de_Plantillas_para_Presentación_de_Paginas_Web”, en la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

Generar una Pagina Web.

1. En el “Catalogo de Estructura” dar clic derecho sobre la Página Web “Home”. 2. Se mostrará un menú desplegable, dar clic sobre “Agregar Pagina Web”.

(30)

3. Se mostrará una ventana emergente donde se definirá los campos de “Título” e “Identificador”, dar clic en el botón de “Guardar”.

Nota: El Identificador que se defina para la página a crear, será el que arme la ruta de navegación (URL), por lo que no se permiten los caracteres especiales ni espacios en blanco.

4. Se mostrará la Página Web sobre “Vista Previa”, seleccionar la pestaña de “Información”, dar un clic en check box de “Activo”, y dar clic en el botón de “Guardar”.

Resultado:

(31)

Referencia: Para más información del procedimiento de creación de Páginas Web diríjase al manual “Creación y Administración de Páginas Web” en la siguiente ruta:

Agregar un Componente de tipo Contenido “HTMLContent”.

Ya creada nuestra Página Web

1. Seleccionar la pestaña de “Contenidos”, dar clic en el botón de “Agregar nuevo”.

2. Se mostrará el listado de todos los contenidos disponibles, para este ejemplo seleccionar el contenido “HTMLContent”.

(32)

4. Se genera un contenido HTMLContent, dar clic en el check box de “Activo”. 5. Dar clic en el botón de “Guardar”.

6. Seleccionar la pestaña “Editar Versión”, se enlistarán las versiones del contenido, por default se cuenta con la versión “1” para ser editada, dar clic sobre el icono de edición para acceder al editor del HTMLContent.

7. Dentro del editor se introduce el contenido ya sea de modo HTML o texto que será visualizado en la página en el área de contenido, terminando la edición dar clic sobre el botón de “Guardar”, y para regresar al listado de versiones dar doble clic sobre “Editar Versión”.

(33)

Consideraciones Importantes: Para este ejemplo se utilizo el texto “Hola Mundo” pero el editor HTMLContent cuenta con numerosas bondades requeridas para generar contenidos.

Referencia: Para más información del procedimiento de agregar contenidos diríjase al manual “Administración y Publicación de Contenidos” en la siguiente ruta:

http://www.semanticwebbuilder.org.mx/es/swb/Manuales . Resultado:

El contenido ha sido agregado

Asignar una Plantilla HTML a la Página Web.

Procedimiento:

1. En la Página Web que se creó seleccionar la pestaña “Plantillas”, dar clic sobre el botón “Agregar de lista”.

(34)

2. Se mostrará el listado de Plantillas, dar clic sobre la plantilla que se creó, y dar un clic sobre “Agregar seleccionados”.

3. Se mostrará la plantilla seleccionada, dar clic en el check box de “Activo”

Consideraciones Importantes: Las Páginas Web descendientes de la principal heredarán la plantilla dependiendo la herencia asignada.

Si una Página Web no tiene asignada una plantilla y se requiere visualizar desde el Web, se generara un error 404

Resultado:

De esta manera hemos asignado a la Página Web la Plantilla que se creó, para poder visualizarla, seleccionar la Página Web, en el acordeón de propiedades se mostrara el identificador de la “página” como un link, dar clic, y mostrará la Página en la pestaña de “Vista Previa”.

(35)

Referencia: Para más información del procedimiento de asignar Plantilla a Pagina Web diríjase al manual “Creación y Administración de Plantillas para Presentación de Páginas Web” en la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

Generar un Menú (Componente de Estrategia).

Procedimiento:

1. En “Catalogo de Estructura” seleccionar “Componentes de Estrategia”, dar clic para que se muestren los componentes, dar clic derecho sobre “Menú” el cual mostrara un menú desplegable, dar clic sobre “Agregar Subtipo de Recurso”.

2. Se mostrará una ventana emergente donde se llenaran los campos de “Título” e “Identificador”, dar clic sobre el botón “Guardar”.

3. “Agregado de Subtipo de Recurso” dar clic derecho mostrará un menú desplegable, dar clic sobre “Agregar Recurso”.

(36)

4. Se mostrará una ventana emergente donde se definirá el campo con de “Titulo”, dar clic en el botón de “Guardar”.

Referencia: Para más información sobre los Componentes de Estrategia diríjase al manual “Administración y publicación de Componentes de Estrategia” en la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

5. Se mostrará la informacion del Recurso, seleccionar el check box de “Activo”. 6. Dar clic en el botón de“Guardar”.

(37)

Resultado:

Se mostrará el Recurso ya activado.

Agregar un Menú (Componente de Estrategia) a la Plantilla.

Procedimiento:

1. En el “Catalogo de Estructura”, dar doble clic en la Plantilla que se creó. 2. Seleccionar la pestaña “Editar Plantilla”.

(38)

4. Dar clic sobre el icono “Recurso”.

5.

Se mostrará todos los componentes, seleccionar el Subtipo de Recurso que se creó, dar clic en el botón de “Aceptar”

.

(39)

Resultado:

Se mostrará el tag del recurso agregado en el código, seleccionar el icono de Guardar.

Referencia: Para más información sobre los Componentes de Estrategia diríjase al manual “Administración y publicación de Componentes de Estrategia” en la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

Generar un Banner (Componentes de Estrategia).

Procedimiento:

1. En el “Catálogo de Estructura” seleccionar “Componentes de Estrategia” Se mostrarán todos los componentes, seleccionar “Banner”, dar clic derecho, mostrará un menú desplegable, y dar clic sobre “Agregar Subtipo de Recurso”.

(40)

2. Se mostrará una ventana emergente se llenaran campos con el nombre del “Título” y el “Identificador”, automáticamente se crea al introducir el Título.

3. Seleccionar el Subtipo de Recurso, dar clic derecho mostrará un menú desplegable, dar clic sobre “Agregar Recurso”.

4. Se mostrará una ventana emergente donde se llenara campo, dar clic en el botón de “Guardar”.

5. En el “Catalogo de Estructura” dar clic al Recurso ya creado, mostrará la informacion del Banner.

(41)

7. Dar clic en el botón de “Guardar”.

8. Seleccionar la pestaña de “Administrar”.

9. Seleccionar el botón de “Elegir”, y seleccionar el Banner. 10. Dar clic en el botón de “Guardar”.

(42)

Resultado:

Se mostrará la imagen del Recurso agregado (Banner).

Agregar Componentes de Estrategia (Banner) a la Plantilla.

Nota: Siga el mismo procedimiento para asignar el recurso de estrategia a la plantilla.

Procedimiento:

1. En el “Catalogo de Estructura”, dar clic en la Plantilla (Principal) que se creó. 2. Seleccionar la pestaña “Editar Plantilla”.

(43)

4. Dar clic sobre el icono “Recurso”.

5. Se mostrará todos los componentes del Recurso, seleccionar Subtipo del Recurso que se creó.

6. Dar clic en el botón de “Aceptar”.

(44)

Resultado:

Se mostrará el tag del Banner agregado en el código, seleccionar el icono de Guardar.

Referencia: Para más información sobre los Componentes de Estrategia diríjase al manual “Administración y Publicación de Componentes de Estrategia” en la siguiente ruta: http://www.semanticwebbuilder.org.mx/es/swb/Manuales .

Visualización de Página Web en un Navegador.

Procedimiento:

Si se desea visualizar en otra pestaña o en otra ventana del Navegador

1. Seleccionar la Página Web creada “pagina”, dar clic en “Propiedades” mostrará un acordeón de Propiedades.

2. Dar clic derecho sobre el identificador “pagina”, y seleccione abrir en una nueva pestañao en otra ventana depende del navegador que se esté usando serán las opciones.

(45)

Resultado:

La Página Web se visualizara en un navegador con los componentes agregados.

Referencia: Para más información sobre los manuales diríjase a la siguiente ruta: