Forums

Home » Liferay Portal » English » 3. Development

Combination View Flat View Tree View
Threads [ Previous | Next ]
toggle
Hashim Raza
User based Portlet-CSS possible?
June 26, 2012 11:34 PM
Answer

Hashim Raza

Rank: New Member

Posts: 14

Join Date: June 25, 2012

Recent Posts

Hi,

I was wondering if i can have portlet-css per user?

Lets suppose one user clicks on 'Look and Feel' button and changes the font style of his portlet, I want it not to reflect in other users portlets. Is this possible?

If not then is there any other way or workaround?

Thanks in advance!
Pankaj Kathiriya
RE: User based Portlet-CSS possible?
June 26, 2012 11:44 PM
Answer

Pankaj Kathiriya

Rank: Liferay Master

Posts: 701

Join Date: August 4, 2010

Recent Posts

Hi Hashim Raza,

I havent tried such implementataion , but as workaround you can try saving look&feel changes to portlet preferences which will be user-specific.

And use that preference value to have css to portlet.

HTH
Thanks,
Pankaj
Hashim Raza
RE: User based Portlet-CSS possible?
June 26, 2012 11:51 PM
Answer

Hashim Raza

Rank: New Member

Posts: 14

Join Date: June 25, 2012

Recent Posts

Hi Pankaj,

Thanks for your reply.

Yes, i tried to store "portletSetupCss" in user "portletPreferences" but it was not being applied to the portlet.

Regards,

Hashim
Hashim Raza
RE: User based Portlet-CSS possible?
July 2, 2012 10:35 PM
Answer

Hashim Raza

Rank: New Member

Posts: 14

Join Date: June 25, 2012

Recent Posts

After much searching, I've created the hook myself. Follow these steps and user based portlet css will be enabled.

"top_head.jsp" found in "\html\common\themes" needs to be changed a bit.

Here is what you have to do:

Replace the code:

1PortletPreferences portletSetup = PortletPreferencesFactoryUtil.getLayoutPortletSetup(layout, portlet.getPortletId());
2
3String portletSetupCss = portletSetup.getValue("portlet-setup-css", StringPool.BLANK)


With:

1String portletId = portlet.getPortletId();
2PortletPreferences portletPreferences = PortletPreferencesFactoryUtil.getPortletPreferences(request, portletId);
3String portletSetupCss = portletPreferences.getValue("portletSetupCss", null);
4PortletPreferences portletSetup = PortletPreferencesFactoryUtil.getStrictLayoutPortletSetup(layout, portlet.getPortletId());
5            
6if ( Validator.isNull(portletSetupCss) ) {
7    portletSetupCss = portletSetup.getValue("portletSetupCss", StringPool.BLANK);
8}


Now in your portlet create a preference by name = "portletSetupCss" and in your edit page store this string in the preference:

1public String portletCss = "{\"wapData\":{\"title\":\"\",\"initialWindowState\":\"NORMAL\"},\"borderData\":{\"borderStyle\":{\"top\":\"\",\"left\":\"\",\"bottom\":\"\",\"right\":\"\",\"sameForAll\":true},\"borderColor\":{\"top\":\"\",\"left\":\"\",\"bottom\":\"\",\"right\":\"\",\"sameForAll\":true},\"borderWidth\":{\"top\":{\"value\":\"\",\"unit\":\"px\"},\"left\":{\"value\":\"\",\"unit\":\"px\"},\"bottom\":{\"value\":\"\",\"unit\":\"px\"},\"right\":{\"value\":\"\",\"unit\":\"px\"},\"sameForAll\":true}},\"textData\":{\"fontSize\":\"<fontSize>\",\"fontStyle\":\"<fontStyle>\",\"fontFamily\":\"<fontFamily>\",\"color\":\"\",\"fontWeight\":\"\",\"textAlign\":\"\",\"wordSpacing\":\"\",\"lineHeight\":\"\",\"textDecoration\":\"\",\"letterSpacing\":\"\"},\"advancedData\":{\"customCSSClassName\":\"\",\"customCSS\":\"\"},\"spacingData\":{\"padding\":{\"top\":{\"value\":\"\",\"unit\":\"px\"},\"left\":{\"value\":\"\",\"unit\":\"px\"},\"bottom\":{\"value\":\"\",\"unit\":\"px\"},\"right\":{\"value\":\"\",\"unit\":\"px\"},\"sameForAll\":true},\"margin\":{\"top\":{\"value\":\"\",\"unit\":\"px\"},\"left\":{\"value\":\"\",\"unit\":\"px\"},\"bottom\":{\"value\":\"\",\"unit\":\"px\"},\"right\":{\"value\":\"\",\"unit\":\"px\"},\"sameForAll\":true}},\"bgData\":{\"backgroundColor\":\"\",\"backgroundPosition\":{\"top\":{\"value\":\"\",\"unit\":\"px\"},\"left\":{\"value\":\"\",\"unit\":\"px\"}},\"backgroundRepeat\":\"\",\"backgroundImage\":\"\",\"useBgImage\":false}}";


you can now edit this string in whatever way you like, and user based css will be applied.

Hope this helps! emoticon