topic Re: add image theme above the header in Alfresco Archive

add image theme above the header

nikes — Fri, 28 Nov 2014 11:20:03 GMT

Hello,What are the different ways to add and image above the header bar in Share? Alfresco Version: 4.2.1Not sure if it could be done in any alfresco theme or using new Aikau FrameworkI found reference of this header script, but not sure how to proceedtomcat\webapps\share\WEB-INF\classes\alfresco\si

Re: add image theme above the header

hdalang — Mon, 01 Dec 2014 19:37:15 GMT

If you mean you want to replace images of the header of alfresco, you just need to check where is the files that includes all picture and replace it with the one you want, I've done this before by going throw the files and replace the images and it worked. I never had to do some changes.

Re: add image theme above the header

nikes — Tue, 02 Dec 2014 10:45:00 GMT

Thanks for the reply,

But not exactly what I am looking for. I see there already sample themes and its related css and yui css files with icons.

However the requirement is to place banner at the top (Above Alfresco Header).

So, page will have, Banner at the top, then Alfresco Header below that, and then Title bar, dashlets as it is.

Thanks for any further help.

Re: add image theme above the header

aaditvmajmudar — Wed, 03 Dec 2014 07:48:00 GMT

I think you need to customize "share-header.get.html.ftl" file to place the banner above the header.

Header rendering start with the below code,

#############
<@markup id="widgets">
   <@inlineScript group="dashlets">
      <#if page.url.templateArgs.site??>
         Alfresco.constants.DASHLET_RESIZE = ${siteData.userIsSiteManager?string} && YAHOO.env.ua.mobile === null;
      <#else>
         Alfresco.constants.DASHLET_RESIZE = ${((page.url.templateArgs.userid!"-") = (user.name!""))?string} && YAHOO.env.ua.mobile === null;
      </#if>
   </@>
   <@processJsonModel group="share"/>
</@>
############33

So you can write your own code to place banner above header here.

Hope this helps.

Re: add image theme above the header

nikes — Thu, 04 Dec 2014 11:40:33 GMT

Thanks for the suggestion Andit.

Actually I did it using a module customization.
http://docs.alfresco.com/4.2/tasks/dev-extensions-share-tutorials-add-content.html

In module config, set region id to "share-header"

  <module>
      <id>Custom Banner Module</id>
      <components>
          <component>
              <region-id>share-header</region-id>
              <source-id>global</source-id>
              <scope>global</scope>
              <sub-components>
                <sub-component id="New_Content" index= "-1" >
                <url>/custom/banner</url>
               </sub-component>
              </sub-components>
          </component>
       </components>
     </module> ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

In webscript, "*.html.ftl", set <img> element to point to custom banner

 <div>   
   <img src="${url.context}/res/components/images/banner.png"/>
</div>    ‍‍‍

Please feel free to provide feedback on this approach, and if anyone did same with alternate approaches.

Thanks!
Nikesh