topic Re: Changeing font color in Alfresco Archive

Changeing font color

_valerio_ — Fri, 16 Apr 2010 09:48:01 GMT

Hi everybodyI'd like to know how to modify the background color (from pale blue to green) of alfresco explorer's bars (shelf,breadcrumb,toolbar, ecc…); I tried to modify the files "main" and "picker" stored in C:\Alfresco\tomcat\webapps\alfresco\css, but I didn't succeed.Is there a way to do this?Th

Re: Changeing font color

hsohaib — Fri, 16 Apr 2010 11:42:15 GMT

the colors you want to change comes from images, so you will want to edit the images in "images\parts", also some colors are included in jsp files, so you might wanna use some "search and replace" tools like "grepwin" to replace them with the colors you want

Re: Changeing font color

_valerio_ — Fri, 16 Apr 2010 12:41:43 GMT

thanks hsohaib for your reply

Re: Changeing font color

_valerio_ — Tue, 20 Apr 2010 10:21:56 GMT

changing the images in C:\Alfresco\tomcat\webapps\alfresco\images\parts I was able to change a lot of the bars, but I'm not able to change the background color of the header (the bar where is typed the location in which you are, as example "Company Home").

please help me!

Re: Changeing font color

hsohaib — Tue, 20 Apr 2010 17:09:18 GMT

change background color of "headbarTitle" in main.css :


.headbarTitle
{
   color: #004488;
   font-size: 12px;
   font-weight: bold;
   margin-top: 5px;
   margin-bottom: 5px;
   background: #dfe6ed;
   vertical-align: center;
   padding-left: 6px;
}
‍‍‍‍‍‍‍‍‍‍‍‍‍

hope it helps.
PS: you might wanna intall firebug and fontfinder in firefox, helps alot finding in which css you should make the changes

Re: Changeing font color

_valerio_ — Wed, 21 Apr 2010 07:41:44 GMT

thanks very much hsohaib! the extensions you suggested (expecially firebug) were very precious! before your post I was checking the files to modify manually (I found that some files to modify were browse.jsp, breadcrumb.jsp and some GIF in the images folder), now I will be faster!

Re: Changeing font color

_valerio_ — Wed, 21 Apr 2010 10:25:33 GMT

just another question: which files makes up the alfresco page? I found, with the assistance of firebug, that the browse.jsp is used to compose the headbar (I deduced that from the following code)


<html>
           .
           .
           .
<body>
           .
           .
           .
<form enctype="application/x-www-form-urlencoded" accept-charset="UTF-8" action="/alfresco/faces/jsp/browse/browse.jsp" method="post" name="browse" id="browse" target="">
           .
           .
           .
<td bgcolor="#XXXXXX">
           .
           .
           .
</body>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

but I'm not able to find wich file is used for the footer (to eliminate the links to http://www.alfresco.com/); the firebug displays:


<center>
<table style="margin: 0px auto;">
           .
           .
           .
<a href="http://www.alfresco.com">
             <img height="26" width="176" src="http://www.alfresco.com/assets/images/logos/community-edition-3.2r.png" title="Alfresco Community" alt=""style="border-width: 0px; vertical-align: middle;">
</a>
<span class="footer">
           .
           .
           .
<a href="http://www.alfresco.com/services/support/communityterms/#support" class="footer">no support</a>
<a href="http://www.alfresco.com/services/support/communityterms/#certification" class="footer">no certification</a>
<a href="http://www.alfresco.com/services/support/communityterms/#maintenance" class="footer">no maintenance</a>
           .
           .
           .
<a href="http://www.alfresco.com/services/support/" class="footer">Click here for support</a>
. Alfresco Software Inc. &copy; 2005-2009 All rights reserved.
</span>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

but this code isn't present in browse.jsp

Re: Changeing font color

hsohaib — Wed, 21 Apr 2010 14:34:09 GMT

the footer is generated by the class "org.alfresco.web.ui.repo.tag.PageTag", which a jsf bean, so if you want to remove it you need to create your own PageTag which extends TagSupport, compile it, and replace "org.alfresco.web.ui.repo.tag.PageTag" in faces-config.xml or faces-config-custom.xml by your own, here is an example , you will need to change just getAlfrescoButton():


import java.io.IOException;
import java.io.Writer;

import javax.faces.context.FacesContext;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.tagext.TagSupport;

import org.alfresco.web.app.Application;
import org.alfresco.web.app.servlet.FacesHelper;
import org.alfresco.web.bean.coci.CCProperties;
import org.alfresco.web.ui.common.Utils;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;


public class GidPageTag extends TagSupport
{
      private static final long serialVersionUID = 8142765393181557228L;
      
      private final static String SCRIPTS_START = "<script type=\"text/javascript\" src=\"";
      private final static String SCRIPTS_END   = "\"></script>\n";
      private final static String STYLES_START  = "<link rel=\"stylesheet\" href=\"";
      private final static String STYLES_MAIN   = "\" type=\"text/css\">\n";
      private final static String IE6COND_START = "<!–[if IE 6]>\n";
      private final static String IE6COND_END   = "<![endif]–>\n";

      private final static String[] SCRIPTS = 
      {
         // menu javascript
         "/scripts/menu.js",
         // webdav javascript
         "/scripts/webdav.js",
         // base yahoo file
         "/scripts/ajax/yahoo/yahoo/yahoo-min.js",
         // io handling (AJAX)
         "/scripts/ajax/yahoo/connection/connection-min.js",
         // event handling
         "/scripts/ajax/yahoo/event/event-min.js",
         // mootools
         "/scripts/ajax/mootools.v1.11.js",
         // common Alfresco util methods
         "/scripts/ajax/common.js",
         // pop-up panel helper objects
         "/scripts/ajax/summary-info.js",
         // ajax pickers
         "/scripts/ajax/picker.js",
         "/scripts/ajax/tagger.js"
      };
      
      private final static String[] CSS = 
      {
         "/css/main.css",
         "/css/picker.css"
      };

      private final static String[] IE6COND_CSS = 
      {
         "/css/ie6.css"
      };

   /**
    * Please ensure you understand the terms of the license before changing the contents of this file.
    */
      
      private final static String ALF_LOGO_HTTP  = "http://www.google.fr/intl/fr_fr/images/logo.gif";
      private final static String ALF_LOGO_HTTPS = "https://www.alfresco.com/assets/images/logos/community-edition-3.2.png";
      private final static String ALF_URL   = "http://www.alfresco.com";
      private final static String ALF_TEXT  = "Alfresco Community";
      private final static String ALF_COPY  = "Supplied free of charge with " +
           "<a class='footer' href='http://www.alfresco.com/services/support/communityterms/#support'>no support</a>, " +
           "<a class='footer' href='http://www.alfresco.com/services/support/communityterms/#certification'>no certification</a>, " +
           "<a class='footer' href='http://www.alfresco.com/services/support/communityterms/#maintenance'>no maintenance</a>, " +
           "<a class='footer' href='http://www.alfresco.com/services/support/communityterms/#warranty'>no warranty</a> and " +
           "<a class='footer' href='http://www.alfresco.com/services/support/communityterms/#indemnity'>no indemnity</a> by " +
           "<a class='footer' href='http://www.alfresco.com'>Alfresco</a> or its " +
           "<a class='footer' href='http://www.alfresco.com/partners/'>Certified Partners</a>. " +
           "<a class='footer' href='http://www.alfresco.com/services/support/'>Click here for support</a>. " +
           "Alfresco Software Inc. &copy; 2005-2009 All rights reserved.";
      
      private final static Log logger = LogFactory.getLog(GidPageTag.class);
      private static String alfresco = null;
      private static String loginPage = null;
      
      private long startTime = 0;
      private String title;
      private String titleId;
      private String doctypeRootElement;
      private String doctypePublic;
      private String doctypeSystem;
      
      /**
       * @return The title for the page
       */
      public String getTitle()
      {
         return title;
      }

      /**
       * @param title Sets the page title
       */
      public void setTitle(String title)
      {
         this.title = title;
      }
      
      /**
       * @return The title message Id for the page
       */
      public String getTitleId()
      {
         return titleId;
      }

      /**
       * @param titleId Sets the page title message Id
       */
      public void setTitleId(String titleId)
      {
         this.titleId = titleId;
      }

      public String getDoctypeRootElement()
      {
         return this.doctypeRootElement;
      }

      public void setDoctypeRootElement(final String doctypeRootElement)
      {
         this.doctypeRootElement = doctypeRootElement;
      }
      
      public String getDoctypePublic()
      {
         return this.doctypePublic;
      }

      public void setDoctypePublic(final String doctypePublic)
      {
         this.doctypePublic = doctypePublic;
      }

      public String getDoctypeSystem()
      {
         return this.doctypeSystem;
      }
      
      public void setDoctypeSystem(final String doctypeSystem)
      {
         this.doctypeSystem = doctypeSystem;
      }
      
      public void release()
      {
         super.release();
         this.title = null;
         this.titleId = null;
         this.doctypeRootElement = null;
         this.doctypeSystem = null;
         this.doctypePublic = null;
      }

      /**
       * @see javax.servlet.jsp.tagext.TagSupport#doStartTag()
       */
      public int doStartTag() throws JspException
      {
         if (logger.isDebugEnabled())
            startTime = System.currentTimeMillis();
         
         try
         {
            String reqPath = ((HttpServletRequest)pageContext.getRequest()).getContextPath();
            Writer out = pageContext.getOut();
            
            if (!Application.inPortalServer())
            {
               if (this.getDoctypeRootElement() != null &&
                   this.getDoctypePublic() != null)
               {
                  out.write("<!DOCTYPE ");
                  out.write(this.getDoctypeRootElement().toLowerCase());
                  out.write(" PUBLIC \"" + this.getDoctypePublic() + "\"");
                  if (this.getDoctypeSystem() != null)
                  {
                     out.write(" \"" + this.getDoctypeSystem() + "\"");
                  }
                  out.write(">\n");
               }
               else
               {
                  out.write("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\"\n");
                  out.write("    \"http://www.w3.org/TR/html4/loose.dtd\">\n");
               }
               out.write("<html><head><title>");
               if (this.titleId != null && this.titleId.length() != 0)
               {
                  out.write(Utils.encode(Application.getMessage(pageContext.getSession(), this.titleId)));
               }
               else if (this.title != null && this.title.length() != 0)
               {
                  out.write(Utils.encode(this.title));
               }
               else
               {
                  out.write("Alfresco Web Client");
               }
               out.write("</title>\n");
               out.write("<link rel=\"search\" type=\"application/opensearchdescription+xml\" href=\"" + reqPath + 
                         "/wcservice/api/search/keyword/description.xml\" title=\"Alfresco Keyword Search\">\n");
               out.write("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\">\n");
            }
            
            // CSS style includes
            for (final String css : GidPageTag.CSS)
            {
               out.write(STYLES_START);
               out.write(reqPath);
               out.write(css);
               out.write(STYLES_MAIN);
            }
            
            // IE6COND_CSS style includes
            out.write(IE6COND_START);
            for (final String ie6cond_css : GidPageTag.IE6COND_CSS)
            {
               out.write(STYLES_START);
               out.write(reqPath);
               out.write(ie6cond_css);
               out.write(STYLES_MAIN);
            }
            out.write(IE6COND_END);
            
            // JavaScript includes
            for (final String s : GidPageTag.SCRIPTS)
            {
               out.write(SCRIPTS_START);
               out.write(reqPath);
               out.write(s);
               out.write(SCRIPTS_END);
            }
            
            out.write("<script type=\"text/javascript\">"); // start - generate naked javascript code

            // set the context path used by some Alfresco script objects
            out.write("setContextPath('");
            out.write(reqPath);
            out.write("');");

            // generate window onload code
            generateWindowOnloadCode(out);

            out.write("</script>\n"); // end - generate naked javascript code

            if (!Application.inPortalServer())
            {
               out.write("</head>");
               out.write("<body>\n");
            }
         }
         catch (IOException ioe)
         {
            throw new JspException(ioe.toString());
         }
         
         return EVAL_BODY_INCLUDE;
      }

      /**
       * @see javax.servlet.jsp.tagext.TagSupport#doEndTag()
       */
      public int doEndTag() throws JspException
      {
         try
         {
            HttpServletRequest req = (HttpServletRequest)pageContext.getRequest();
            if (req.getRequestURI().endsWith(getLoginPage()) == false)
            {
               pageContext.getOut().write(getAlfrescoButton());
            }
            
            if (!Application.inPortalServer())
            {
               pageContext.getOut().write("\n</body></html>");
            }
         }
         catch (IOException ioe)
         {
            throw new JspException(ioe.toString());
         }
         
         if (logger.isDebugEnabled())
         {
            long endTime = System.currentTimeMillis();
            logger.debug("Time to generate page: " + (endTime - startTime) + "ms");
         }
         
         return super.doEndTag();
      }
      
      private String getLoginPage()
      {
         if (GidPageTag.loginPage == null)
         {
            GidPageTag.loginPage = Application.getLoginPage(pageContext.getServletContext());
         }
         
         return GidPageTag.loginPage;
      }

   /**
    * Please ensure you understand the terms of the license before changing the contents of this file.
    */

      private String getAlfrescoButton()
      {
         if (GidPageTag.alfresco == null)
         {
            final HttpServletRequest req = (HttpServletRequest)pageContext.getRequest();
            String contextPath = req.getContextPath();
//            GidPageTag.alfresco = ("<center><table style='margin: 0px auto;'><tr><td>" +
//                                "<a href='" + ALF_URL + "'>" +
//                                "<img style='vertical-align:middle;border-width:0px;' width='176' height='26' alt='' title='" + ALF_TEXT + 
//                                "' src='" + ("http".equals(req.getScheme()) ? ALF_LOGO_HTTP : ALF_LOGO_HTTPS) + 
//                                "'>" +"</a></td><td align='center'>" +
//                                "<span class='footer'>" + ALF_COPY +
//                                "</span></td><td></td></tr></table></center>");
            
            GidPageTag.alfresco = ("MY FOOTER HTML");
         }
         return GidPageTag.alfresco;
      }

      /**
       * This method generate code for setting window.onload reference as
       * we need to open WebDav or CIFS URL in a new window.
       * 
       * Executes via javascript code(function onloadFunc()) in "onload.js" include file.
       * 
       * @return Returns window.onload javascript code
       */
      private static void generateWindowOnloadCode(Writer out)
         throws IOException
      {
         FacesContext fc = FacesContext.getCurrentInstance();
         if (fc != null)
         {
             CCProperties ccProps = (CCProperties)FacesHelper.getManagedBean(fc, "CCProperties");
             if (ccProps.getWebdavUrl() != null || ccProps.getCifsPath() != null)
             {
                out.write("window.onload=onloadFunc(\"");
                if (ccProps.getWebdavUrl() != null)
                {
                   out.write(ccProps.getWebdavUrl());
                }
                out.write("\",\"");
                if (ccProps.getCifsPath() != null)
                {
                   String val = ccProps.getCifsPath();
                   val = Utils.replace(val, "\\", "\\\\");   // encode escape character
                   out.write(val);
                }
                out.write("\");");
                
                // reset session bean state
                ccProps.setCifsPath(null);
                ccProps.setWebdavUrl(null);
             }
         }
      }
   }
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Changeing font color

_valerio_ — Wed, 21 Apr 2010 15:52:41 GMT

thanks hsohaib for your replies, at last there's someone (besides OpenPj) that helps each other
best regards
Valerio