topic Re: aikau - changer header appearance in Alfresco Archive

aikau - changer header appearance

jaeni — Mon, 27 Apr 2015 13:34:59 GMT

hii am new to dojo/aikau and i want to achieve the following:change the header from this:[img]http://i.imgur.com/JeacLBa.png[/img]to this:[img]http://i.imgur.com/cpwvz0y.png[/img]i couldnt find out where the order of the 2 (header and header title) can be changed. any hint?

Re: aikau - changer header appearance

ddraper — Mon, 27 Apr 2015 18:20:43 GMT

There are 3 blog posts describing header customizations (including useful information on how to build the extension modules) starting here: http://blogs.alfresco.com/wp/developer/2013/09/04/customizing-the-share-header-menu-part-1/

This is actually a fairly straightforward customization… the black bar is one widget (containing lots of sub widgets) and the white bar (with the logo) is another … these are just entries in an array so all your extension needs to do is to swap those elements.

Re: aikau - changer header appearance

jaeni — Mon, 27 Apr 2015 18:46:11 GMT

Hi ddraper,

i have read your posts, but i couldn't figure out in which file i need to do the swap. is it share-header.lib.js?
i am also wondering how i can properly overwrite that file using alfresco sdk 2.

Re: aikau - changer header appearance

jaeni — Tue, 28 Apr 2015 12:56:38 GMT

wow - great!
i switched both wigdets and it instantly worked. but i did change the file share-header.lib.js directly inside the exploded share.war. which is what i dont want to do.
can you tell me how i can extend/create a module for overwriting that file with the sdk?

Re: aikau - changer header appearance

darkredd — Wed, 29 Apr 2015 15:09:30 GMT

Hi Jaeni,

In my little experience, I have found that copying the file and editing where required and putting it in the shared/extension folder to work. I however do not know how effective or architecturially right that is but it works; as the bootstrap lastly load the files in the extension folder there-by overriding the original.

Hope that help. But ofcourse you will have to regiter a bean for the new file.

Regards
Vusani

Re: aikau - changer header appearance

jaeni — Thu, 30 Apr 2015 15:38:01 GMT

tomcat/shared will work, but not for sdk-use. i would really like to know how the lib.js can be overwritten there.

Re: aikau - changer header appearance

ddraper — Wed, 06 May 2015 08:11:48 GMT

No, you don't want to be copying and editing the file - the whole point is that you can write an extension module that targets the specific widgets in the header. This is detailed with examples in the blog posts that I linked to so I won't repeat the information here again.

Re: aikau - changer header appearance

hardik1512 — Wed, 06 May 2015 12:55:01 GMT

Hello Jaeni,

I think you should not change share-header.lib.js file. You can see that this file is imported through the import directive in share-header.get.js file which is webscript controller file.

So first you can create a extension module using link http://blogs.alfresco.com/wp/developer/2013/09/04/customizing-the-share-header-menu-part-1/.

Then you can write logic something like below in your extended share-header.get.js file to swap two widgets.

var siteWidget = widgetUtils.findObject(model.jsonModel, "id", "SHARE_VERTICAL_LAYOUT");
var jsonObject=siteWidget.config.widgets;
var temp=jsonObject[0];
jsonObject[0]=jsonObject[2];
jsonObject[2]=temp;