How to customize Liferay default classic theme

[Zhenjun Yang，修改在11 年前。]

To customize the liferay default classic theme, I created a hook to override the index.jsp file which is located in /ROOT/html/portal/api/jsonws/, however it doesn't work. Anybody please tell me what's wrong? thanks a lot for kind support!

[David H Nebinger，修改在11 年前。]

Create a new theme that uses classic as the parent theme. Make your changes in the _diffs folder, then build and deploy.

[Zhenjun Yang，修改在11 年前。]

David, thanks for your prompt response.

You gave me the way on how to customize a theme, I got it and thank you.
Actually I want to add a search bar in the head in classic theme, so I created a hook to override index.jsp, I just don't understand why it doesn't work...

[David H Nebinger，修改在11 年前。]

You do not modify Liferay's theme, ever. You don't hook themes to affect change.

You create a custom theme which extends another theme and that is the theme where you make the change. Index.jsp has nothing to do with the actual theme being used.

[Maarten van Heiningen，修改在11 年前。]

Hi Zhenjun,

Did you have a look at the development guide for Theme's? Do you use the Liferay IDE or Liferay Developer Studio?

Guide: http://www.liferay.com/documentation/liferay-portal/6.1/development/-/ai/creating-liferay-them-7

You need also be aware of the fact there are two search portlets you can use in your theme. The full content search (searching blogs, documens and webcontent, Wiki) and the Webcontent Search portlet.

Just use this in your portal_normal.vm If you use Velocity as a theme template. You can find this in your [YOUR-OWN-THEME-ROOT]/_diffs/templates/portal_normal.vm

Option one (full search):

<div>
$theme.search()
</div>

Option two (webcontent search):

<div>
$theme.journalContentSearch()
</div>

But please check the documentation about how to create themes in Liferay. It will make your live much easier.

Happy development!
Maarten

[Zhenjun Yang，修改在11 年前。]

David and Maarten, thanks for your time and help, I have got the issue resolved. Again thanks!

[Ren Rem，修改在11 年前。]

Your answer is unhelpful.

What would be really helpful is if *SOMEONE* would write a tutorial on building the Welcome theme FROM SCRATCH... or at least how to build the Welcome theme using the 6.1 SDK resources that are available.

This "build your own custom theme" advice is about as useful as teats on a bull...

[David H Nebinger，修改在11 年前。]

Ren Rem:

Your answer is unhelpful.

This "build your own custom theme" advice is about as useful as teats on a bull...

Sorry, but the forum is not the place for a whole dissertation on how to build themes. Besides, from how the OP asked the question, he wanted to do a hook to override a single file of the classic theme and our responses were directly on point: do not do a hook to override a theme file, create your own custom theme that extends classic and has the changes you need. So clearly you either didn't read or didn't understand what the OP was asking for, or you would have seen our replies as being correct and on point.

As far as 'how to theme' goes, there's documentation on the portal to assist there, and I would point you to that.

Long story short:

1. create theme plugin.
2. change the parent theme to be the one that you want to extend.
3. build the theme (to pull in parent theme files).
4. in the diffs_ folder, put your override and new files (mirroring filenames and paths from docroot). Use any sass/css reference you want for doing the styling.
5. build and deploy your theme.
6. in the portal, change the theme on a page (or pages or portal) to be your newly deployed theme.
7. done

Any more detail than this is pointless because more detailed references are available.

[Rahul Trehan，修改在11 年前。]

David,

Thanks for the response. I've another question. If I've a customized theme provided to me in a *.war format and I wish to extend that theme.
Firstly, Can I really do that using plugin sdk?
Secondly, How?

I created a base theme using create.bat from command line and imported that project in Liferay IDE. Then I go and copy all the changed css and images to _diff folder and
change the build.xml and set the theme.parent property to my customized theme. I"m getting the build failed errors. I even exploded the war file to project directory but It still doesn't compile.


Thanks,
Rahul

[David H Nebinger，修改在11 年前。]

I would create a theme plugin in the SDK named for the theme you have in the war. This will give you the basic project. Do a build to have the sdk populate the docroot folder. Create a _diffs folder in this project and extract the appropriate contents from the war file there. You should be able to do another build and get a new war that would be similar to the war file you received (same paths, same files, same sizes...).

Once that is done, you can create a new theme project and modify the build.xml file to indicate the parent theme is "../oldtheme". Do the build here, and you get a workable starting point for your project. Make your own corrections in the _diffs folder, and you're off and running.

Should you get an updated theme.war (from wherever you're getting them), just extract appropriate contents into the _diffs folder of the first theme project and build. Then do another build in your theme project.

[Rahul Trehan，修改在11 年前。]

Thanks David that works.

[scott E mitchell，修改在6 年前。]

Hello david,i have query regarding to extend the liferay7 classic theme to custom theme and try to disable the left pane depend on user can you provide some guide lines on that.

[David H Nebinger，修改在6 年前。]

The left pane is where all of the user profile stuff is now, including log out. Disabling it will remove all of that functionality, so you really want to be sure that's what you need before going down that road...







Come meet me at the 2017 LSNA!

[scott E mitchell，修改在6 年前。]

Thanks for your reply but ,i Want to disable that left pane from normal user and create that logout saperately and if user is admin so he can able to see left pane as well but not for normal user.as i see in liferay7 there is no _diff folder actually theme folder structure is different so if you provide so guide lines under this so it would be a great help ..TIA

[scott E mitchell，修改在6 年前。]

Hey ,
we have able to disable that left pane if user is normal and make it available if user is admin,we have achieve this by doing some changes in init.ftl creating permission_checker variable who check the given user and his role and according to role will make left pane available for more details you can refer the below attachment as init.ftl(init.ftl is located in you custom theme)

Thanks you!

[Manisha Thote，修改在11 年前。]

Steps to create the custom classic theme,
1)Create a new theme that uses classic as the parent theme.
2) Make your changes in the _diffs folder which include all templates as well,
3)build new theme and deploy,