Share - dashlet - stylesheet

As we transition to the new Hyland Community, some post links may be temporarily disrupted as we finalize redirects. We apologize for the inconvenience and are working to resolve this as quickly as possible. Details.

luigi

Ciao a tutti,

stavo provando a creare una dashlet in Alfresco Share 4.2.e, seguendo questo <a href='http://zlayer.net/blog/?p=255'>esempio</a>.

Il risultato è quello atteso ovviamente, e riesco a visualizzarlo all'indirizzo

http://127.0.0.1:8080/share/page/components/dashlets/my-dashlet
‍‍‍

L'unica cosa che non sono riuscito ad applicare è la parte relativa allo stylesheet, ossia

<@markup id="css" >
 <#– Link to your CSS file –>
 <@link rel="stylesheet" type="text/css" href="${url.context}/res/components/dashlets/my-dashlet.css" group="dashlets"/>
</@>
‍‍‍‍‍‍

La pagina sembra non recepire le direttive css. Come se non interpretasse gli stili.
L'url è corretto. Se eseguo

http://127.0.0.1:8080/share/res/components/dashlets/my-dashlet.css
‍‍‍

mi visualizza il contenuto del file css.

Per creare la dashlet ho creato un jar (jar cfv myalfdashlet.jar *) sulla seguente struttura:

alfresco
           –| site-webscripts
                              —-| dashlets
                                          ——| my-dashlet.get.desc.xml
                                          ——| my-dashlet.get.html.ftl
                                          ——| my-dashlet.get.properties
META-INF
           –| components
                         —-| dashlets
                                     ——| my-dashlet.css
   
<b>my-dashlet.get.desc.xml</b>      

<webscript>
  <shortname>My Dashlet</shortname>
  <description>Example dashlet</description>
  <family>user-dashlet</family>
  <url>/components/dashlets/my-dashlet</url>
</webscript>
‍‍‍‍‍‍‍‍

<b>my-dashlet.get.html.ftl</b>

<@markup id="css" >
 <#– Link to your CSS file –>
 <@link rel="stylesheet" type="text/css" href="${url.context}/res/components/dashlets/my-dashlet.css" group="dashlets"/>
</@>

<@markup id="html">
  <@uniqueIdDiv>
    <div class="dashlet my-class">
      <div class="title">${msg("header.title")}</div>
        <div class="body">${msg("text.hello")}</div>          
      </div>
      <div class="blogs-greeting-io">${url.context}</div>
    </@>
 </@>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

<b>my-dashlet.get.properties</b>

header.title=My dashlet
text.hello=Hello world !!
‍‍‍‍

<b>my-dashlet.css</b>

.title {color:orange;}
.blogs-greeting-io {
   padding: 10px;
   color: orange;
   font-weight: bold;
}
‍‍‍‍‍‍‍‍

                                    
Il jar l'ho poi inserito in tomcat_home/shared/lib e riavvito il server.

Quale idea in proposito ?

Grazie.
Luigi

davidciamberlan

Ciao,

il codice sembra corretto.
Il problema secondo me è dovuto al fatto che le proprietà che setti nel tuo css vengono sovrascritte da qualche altro css.

Per capire se il problema è questo, puoi provare a inserire nel file ftl un elemento di prova con un id personalizzato come ad esempio:

<div id="my-dashlet">Prova!</div>‍

e poi aggiungere una regola nel css per questo nuovo elemento.

#my-dashlet { color: red; }‍

.

Ricarica tutto (consigliato per evitare problemi di cashing con il css) e se vedi la scritta "Prova!" in rosso, allora il problema è quello che ti ho detto.

In questo caso puoi inserire nel tuo elemento degli id (o class) personalizzati nel tuo elemento, (es:

<div class="my-title">…‍

oppure inserire la direttiva !important dopo la proprietà che vuoi modificare (

color: red !important‍

).
Attenzione però che se fai in questo modo per la classe "title" cambierai il colore di tutte le dashlet.

Spero questo risolva il tuo problema.