How do I edit Liferay's HTML code?

Question

I was wondering if it's possible to edit Liferay Portal's HTML code, add a couple of <br> to have more space between portlets. Or even add some Javascript to it? Is this possible? If so, how?

Thanks

Sure, you can use greasemonkey for Firefox, or you install scripts to Chrome very easily. Obviously this only affects your computer and doesn't change the actual data on the server. — Christian
– Christian, Commented Apr 12, 2013 at 15:32
@ChristianVarga then there's no point in changing it if I can't change the actual HTML onthe server — randomizertech
– randomizertech, Commented Apr 12, 2013 at 15:33
Liferay is open source, you can change everything if you want. — Jocelyn
– Jocelyn, Commented Apr 12, 2013 at 15:40
To get more space between portlets, you do not want to edit the HTML but the CSS. — Bergi
– Bergi, Commented Apr 12, 2013 at 15:46
@Jocelyn I know it's open source, I guess my question is how to do it — randomizertech
– randomizertech, Commented Apr 12, 2013 at 15:49

Maria Ioannidou · Accepted Answer · 2013-04-12 16:01:39Z

3

You can create your own theme, extending another theme (e.g. classic, _styled, etc.) and adding the 'diff' files, aka the ones you want to extend. In that case, you could extend a default css files, adding a rule like:

#content .portlet-layout .portlet-column-content {margin: 10px;}

Another quicker but less flexible approach is to use the

'Insert custom CSS that will be loaded after the theme.'

feature. This can be found at: Manage Pages > Look & Feel > CSS

answered Apr 12, 2013 at 16:01

Maria Ioannidou

1,5641 gold badge15 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Maria Ioannidou Over a year ago

See Creating Liferay Themes for how to create a theme and Anatomy of a Theme for its structure. You could then put your change in _diffs/css/custom.css. For the second solution, you just insert your css rules in the text area under: 'Insert custom CSS that will be loaded after the theme.'

Olaf Kock · Accepted Answer · 2013-04-15 09:13:50Z

2

The Theme answer has already been given - if you just want to change the appearance (e.g. linebreaks) this is the way to go instead of your original question to change HTML output.

If you literally need to change the HTML code - e.g. add something to or remove something from the page, you should read about Hooks, particularly those that can override jsps. This is exactly what they've been built for.

answered Apr 15, 2013 at 9:13

Olaf Kock

48.2k9 gold badges63 silver badges91 bronze badges

Collectives™ on Stack Overflow

How do I edit Liferay's HTML code?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related