contacto@lazos.cl :: Telfono (56-45) 325252 :: Montevideo 0780, Temuco, Chile :: www.lazos.cl

Universidad de La Frontera

Instituto de Informtica Educativa

ManualManualManualManual

Administrador TYPO3

h t t p : / / w w w . l a z o s . c l

nd ice

1. INTRODUCCIN ................................................................................... - 3 -

2. ARQUITECTURA TYPO3.......................................................................... - 4 - 2.1 Arquitectura ............................................................................ - 4 - 2.2 Arquitectura frontend TYPO3 ....................................................... - 5 -

3. ADMINISTRACIN BACKEND TYPO3 ........................................................... - 7 - 3.1 Ingreso y espacios de trabajos ...................................................... - 7 - 3.2 Mdulos y sus campos (o sub mdulos) (men Izquierdo) ..................... - 9 - 3.3 Crear pginas del sitio Web........................................................ - 15 - 3.4 Implementacin del template del sitio Web ................................... - 21 - 3.5 Crear usuarios Frontend ........................................................... - 24 - 3.6 Crear usuarios Backend ............................................................ - 26 - 3.7 Crear contenido con la funcionalidad Noticia y Faq .......................... - 37 - 3.7.1 Incorporar, configurar y crear contenido con la funcionalidad Noticia - 37 - 3.7.2 Incorporar, configurar y crear contenido con la funcionalidad Faq..... - 45 - 3.8 Administrador de extensiones (funcionalidades Typo3) ..................... - 50 - 3.9 Administrador de Archivos......................................................... - 55 -

4. BIBLIOGRAFIA.................................................................................... - 58 -

- 3 -

1. INTRODUCCIN

TYPO3 es un CMS (Content Management System) que proporciona un backend para la administracin de contenidos y estructura del sitio Web y por otra parte cuenta con un motor frontend para la visualizacin del sitio Web. En este documento se explica cmo est conformado TYPO3 y los puntos ms relevantes para administrar un sitio Web realizado con este gestor de contenidos. En el transcurso de este documento se podrn observar referencias tanto en ingls como en espaol, ya que TYPO3 viene por defecto en ingls y luego de su instalacin se puede realizar el cambio de idioma.

- 4 -

2. ARQUITECTURA TYPO3 2.1 Arquitectura

La arquitectura de TYPO3 le permite tener un ncleo que est diseado de manera nativa con una estructura para todo propsito en la administracin de contenido en la base de datos. El ncleo de TYPO3 proporciona un conjunto de principios para el almacenamiento de contenidos, administracin de acceso de usuario, edicin de contenido, carga y administracin de archivos, etc. Muchos de estos principios estn expresados como una API (Interfaz del programador de aplicaciones), que son usadas en las extensiones; stas son las que proporcionan la mayor parte de la funcionalidad real del sitio Web. En la figura 1 se puede ver la arquitectura de TYPO3:

Figura 1: Arquitectura TYPO3.

- 5 -

2.2 Arquitectura frontend TYPO3

La produccin de un sitio Web con un CMS requiere la interaccin de ms componentes que si el mismo sitio se realizara de archivos HTML puros, estticos. La idea inherente de un CMS es que el contenido se almacena de forma separada del marcaje de presentacin. Algunos CMSs almacenan su contenido en archivos XML, otros usan una base de datos relacional. La diferencia tiene pros y contras tcnicos, pero la idea principal es la misma: el contenido separado de los colores. Cmo se unen las plantilla HTML a TYPO3? Se realiza una integracin entre las plantillas HTML y TYPO3. Al momento que TYPO3 genera pginas Web, el motor de la aplicacin combina contenido sin formatear de la fuente de datos (base de datos) con una plantilla HTML, definiendo todo el formateo. En este proceso el registro de plantilla es el elemento de control que instruye al motor de la aplicacin acerca de cmo realizar esta labor de combinacin. En la figura 2 se puede ver cmo el registro de plantilla es el elemento de control el programa- para el motor de la aplicacin, que a su vez encuentra el contenido en la base de datos, lee la plantilla, inserta el contenido en los lugares designados en la plantilla y da como resultado una pgina Web!

Figura 2: Integracin HTML en TYPO3.

- 6 -

Ejemplo a lo anterior: En la mayora de agencias de diseo Web, un grupo de personas trabaja unido en la creacin de un sitio Web. En este grupo encontraremos un diseador grfico, un programador y un colaborador que contribuye con los contenidos (al menos para el contenido inicial). Cada una de estas personas tiene diferentes habilidades y trabajarn, de este modo, en la produccin del sitio en reas diferenciadas figura 3.

Figura 3: Ejemplo de la integracin Html y TYPO3.

Ilustrando la figura 3, los diferentes componentes del sitio Web controlado por el CMS son asignados a cada una de las personas del equipo: Mr. Raphael es el artista. Raphael tiene grandes dotes para el diseo visual, maneja Photoshop, Dreamweaver, hojas de estilo CSS, HTML etc. Pero no maneja PHP, TypoScript, SQL ni otros aspectos tcnicos. De manera que Raphael hace las plantillas HTML! Mr. Benoit es un programador. Le gustan los bits y los bytes, le gustan las directivas de compilador, las expresiones regulares, la lgica, PHP, TypoScript y SQL. El diseo, la tipografa, combinar colores y tener en cuenta la usabilidad no son sus mejores dotes. De manera que Benoit est a cargo de la configuracin TypoScript en los Registros de Plantilla. Mr. Picouto es el encargado del contenido. Es el tipo del mrketing y se le ve en los ojos que est deslumbrado por el trabajo de Raphael y Benoit, capaces de llevar las ideas del papel a la pantalla. Picouto no es ni un programador ni un diseador, pero tiene un mensaje que comunicar. Y a travs de la interfaz de TYPO3 puede crear el contenido que desea sin ningn requisito tcnico ms all de un procesador de textos. A travs del ejemplo se puede ver ms en detalle la integracin y los actores que pueden participar en la creacin de un sitio Web con TYPO3.

- 7 -

3. ADMINISTRACIN BACKEND TYPO3

3.1 Ingreso y espacios de trabajos

Para poder trabajar con el backend de TYPO3 es necesario que Introduzca en la barra del navegador la pgina Web (por ejemplo, http://www.su-dominio.cl/typo3), adems cuente con nombre de usuario y contrasea, una vez en la pgina de ingreso de Typo3 (Fig. 4) realice lo siguiente: 1.- Introduzca en el campo Username su nombre de usuario 2.- Introduzca en el campo Password su contrasea. 3.- Por ltimo, haga clic sobre el botn Log in.

Figura 4: Ingreso al backend de Typo3

Al ingresar se pude ver un men en la parte izquierda (Fig. 5.1) y un mensaje de bienvenida en la parte derecha (Fig. 5.1).

Figura 5: Pantalla bienvenida TYPO3

2

1

- 8 -

En el men de la izquierda en el modulo Web, en la parte superior izquierda de la pantalla, haga clic sobre Pgina (o Page), as podr ver en forma preliminar completamente la interfaz de trabajo que entrega TYPO3 (Fig. 6). La interfaz de trabajo de TYPO3 est dividida en tres campos principales: 1. El campo de mdulos. Representa el nivel ms importante para la eleccin del mdulo correspondiente en el que se quiere trabajar. 2. El campo de navegacin. Representa las distintas pginas de navegacin del sitio Web y su estructura, adems reproduce la navegacin de algunos mdulos, a eso se le denomina rbol de paginas o rbol del sitio. 3. Vista de detalles. Representa el verdadero mbito de trabajo del usuario. En la interfaz estn presentes, adems: 4. Salir (o Logout). (Desconectar), cuando se quiera terminar la sesin de trabajo, se debe hacer clic sobre el botn salir, TYPO3 guardar su ltima posicin de trabajo, a la que volver en la prxima conexin. 5. Usuario: Muestra siempre el nombre del usuario conectado actualmente.

Figura 6: Interfaz de trabajo.

3

5

1

2

4

- 9 -

3.2 Mdulos y sus campos (o submdulos) (men Izquierdo)

El campo de mdulos sirve para la eleccin de la correspondiente rea de trabajo y las tareas que se desea llevar acabo, en pocas palabras es el men de trabajo que presenta typo3. Ejemplo para el redactor seran relevantes en su trabajo los campos Web y Documento. En la figura 8 se puede observar los mdulos que son: Web, Carpetas, Documentos, Usuario, Herramientas y Ayuda (Fig. 8-1). Dentro de la correspondiente rea modular se muestran tambin los submdulos o tems respectivos (Fig. 8-2). Ejemplo para el rea modular Web los siguientes sub-campos:

"Web > Pgina", "Web > Ver", "Web > Plugins", "Web > Lista", "Web > Informacin", "Web > Acceso", "Web > Funciones" y "Web > Template"

Figura 8: Mdulos y sus campos

1

2

- 10 -

El rea Modular " Web" Aqu se encuentran los mdulos ms importantes, estos definen tanto los contenidos como la apariencia de la pgina Web. Se puede: crear pginas, introducir y editar contenidos, mostrar en la vista previa las pginas antes de publicarlas y pedir para las pginas informacin global o elementos. Un panorama tanto sobre los derechos de acceso y usuario como de utilizacin de accesos externos al servidor de la Web son instrumentos de control importantes. Las funciones para la importacin de datos y asistentes (wizards) en la creacin de estructuras de pgina facilitan mucho el trabajo. Y finalmente los templates configuran el aspecto y los comportamientos funcionales de la pgina Web.

Campos Descripcin

pgina Con este mdulo se puede crear y editar pginas Web nuevas con variados elementos de contenido.

Mostrar Este mdulo permite tanto contemplar el estado de elaboracin de una pgina por medio de la vista previa como tambin ejecutar algunos cambios ("Editor Frontend"). El lapicero marca en este caso el elemento de contenido que usted puede elaborar. As est garantizado que la pgina se mostrar correctamente si estuviera online.

Lista El mdulo Lista proporciona el mejor vistazo y acceso a los conjuntos de datos de una pgina que son accesibles para el correspondiente usuario. Los elementos de contenido se organizan en una lista de manera clara como opciones avanzadas o templates especiales de la pgina. En el mdulo Lista puede elaborar la cabecera de la pgina o los elementos de contenido, cambiar fcilmente el orden de los contenidos, copiarlos, desplazarlos o hacer mostrar la trayectoria de cambios de un conjunto de datos.

Informacin El mdulo Informacin rene todas las informaciones estadsticas importantes de la pgina correspondiente. En el modo "Vista diagrama" se visualizan tanto las informaciones de la pgina (cundo y por quin fue producida, la fecha de la ltima actualizacin, palabras clave, datos de contenido, estado, etc) como tambin un diagrama de las pginas que se encuentran en los niveles inferiores. El diagrama le ofrece un panorama de la publicacin de control temporal, el cach y periodo de las pginas como tambin de la clase de los conjuntos de datos. Si elige en el mdulo Informacin el modo "Estadsticas de acceso", tendr a su disposicin una pgina referida a la evaluacin del trfico en su pgina Web. En el modo "Admin-Changelog" el protocolo de cambios ayuda a seguir el desarrollo de pginas y conjuntos de datos y, cuando sea necesario, ayuda a anular un proceso de edicin errneo. El modo "Pginas TSconfig" reproduce las configuraciones TypoScript de las pginas una por una.

Acceso El mdulo "Acceso" asiste en el control de los derechos de los usuarios de backend en las distintas pginas. Puede definir a usuarios individuales o grupos de usuarios como poseedores de una pgina y establecer sus derechos

- 11 -

(leer, elaborar, borrar, crear nuevo, etc). Los modos "Vista de usuario" y "Derechos" le ofrecen un panorama rpido sobre las ordenaciones de la pgina Web y la posibilidad de realizar cambios.

Funciones El mdulo Funciones ofrece recursos para trabajar ms eficientemente con TYPO3. El modo "Importar" le ayuda a integrar en la aplicacin datos externos. El modo "Wizard" (Asistente) permite la creacin rpida y automtica de estructuras enteras de pginas o su clasificacin por ttulo de pgina, subttulo, fecha de actualizacin o fecha de creacin.

Template El mdulo Template administra las plantillas de TypoScript que son las responsables del aspecto de su pgina Web. El mdulo pone en manos de los administradores numerosos instrumentos para manejar de manera rpida templates externos e integrados (Static-Templates) como tambin la definicin de aplicaciones de configuracin. El modo "Info/Modificar" (ubicado en el cuadro de seleccin ubicado a la derecha de la pantalla) ofrece un resumen de los templates uno por uno: su nombre, descripcin, recursos integrados, constantes como tambin el Setup y las posibilidades propiamente de elaboracin. En el modo "Constant editor" se configuran los objetos de los distintos templates internos de TYPO3. De este modo, por ejemplo, usted puede establecer en el template "Cset" la fuente, el color y el tamao de escritura para el sector de validez del template. El modo "TypoScript Object-Browser" representa las aplicaciones de configuracin de la pgina en su jerarqua de objetos. Y, finalmente, el modo "Analizador Template" reproduce la jerarqua de los templates integrados como tambin sus constantes y el setup.

El rea Modular " Archivos" Este campo le ofrece una vista de los recursos de la pgina Web. Imgenes, descargas, pelculas o sonidos que puedan ser utilizados constantemente en la pgina, se encuentran situados en una sencilla estructura de archivos. Pueden ser cargados nuevos recursos de manera cmoda con operaciones masivas. La vista previa de imgenes como tambin la peticin de informacin de archivos permite una manipulacin intuitiva.

Campos Descripcin Lista de Archivos El mdulo Lista de Archivos representa el sistema de administracin de

archivos de TYPO3. Le posibilita acceder a las carpetas de archivos que le autorice su login. Haciendo clic con el botn izquierdo del ratn sobre el correspondiente icono en el diagrama (carpeta o archivo), encontrar a su disposicin un men contextual con el que podr cambiar el nombre a las carpetas, crear carpetas nuevas, cargar archivos en el servidor, copiar, cortar, eliminar o mostrar otras informaciones. Mediante las casillas de activacin situadas al final de la presentacin puede mostrar los Thumbnails (pequeas vistas previas) de las imgenes o el portapapeles para copiar o desplazar archivos.

- 12 -

El rea " Doc" Mediante el mdulo documentos puede acceder en cualquier momento a pginas que se encuentren en proceso de elaboracin, elementos de contenido, templates, etc. Esto permite un cambio rpido entre los pasos de elaboracin y los mdulos. En el mdulo Usuario > Configuracin puede usted establecer el nmero mximo de datos que se pueden mostrar en el mdulo documentos. Campos Descripcin Doc El mdulo Doc le ayuda a acceder a pginas que se encuentran en elaboracin,

elementos de contenido, templates, etc. Le permite un cambio rpido entre pasos de elaboracin y mdulos.

El rea Modular " Usuario" Los mdulos sirven, por una parte, para la configuracin correcta de su interfaz de usuario, y por la otra tambin como centro personal de tareas y de comunicacin con los miembros del proyecto.

Campos Descripcin Centro de tareas El mdulo Tareas pone a su disposicin recursos para su trabajo

diario.

Configuracin Con el mdulo Configuracin puede adaptar el entorno de trabajo a su gusto. Para ello, TYPO3 ofrece, por ejemplo, la eleccin de idioma. Elija, de igual modo, la forma de presentacin del Backend segn sus preferencias o la capacidad de su pantalla. Puede configurar tambin si se deben mostrar como estndar textos de ayuda o Thumbnails, si estn permitidas la copia o eliminacin recursiva y si est permitida la carga de archivos. Establezca si quiere activos el "Rich Text Editor " (Editor de Texto Enriquecido) y el men contextual, y qu clase de ayudas se muestran en la introduccin de datos. Para elevar la seguridad, puede solicitar que se le informe por e-mail si alguien se registra con su cuenta.

Espacio de trabajo El Espacio de Trabajo, permite tener dos ambientes para trabajar uno de borrador (versionado) y uno en directo. En directo permite que los cambios tengan efecto inmediato en el sitio Web. Y el borrador o versionado slo se podr ver si es pasado a un espacio de trabajo en directo, De cualquier manera, el versionado puede aplicarse dentro de dicho Espacio de Trabajo.

- 13 -

El rea Modular " Herramientas" Este campo es, por lo general, accesible slo para administradores y ofrece, entre otras cosas, instrumentos para la administracin de usuarios, la revisin de la consistencia del banco de datos, para el anlisis de los ficheros de registro o logfiles esto es, para saber cundo y quin ha realizado cambios en la sesin Web y para la configuracin de instalaciones de TYPO3.

Campos Descripcin

Administracin de los usuarios Backend

El mdulo Administracin de los usuarios Backend representa el lugar central para el control del rea backend de TYPO3 en su pgina Web. Puede conseguir una vista general de todos los usuarios existentes y sus derechos, crear nuevos, agruparlos segn sus caractersticas y roles, establecer los derechos de acceso y la liberacin de archivos y configurar los perfiles de usuarios uno por uno. Este mdulo es un recurso imprescindible para los administradores en cuanto a la definicin de los roles de los distintos redactores como en cuanto al control de los derechos y seguridad de TYPO3.

Administracin de extensiones

El mdulo Administracin de extensiones sirve para la administracin de los distintos mdulos para el Backend y el Frontend. El ncleo del sistema de TYPO3 se encuentra claramente separado de las opciones avanzadas, que solamente en caso necesario pueden ser cargadas para algunas aplicaciones.

Verificacin BD Mediante el mdulo Verificacin BD, el administrador puede revisar la integridad de las tablas de banco de datos, que fueron creadas por la configuracin de tablas $TCA. Se consulta la existencia de los archivos cargados encadenados con los conjuntos de datos, que por lo general se halla en el ndice uploads/*. La visualizacin de la estructura completa de la pgina, inclusive pginas eliminadas (modo "rbol total de pginas"), una estadstica de todos los conjuntos de datos (modo "Grabar estadsticas") y el acceso a una funcin de bsqueda global de bases de datos (modo "Bsqueda total") son otros medios para el control de la consistencia de entrada a la Web.

Configuraciones

El mdulo Configuracin proporciona a los administradores un resumen de los valores de la configuracin de la tabla $TCA y de las variables de configuracin de TYPO3 $TYPO3_CONF_VARS. No obstante, usted tiene un acceso de slo lectura a los distintos valores.

Instalar TYPO3 ofrece para la instalacin del CMS una herramienta que facilita la configuracin fundamental y los componentes bsicos. El mdulo se remite solamente a esta herramienta que tiene su propia clave de seguridad y que puede ser desactivada cuando se desee.

phpMyAdmin Se ha establecido como interfaz de administracin para la base de datos MySql el phpMyAdmin. TYPO3 integra esta herramienta para el trabajo

- 14 -

directo con bases de datos. Una posible accin sera la creacin de tablas con bases de datos propias. No obstante se reclamara un manejo prudente para proteger la integridad de las bases de datos administradas por TYPO3.

Bitcora Permite acceder a la bitcora completa del backend de TYPO3. El rea Modular " Ayuda" Los mdulos ofrecen un primer acercamiento a TYPO3, una ayuda online sobre temas generales como tambin animaciones introductorias que, no obstante, se refieren al aspecto del backend-clsico.

Campos Descripcin Acerca de los mdulos Este mdulo le ofrece una breve descripcin de los mdulos que

se encuentran a su disposicin. La seleccin corresponde con la de su perfil de usuario.

Acerca de TYPO3 El mdulo Sobre TYPO3 le muestra toda una serie de datos sobre el Copyright, condiciones de licencia como tambin la versin de TYPO3 con la que est trabajando.

Manual El manual en lnea se basa en las fuentes de informacin de la ayuda sensible al contexto del sistema.

- 15 -

3.3 Crear pginas del sitio Web

Para crear la pgina principal de sitio (home), en el modulo Web seleccione el campo pgina (page) en el rea de navegacin haga clic derecho sobre New TYPO3 site y seleccione New (Fig. 9).

Figura 9: Crear nueva pgina

A continuacin se desplegarn distintas opciones, seleccione la opcin page (Inside) (Fig. 10).

Figura 10: Seleccin tipo de creacin page (Inside)

- 16 -

En la ventana desplegada (Fig. 11) asegrese que el check Hide page (Fig. 1111), este sin check, ya que si esta con check no se podr ver la pgina en el men del sitio, de lo contrario se podr visualizar como parte del men, en la opcin Pagetitle (Fig. 11-2) escriba el nombre que tendr su pgina principal (home) y finalmente en la parte superior izquierda de la ventana desplegada hay tres iconos ( Guardar, Guardar y cerrar, Cerrar) (Fig. 11-3) presione la imagen que indica guardar y cerrar (disquete con una cruz) y ya tendr su pgina principal creada.

Figura 11: Escribir nombre de la pgina principal (home).

2

3

1

- 17 -

Para crear ms sub-pgina que sern parte del men de su sitio Web. Haga clic sobre la pgina que acaba de crear (home). Luego en el mdulo Web seleccione Funciones (Functions), en la pantalla que se despliega en la opcin CREATE MULTIPLE PAGES, debe ingresar el nombre de las sub-pginas que se desean crear en cada uno de los cuadro de texto (Ej: login, menu1, menu2) y haga clic sobre el botn Create pages (Fig. 12).

Figura 12: Crear mltiples pginas.

Una vez que se tiene formado preliminarmente el rbol del sitio Web, si se desea crear otra pgina o crear otro tipo de pgina debe saber lo siguientes: 1. Al hacer clic sobre el cono (hoja de cuaderno) que indica la pgina, se despliega un men que le permite realizar varias acciones con la pgina seleccionada ver figura 13.

Figura 13: Men de una pgina al hacer clic sobre ella.

Visualizacin en la Web de la pgina

Poder Editar el contenido pgina

Crear nueva pgina

Visualizacin informacin general de la pgina

Copiar pagina y cortar la pgina

Estas opciones se habilitan una vez de haber seleccionado copiar o cortar una pgina y seleccionado una posible reubicacin, una opcin es para pega la pagina dentro de la seleccionada y la otra es dejarla a continuacin.

Ocultar la pgina o no presentar la pgina en el Men del sitio.

Editar las propiedades de la pgina

- 18 -

2. Luego, al hacer clic sobre la pgina de referencia para crear una nueva pgina (posicin de partida de la nueva pgina), del men desplegado seleccione Nuevo (New), al realizar esto se desplegar una pantalla que proporcionar dos opciones de posicin de la nueva pgina que se crear. Una es crear la pgina posicionada dentro de la pgina de referencia (Fig. 14-1), vale decir como una sub-pgina y la otra es crearla despus, es decir dejar la nueva pgina en el mismo nivel de la pgina de referencia. (Fig. 14-2).

Figura 14: Opciones de posicin de una nueva pgina.

1

2

- 19 -

3. Al seleccionar una de las opciones de crear pgina, se desplegar la pantalla de ingreso de informacin, aqu se realiza los mismo que se hizo para la creacin de la pgina principal, pero tomando en consideracin lo siguiente: Antes de escribir el titulo de la pgina se debe seleccionar en el item Tipo el tipo de pgina que se quiere crear, para esto se debe hacer clic sobre el cuadro de seleccin donde se desplegarn varias opciones (Fig. 15).

Figura 15: Opciones de tipos de pginas que se pueden crear.

En la siguiente tabla se da una pequea definicin de cada uno de las opciones de tipos de pginas que se pueden crear.

Opciones descripcin

Estandar Como ya indica el nombre, se trata del clsico tipo de pgina que usted, como redactor, utilizar ms frecuentemente junto con el tipo "Avanzada".

Avanzadas Con el tipo de pgina avanzada puede, incluir ms informacin para la pgina que en el tipo "Estndar.

Url externo Si quiere integrar en la estructura del men un enlace con una pgina externa, utilice entonces el tipo de pgina "URL externo". Tenga en cuenta, no obstante, que TYPO3 no puede garantizar la consistencia de la direccin ni los posibles cambios.

Acceso directo El tipo de pgina "Acceso directo" realiza las mismas funciones que el tipo "URL externo", tan slo que este tipo remite a una pgina interna de TYPO3. Por lo tanto es posible incluir en su

- 20 -

estructura de men un enlace con una pgina interna.

No presentar en el Men El tipo de pgina "No en el men" se corresponde en su funcionalidad con el tipo de pgina "estndar", diferencindose nicamente de ella en que no se presenta en la estructura del men o del mapa de la pgina Web.

Seleccin de usuario backend

Este tipo de pgina slo es accesible para usuarios del backend que tengan acceso de lectura de la pgina en el backend. Esta caracterstica se prev para tener un espacio en la Web en el que se puedan manejar elementos como noticias durante el proceso de trabajo, sin que sean visibles para los visitantes Frontend de su Web.

Delimitador Los delimitadores sirven para la estructuracin del men en el Frontend de su Web y no se puede hacer clic sobre ellas. Un requisito para su visibilidad es que sean consultadas en el template mediante TypoScript. Por ejemplo, en nuestra pgina de informacin del CMS, "- Las Pginas -" presenta una distancia. A la izquierda aparece la presentacin del backend en el diagrama de pginas; a la derecha, la vista del men en el frontend.

Carpeta del sistema Este tipo de pgina no se aparece en la pgina Web y puede ser utilizado como contenedor para distintas entradas. Ej.: En nuestra pgina de informacin del CMS, las categoras de las noticias estn grabadas en una "Carpeta del sistema".

Papelera Puede mover pginas a la "Cesta" sin eliminarlas totalmente. Estas pginas no podrn ser vistas en el Frontend.

- 21 -

3.4 Implementacin del template del sitio Web

Al realizar una visualizacin del sitio Web recin creado se obtendr la siguiente pantalla ver figura 16.

Figura 16: Pgina visualizada desde el frontend del sitio sin la implementacin del template.

Ejemplo la pgina visualizada es denominada "Licensing" y tiene el nmero de identificacin (uid) "5". Para realizar la implementacin del template se debe seleccionar en el modulo Web el campo Template y luego la pgina de inicio (home) y finalmente presionar el botn Create template for new sitio (Fig. 17).

Figura 17: Insertar template al sitio Web.

- 22 -

En la siguiente pantalla le mostrar la vista del mdulo Plantillas. Esta es usada para editar el registro de plantillas (template) haga clic en Clic here to edit whole template record y se desplegar el formulario para editar el registro de plantilla o incorporar uno nuevo (Fig. 18).

Figura 18: Pantalla para modificar el temlate.

En el formulario que se despliega ingresar la informacin necesaria para la creacin del template del sitio (Fig. 19):

Figura 19: Campos de inters del template del sitio Web.

El "Template title" es slo el ttulo de su registro de plantilla no se muestra en ninguna otra parte. El "Website title" ser un prefijo del ttulo de la pgina, tal como ser encontrado entre las etiquetas de cualquier pgina. El campo "Setup" es donde se introducen las instrucciones que hacen que la aplicacin reaccione de un cierto modo. Estas instrucciones estn contenidas en una estructura de informacin jerrquica definida por la sintaxis de TypoScript, por esto se encontrar con frecuencia que los registros de plantilla son aludidos como Plantillas TypoScript.

- 23 -

Las casillas de comprobacin "Clear constants" (Limpiar constantes) y "Clear setup" (Limpiar configuracin) sirven para hacer que no se herede ningn cdigo de configuracin de TypoScript a partir de registros de plantilla en un nivel superior del rbol (ms cerca de la raz), si existiese alguno. Estas casillas deberan ser marcadas siempre que el registro de plantilla en el que se esta trabajando vaya a servir como plantilla principal (Rootlevel, nivel raz). La casilla de comprobacin "Rootlevel" (nivel raz) es un indicador que, si est presente, significa simplemente: "Este registro de plantilla indica el comienzo de un nuevo sitio Web A continuacin se visualiza nuevamente la pgina llamada "Licensing":

Figura 20: vista de pgina una vez implementado un template.

Esta vez aparece algo diferente. Esto es lo que ha ocurrido, paso a paso, cuando su navegador proces la peticin (Fig. 21):

21: Funcionamiento interno de la herencia de template.

Peticin de pgina con uid "5" (# 1) Seleccin del primer registro de plantilla en esta pgina (pid=5); No se encuentra

nada! Ya que no se encontr ningn registro de plantilla en la pgina con uid "5",

comprobacin de la pgina anterior en la lnea del rbol de pginas.... (# 2) Seleccin del primer registro de plantilla de esta pgina, "Root page" (pgina raz),

(pid=1); Se encontr un registro de plantilla! Dado que se encontr un registro de plantilla en la pgina con uid 1, comprobacin

de si est marcada con el indicador de Rootlevel (nivel raz): Afirmativo, est marcada como "Rootlevel". Bien, entonces esto es el principio de un

sitio Web, de modo que los pasos a continuacin son: o Analizar la configuracin TypoScript del campo Setup (configuracin). o Comenzar a ejecutar las instrucciones del campo Setup.

- 24 -

3.5 Crear usuarios Frontend Para crear usuarios frontend de TYPO3 debe tener creada una carpeta para mantener el registro de los usuarios creados, luego haga clic sobre la carpeta creada, en el men desplegado seleccione nuevo, en la lista de opciones desplegadas seleccione Grupo de usuarios del Website con esta opcin se crea los distinto grupos de usuarios que tiene el sitio Web, es decir se realiza para dar distintos permisos a la paginas Web segn grupo de usuarios (Fig. 21-1)

Figura 21: Opciones para crear usuarios frontend.

En la pantalla despegada, para la creacin del grupo, en la seccin Groupstitle (titulo grupos) ingrese el nombre el grupo (Fig. 22) luego guarde y cierre.

Figura 22: Creacin de un grupo de usuarios frontend.

2

1

- 25 -

Posteriormente al crear el grupo realice de nuevo lo anteriormente descrito pero esta vez seleccione Usuario del Website (Fig. 21.2). Al realizar esto se desplegar una pantalla donde debe ingresar el nombre de usuario (Username) que tendr la persona ingresada al sistema y una clave de acceso (Password) luego seleccione el tems Groups el grupo al cual quiere que pertenezca y luego complete los campos de los datos personales de la persona que fue creada como usuario de frontend, finalmente presione cerrar y guardar. Con estos pasos ya tiene creado un usuario con acceso a pginas con privilegios y que pertenecen a un grupo de usuarios en especfico.

Figura 22: Crear usuario frontend.

- 26 -

3.6 Crear usuarios Backend Para la creacin de usuario backend se realiza de la misma forma que los usuarios fontend. Hacer clic en la raz de sitio New TYPO3 site luego seleccionar nuevo, en la pantalla desplegada seleccionar Grupos de operadores (Fig. 23.1).

Figura 23: Opciones para crear usuarios Backend.

En la pantalla desplegada ingrese el nombre del grupo a crear en Groupstitle y seleccione en el tem Include Access Lists el cuadro de seleccin (Fig. 24).

Figura 24: Crear grupo backend.

1

2

- 27 -

Al seleccionar el cuadro se mostrar una ventana con un mensaje presione Ok luego de realizar esto se desplegar 6 men que son utilizados para dar los distintos permisos a los usuarios creados que pertenezca al grupo que se esta creando. El primer men (Fig. 25) indica que mdulos (Modules) backend tendrn disponibles los miembros del grupo. Para seleccionarlo slo tiene que presionar la tecla control (Ctrl) y hacer clic con el Mouse sobre el o los mdulos deseados.

Figura 25: Asignar mdulos disponible para los miembros del grupo backend

- 28 -

En el Item Tables (listing) se selecciona que tabla puede ver el usuario en la lista de registros (No es necesario especificar aqu las tablas para modificacin) figura 26. Para la seleccin realice los mismos pasos indicados anteriormente.

Figura 26: Seleccin tablas disponibles

- 29 -

En el tem tables (Modify) se selecciona cuales son las tablas que podrn ser modificadas por los miembros del grupo (Fig. 27).

Figura 27: Seleccin de tablas disponibles para modificar.

- 30 -

En el item Page types se selecciona que tipo de pgina pueden utilizar los miembros del grupo, a continuacin en el item Allowed excludefields selecciona que campos de las tablas van a estar disponibles para los miembros del grupo (Fig. 28).

Figura 28: Seleccin de tipo de pgina disponible y seleccin de campos disponibles.

- 31 -

Finalmente en el tem Explicitly allow / deny field values, se puede seleccionar los tems que sern denegados para los miembros de este grupo figura 29.

Figura 29: Seleccin de los archivo denegados para el grupo creado.

En el item DB Mounts se debe seleccionar la pgina principal que compondr el rbol de sitio para el grupo de usuarios backend creado, para esto debe hacer clic sobre el icono de carpeta que muestra la figura 30, luego en la ventana desplegada se visualizara el rbol de pgina completo del sitio, seleccione la pgina que conformar el nuevo rbol de pgina para el grupo de usuario backend (Fig. 31) y quedar como muestra la figura 32.1.

Figura 30: Seleccin pgina que compondr el rbol del sitio para el grupo creado.

- 32 -

Figura 31: Ventana Desplegada con el rbol de pagina de todo el sitio.

Figura 32: Pgina seleccionada para el grupo.

1

2

- 33 -

En el tem File Mounts Para dar acceso a una carpeta que esta en lista de archivo de seleccionar el icono de una cruz negra (Fig. 32. 2) para crear el punto de entrada para el la carpeta del rbol de archivos, en la pantalla que se despliega ingrese en el cuadro de texto la ruta de la carpeta Ver figura 33), luego seleccione /fileadmin, que es la raz del rbol de carpetas, luego presiones el icono guardar y cerrar.

Figura 33: Crear punto de entrada para el la carpeta del rbol de archivos.

Para dar la carpeta al grupo de usuario que se esta creando se debe seleccionar el o los puntos de entrada de Archivos a los cuales tendrn accesos los usuarios backend del grupo que se esta creando (Fig. 34).

Figura 34: Seleccin punto de entrada para el la carpeta del rbol de archivos.

- 34 -

Luego de realizar todas las acciones para las distintas selecciones deseada, presione guardar y cerrar y ya tendr creado un grupo de usuario backend con los permisos seleccionados.

Ahora realice los pasos preliminares descritos anteriormente y seleccione esta vez Operadores (Fig. 23-2)

Al seleccionar operadores se le desplegara una pantalla donde debe ingresar el nombre de usuario (Username) que tendr la persona que esta siendo ingresada en el sistema y la contrasea (Password), adems debe seleccionar en el tems Group el grupo al que pertenecer y informacin personal de la persona que esta ingresando (Fig. 35).

Figura 35: Ingreso usuario backend.

- 35 -

Una vez creado el grupo en el mdulo Web seleccione el campo Acceso, en la pantalla desplegada en el cuadro de seleccin Profundidad seleccione el nivel de pginas que estarn disponibles para el grupo de usuario (Fig. 36-1). En el cuadro de lista de seleccin Resumen de usuarios seleccione Permisos (Fig. 36-2)

Figura 36: Permisos a los niveles de pgina seleccionado.

1

2

3

- 36 -

Luego, hacer clic sobre la imagen de un lpiz que se encuentra al lado del nombre de la pgina (Fig. 36-3), al realizar esto se le puede dar a la pgina los permisos que tendrn los miembros del grupos seleccionado sobre ella (editar pgina, editar contenido, eliminar, mostrar y crear), esta seleccin se realiza en el tems grupo (Fig. 37-1), y luego en el tems Permisos se pueden seleccionar o deseleccionar los permisos que se le darn a la pgina para el grupo seleccionado (Fig. 37-2).

Figura 37: permisos a la pgina seleccionada.

1

2

- 37 -

3.7 Crear contenido con la funcionalidad Noticia y Faq

3.7.1 Incorporar, configurar y crear contenido con la funcionalidad Noticia

La funcionalidad de noticia se utiliza para crear los destacados o noticias de los portales y adems puede ser utilizada para tener en el sitio estructura de contenido que esta permite, en este caso se trabajar con esta funcionalidad para ingresar contenido con ciertas caractersticas. Adems se trabajar con la funcionalidad Faq, que al igual que la anterior funcionalidad, permite dar una estructura de contenido dinmica y diferente. En este punto se tomar el caso de que el contenido de una pgina se divide en dos secciones: una formada con el contenido de la funcionalidad Noticia y el otro con la funcionalidad Faq. Para realizara la primera parte del contenido se deben seguir los siguientes pasos: Seleccin Pgina en el men de la izquierda en la seccin Web, luego seleccione la pgina a la cual se desea ingresar el contenido noticia, en la seccin rea de trabajo, haga clic en el botn Crear contenido de la pgina (Fig. 38).

Figura 38: Crear contenido.

- 38 -

En la pantalla que se despliega en la seccin Plugins seleccionar Noticias (Fig. 39)

Figura 39: Seleccionar funcionalidad Noticia.

En la ventana desplegada configurar la funcionalidad Noticia. Para esto realice lo siguiente: En la paleta de Opciones generales en la seccin Qu mostrar seleccionar LIST (Fig. 40).

Figura 40: Configuracin paleta opciones generales de la funcionalidad noticia seccin Que mostrar.

- 39 -

Luego, en la seccin Lugar de inicio haga clic sobre la carpeta que est al lado del cuadro de texto. En la ventana desplegada seleccionar, del rbol de pginas, la pgina a la cual se le est ingresando contenido (Fig. 41).

Figura 41: Configuracin paleta opciones generales de la funcionalidad noticia seccin Lugar de

inicio.

- 40 -

Luego, en la paleta Plantilla, en la seccin Fichero de plantilla haga clic en la carpeta ubicada al lado del cuadro de texto, en la pantalla que se despliega seleccione el template deseado para la noticia haciendo clic sobre la carpeta que contiene el tmplate o diseo que se le quiere dar a este contenido y luego haga clic sobre el archivo de diseo a implementar que se despliega (Fig. 42).

Figura 42: Seleccionar template o diseo del contenido.

- 41 -

Luego, en la seccin Max width.. (280) ingrese en el cuadro de texto el ancho de la imagen, en la seccin Max height.. (210) ingrese el alto de la imagen (Fig. 43).

Figura 43: Ingresar tamao de la imagen que ir acompaando el contenido.

Finalmente, haga clic en el cono disquete con un cruz (ubicada en la parte superior izquierda de la pantalla donde se est trabajando): Lo que se acaba de hacer es: Guardar y cerrar. Una vez realizada la configuracin se debe ingresar el contenido de la funcionalidad noticia para esto se debe realizar lo siguiente: Haga clic sobre el cono hoja que especifica la pgina a la cual est ingresando el contenido noticia, en la pantalla que se despliega seleccione Nuevo (Fig.44).

Figura 44: Seleccionar nuevo contenido.

- 42 -

En la lista que se despliega en el rea de trabajo seleccione Noticia (Fig. 45).

Figura 45: Seleccin de contenido Noticia.

- 43 -

Posteriormente, en la Paleta General, se desplegar una pantalla donde deber ingresar la informacin correspondiente a los tems Titulo y Texto. Importante es que deseleccione el checkbox Ocultar(figura 46).

Figura 46: Crear contenido noticia paleta General.

- 44 -

Luego, seleccione la segunda paleta Relations, aqu podr escoger la imagen que acompaar al texto ingresado en el paso anterior. Los pasos son: en la seccin Imgenes, haga clic sobre el cono carpeta y se desplegar una pantalla con el rbol de archivo; seleccione de sta la imagen que desea implementar (Fig. 47).

Figura 47: Asignar imagen al contenido.

Para terminar, haga clic en el cono disquete con una cruz. Lo que ud. ha hecho es guardar y cerrar.

- 45 -

3.7.2 Incorporar, configurar y crear contenido con la funcionalidad Faq

Para realizar el ingreso de la segunda seccin, luego del plugin de noticias que se acaba de crear presionar el icono Agregar nuevo registro despus de este (Fig. 48)

Figura 48: Agregar nuevo contenido.

En la pantalla desplegada en la seccin Plugin Haga clic en Modern FAQ (Fig. 49).

Figura 49: Seleccin funcionalidad Faq.

- 46 -

En la pantalla desplegada configurar la funcionalidad Faq. Los pasos son: En la pantalla desplegada dirjase a la seccin Lugar de Inicio y haga clic sobre la carpeta ubicada al lado del cuadro de texto. En la pantalla desplegada seleccione la pgina a la cual est ingresando (Fig. 50).

Figura 50: Configuracin funcionalidad Faq.

Luego de realizar los pasos anteriormente mencionados presione la imagen de disquete con una cruz. Recuerde que esto significa Guardar y cerrar

- 47 -

Ahora para ingresar los contenidos y completar la tarea, realice lo siguiente: Haga clic sobre el cono de la pgina en la que se est trabajando, en el men que se despliega seleccione Nuevo (Fig. 51).

Figura 51: Seleccionar nuevo contenido.

Luego, en la pantalla desplegada seleccione FAQ (Fig. 52).

Figura 52: Seleccin de contenido Faq.

- 48 -

Una vez hecho lo anterior, en la pantalla desplegada, ingrese la informacin necesaria en la seccin questions y answers, lo que equivaldr a: ttulo y texto.

Figura 53: Crear contenido Faq.

Luego de ingresar la informacin haga clic en el cono del disquete con una cruz Guardar y cerrar.

- 49 -

De esta manera finaliza el ingreso de contenidos a una pgina con las funcionalidades faq y Noticias. Para visualizar ambos contenidos (Noticia y FAQ) seleccione en el men de la izquierda, el modulo Web Lista (Fig. 54)

Figura 54: Vista de los contenidos Noticias y Faq.

Para editar los contenidos recin ingresados slo debe hacer clic en el cono lpiz que acompaa al contenido (Ver figura 54).

- 50 -

3.8 Administrador de extensiones (funcionalidades Typo3) En el administrador de extensiones de typo3 se puede: habilitar y deshabilitar funcionalidades, instalar funcionalidades. Para acceder al administrador de extensiones: en el men de la izquierda del backend de typo3, en el mdulo Herramienta, debe seleccionar Adm. Extensiones. En la pantalla que se despliega, en la parte superior izquierda, encontrar un combobox denominado Men, el cual entrega varias herramientas para la administracin de extensiones. stas son (Fig. 55):

1. Load extensions. Muestra las extensiones que han sido instaladas y que estn habilitadas.

2. Install extensions. Muestra todas la extensiones que han sido instaladas, tanto las habilitadas como las deshabilitadas.

3. Import extensions. Permite instalar nuevas extensiones o actualizar las extensiones ya instaladas.

Figura 55: Men del administrador de archivos.

- 51 -

Al seleccionar load extensin se visualizan todas la extensiones habilitadas. Para deshabilitar una de stas ud. debe hacer clic sobre el cono crculo verde con un guin blanco (Fig. 56).

Figura 56: Seleccin de icono para deshabilitar una extensin.

A continuacin, en la pantalla que se despliega, haga clic en Remove extension para completar la deshabilitacin (Fig. 57).

Figura 57: Deshabilitar una extensin.

- 52 -

Si una vez deshabilitada la extensin ud. desea saber en qu ubicacin qued guardada slo deber ir al men del administrador de extensiones y seleccionar Install extensions. Con esta opcin se vern todas las extensiones instaladas habilitadas (cono crculo en verde) y deshabilitadas (cono crculo en gris) (Fig. 58). Si ud. quiere habilitar una o ms extensiones deber seguir los pasos descritos anteriormente.

Figura 58: Vista de extensiones habilitadas y deshabilitadas.

- 53 -

Para instalar una extensin ud. deber seleccionar, en el men del administrador de extensiones, Import extensions. Luego, en la pantalla que se despliega, deber hacer clic en el botn Examinar y buscar en su directorio la extensin que desea instalar. Luego, seleccione el cuadro de seleccin Overwrite any existing extensin!, esto si la extensin existe y se quiere sobrescribir, de lo contrario no es necesario. Finalmente, haga clic en Upload extension file (Fig. 59).

Figura 59: Seleccionar extensin para instalar.

Luego, en la pantalla que se despliega haga clic en Install extension (Fig. 60).

Figura 60: Instalar la extensin.

- 54 -

Una vez instalada la extensin se despliega una pantalla de actualizacin de la instalacin que se realiz. Para finalizar con el proceso haga clic en Make updates (Fig. 61).

Figura 61: Realizar la actualizacin de la instalacin de la extensin.

- 55 -

3.9 Administrador de Archivos

El administrador de archivos permite mantener y manejar los archivos que son parte del sitio Web. Para acceder haga clic en Lista de archivo, Despus, para crear una carpeta dnde sern guardados los archivos que pertenecern o se utilizarn en el sitio, haga clic sobre el cono verde que indica Fileadmin y luego en la pantalla que se despliega seleccione Nuevo (62).

Figura 62: Crear carpeta que contendrn los archivos.

En la pantalla que se despliega, encontrar un combo box (Fig. 63-1) que permite crear la cantidad de carpeta que se desean, de una sola vez. Adems, muestra un cuadro de texto donde se incorpora el nombre de la/las carpetas que se quiere(n) crear (Fig. 63-2). Los cuadros de texto que se mostrarn correspondern a la cantidad de carpetas a ser creadas. Una vez ingresado el nombre haga clic en el botn Crear carpetas (Fig. 63-3).

Figura 63: Crear carpeta en administrador de archivos.

1

2

3

- 56 -

Una vez creada la carpeta haga clic sobre el cono de la carpeta y en la pantalla que se despliega seleccione Enviar archivos (Fig. 64).

Figura 64: Seleccin de opcin para subir archivos al sitio.

En la pantalla que se despliega, se puede ver un combo box que permite seleccionar la cantidad de archivos que se desean subir (Fig. 64-1). Haga clic sobre ste y seleccione la cantidad de archivo, luego se desplegarn los cuadro de texto con el botn Examinar, segn la cantidad seleccionada en el combo box (Fig. 64-2); si los archivo ya existen en la carpeta y se quieren sobrescribir debe seleccionar el checkbox llamado Sobrescribir archivos existentes (Fig. 64-3). Para finalizar haga clic en el botn examinar y busque en su directorio el archivo a subir (Fig. 64-4).

Figura 64: Seleccin de opcin para subir archivos al sitio.

1

2

3

4

- 57 -

Una vez realizados los pasos anteriormente mencionados ud. podr ver el archivo que se acaba de subir al sitio y podr acceder a l de cualquier parte de contenidos o donde se requiera del archivo dentro del typo3. Si ud. quiere subir ms archivos se puede seguir los pasos antes mencionado o seleccionar la carpeta y en el contenido que se despliega seleccionar el botn Enviar archivo (Fig. 65).

Figura 65: Ver archivo en el sitio y subir archivo con otra opcin presentada.

- 58 -

4. BIBLIOGRAFIA

http://www.typo3.org/documentation/