Legacy Knowledge Base
Published Jul. 2, 2025

7.4 styled custom themes not working properly

Written By

Cristina Rodriguez

How To articles are not official guidelines or officially supporteddocumentation. They are community-contributed content and may not alwaysreflect the latest updates to Liferay DXP. We welcome your feedback toimprove How to articles!

While we make every effort to ensure this Knowledge Base is accurate, itmay not always reflect the most recent updates or official guidelines.We appreciate your understanding and encourage you to reach out with anyfeedback or concerns.

Legacy Article

You are viewing an article from our legacy "FastTrack"publication program, made available for informational purposes. Articlesin this program were published without a requirement for independentediting or verification and are provided "as is" withoutguarantee.

Before using any information from this article, independently verify itssuitability for your situation and project.

Issue

  • When applying a styled based custom theme to a page in 7.4, header and other elements are misplaced and when you click the three elipsis button of a widget, options show up in the incorrect location.

Captura.PNG

Environment

  • Liferay 7.4 and Liferay Theme Generator 10.1.0.

Resolution

  • The official solution for this will be implemented in https://issues.liferay.com/browse/LPS-142928.
  • Until a new version for the generator is released, there is a workaround that can be easily applied:
    • Change, in package.json file of the generated theme, the following devDependencies:
"liferay-frontend-theme-styled": "6.0.2",
"liferay-frontend-theme-unstyled": "6.0.2",

To:

"liferay-frontend-theme-styled": "6.0.14",   
"liferay-frontend-theme-unstyled": "6.0.15",
    • Install the new dependencies through npm i
    • Redeploy your them: gulp deploy
  • Your custom theme should be working fine after this.

Additional Information

 

 

Did this article resolve your issue ?

Legacy Knowledge Base