Modificar menu share

cancel
Showing results for 
Search instead for 
Did you mean: 
dknee
Member II

Modificar menu share

Hola, soy novato en alfresco… mi versión de alfresco es la 3.4b y estoy realizando modificaciones gráficas para mi empresa.

Quiero modificar el menu superior de share (donde está mi panel de inicio, sites, etc) querría mostrar en los botones la imagen a la izquierda y el texto a la derecha… he visto que hay un fichero header.css que tiene pinta de tener la información que quiero modificar…

Sabeis si es posible realizar ese cambio y en ese caso en que ruta tendria que desplegar en tomcat el fichero modificado?  porque todavia no tengo muy claro dónde hay que desplegar cada archivo para coger los cambios… como os digo soy muy novato aun…

Muchas gracias y un saludo
5 Replies
nemrp
Member II

Re: Modificar menu share

Hola drodilla.

Yo no tocaría ese archivo por dos motivos:
  1. No puedes llevártelo (hacer una copia) a "shared" (zona en la que deben ubicarse las copias de los archivos que queremos modificar y que está a la misma altura de "webapps" donde esté desplegado Alfresco Share). Sólo puedes copiar a "shared" aquellos archivos que estén a partir de "\webapps\share\WEB-INF\classes\alfresco\".

  2. Modificar los estilos no es recomendable porque pueden influir en la presentación de otros elementos de la misma página o de otras distintas.
Así pues, yo te recomiendo modificar la plantilla.

Antes de comenzar una pequeña explicación (made in me Smiley Happy). Las plantillas son las encargadas de contener es "esqueleto" de las páginas. Algunas de ellas utilizan o se apoyan en otras plantillas que son incluidas (normalmente mediante el uso de macros; entiende "macro" como una función con elementos de entrada y cuya salida es un trozo o bloque de código).

Este es el caso que estamos tratando. Tal es así que la plantilla que se encarga de presentar la cabecera es "header.get.html.ftl", que se encuentra en "\webapps\share\WEB-INF\classes\alfresco\site-webscripts\org\alfresco\components\header\". Pero esta plantilla, para presentar los enlaces de la cabecera hace uso de otra que contiene la macro. Ésta es "header.inc.ftl" y la macro es "renderItems".

Llamada a la macro en la plantilla "header.get.html.ftl" en la línea 31.
<span id="${id}-appItems" class="app-items hidden"><@header.renderItems config.global.header.appItems id "app" /></span>
Macro "renderItems" en "header.inc.ftl" en la línea 8.
<#–
   Application and User Items entrypoint
–>
<#macro renderItems p_root p_id p_type>
   <#assign id = p_id>
   <#assign js = "">

   <#– Render an application item –>
   <#list p_root.items as item>
      <@menuItem item p_type />
      <#if p_type = "user" && item_has_next><span class="separator"> </span></#if>
   </#list>
   <#– Remove first comma –>
   <#if js?starts_with(",")><#assign js = js?substring(1)></#if>
</#macro>
Curiosamente esta macro contiene un bucle en el que se llama a otra macro ("menuItem, en la línea 14).

<@menuItem item p_type />
Así pues, llegamos a nuestro objetivo. Es esa macro la que se encarga de la lógica que permite presentar el menú. De manera que seguimos los siguientes pasos
  1. Copiar el archivo "header.inc.ftl", que está en "\webapps\share\WEB-INF\classes\alfresco\site-webscripts\org\alfresco\components\header\", en la ruta "\shared\classes\alfresco\web-extension\site-webscripts\org\alfresco\components\header\". Si esta ruta no existe debes crearla.

  2. Abrir esta copia e ir a la línea 32.


  3. <#assign attrStyle><#if (item.icon?length > 0)>style="background-image: url(${url.context}/res/components/images/header/${item.icon});"</#if></#assign>
    En esta línea se crea una variable ("attrStyle") a la cual se le asigna el siguiente código:

    style="background-image: url(${url.context}/res/components/images/header/${item.icon});"
    Aquí se encuentra el estilo del icono que podemos modificar. Aquí podemos introducir el código html que queramos dándole un aspecto distinto.
  4. Ir a la línea 40.


  5. <span class="first-child" ${attrStyle!""}>
    A este "span" se le asigna el estilo definido anteriormente en la variable "attrStyle". Este código html podemos modificarlo también a nuestro antojo (cambiar el span por un "div", no olvides su cirre, eliminarlo, etc).
  6. En las siguientes líneas se presenta una casuística que mostrara una cosa u otra dependiento del tipo del item. Lo que hay en su interior son llamadas a las funciones javascript de la librería de Yahoo. Pero si nos fijamos en todos los casos está presenta la presentación del botón, al que también podemos modificar sus estilos añadiéndole el atributo "style".
Bueno, siento la parrafada, pero como decías que estabas empezando en esto he intentado dejarlo todo explicado y lo más claramente posible. En cualquier caso, si tienes dudas ya sabes que puedes contar con este foro para resolverlas.

Un saludo y suerte :wink:.
dknee
Member II

Re: Modificar menu share

Muchisimas gracias por tu explicación Smiley Happy me ha resultado muy clara y de gran utilidad, siento no haber contestado antes, pero pensaba que alfresco me avisaría cuando tuviese una contestación y no es así…
un saludo
nemrp
Member II

Re: Modificar menu share

Hola drodilla.

No te preocupes, lo importante es que te haya servido y que hayas vuelto para comentarlo. Ahora lo que te queda hacer es poner este hilo como "RESUELTO".

Por cierto, para que te lleguen avisos de respuestas al correo debes marcar la casilla que hay en las opciones (abajo) cuando respondes en un hilo. O bien entrar en la configuración de tu cuenta y marcar esa opción ("Enviarme un email cuando un mensaje es respondido").

Un saludo.
rrbatista
Member II

Re: Modificar menu share

Hola…

Tengo alfresco 4.0a instalado y he hecho una migración desde alfresco 3.4d todo me funciona de maravilla excepto que en el share no puedo personalizar el panel de inicio de un sitio en particular. Todos los demas sitios si que me muestran el botón Personalizar el panel de Inicio para poder personalizar el panel de cada sitio, pero el sitio principal donde tengo toda la informacion de la empresa, digamos el sitio principal de dicha empresa, que funciona como nuestra intranet, en este no me muestra el botón Personalizar el panel de Inicio y necesito activarlo porque es necesario personalizar el panel para este sitio en particular.

En la instalación anterior desde donde hice la migracion que era la 3.4 tampoco me mostraba ese boton.

Agradezco de antemano la ayuda

Un saludo
RRBATISTA
cristinamr
Advanced

Re: Modificar menu share

Buenas.

Pillate le firebug (extension del firefox) para poder ver qué componente se está llamando. Es super útil para este tipo de cosas Smiley Wink
Mira a ver qué te pinta en ese sitio, y qué te pinta en un sitio en el que se vea (es decir como hace la llamada). También podrías mirar el código fuente de esa página a ver qué hay.

Comentanos y te echamos un cable.

Un saludo.
--
VenziaIT: helping companies since 2005! Our ECM products: AQuA & Seidoc