Changing Your Base Theme

Once your theme is built, you can use the gulp extend task to change your theme’s base theme.

Follow these steps to change your base theme:

  1. Navigate to your theme’s root folder and run gulp extend and choose option 1 to change the base theme your theme extends.

    Figure 1: Run the gulp extend task to change your base theme or install a themelet.

    Figure 1: Run the `gulp extend` task to change your base theme or install a themelet.

  2. Choose which base theme you want to extend. By default, themes created with the Liferay Theme Generator are based off of the styled theme. You can extend the styled or unstyled base theme, a globally installed theme, a theme published on the npm registry, or you can specify a package URL. Enter the number for the option you wish to select.

    Figure 2: You can extend the styled or unstyled base theme, a globally installed theme, or a theme published to the npm registry.

    Figure 2: You can extend the styled or unstyled base theme, a globally installed theme, or a theme published to the npm registry.

  3. Your theme’s package.json contains the updated base theme configuration :

    {
      ...
    	"liferayTheme": {
    		"baseTheme": "styled",
    		"screenshot": "",
    		"rubySass": false,
    		"templateLanguage": "ftl",
    		"version": "7.1"
    	},
      ...
    }
    

When you build your theme’s files or deploy it, your theme will inherit the updated base theme’s files.

Configuring Your Theme’s App Server

Deploying Themes

Listing Your Theme’s Extensions

« Deploying Your ThemeCopying an Existing Theme's Files »
Was this article helpful?
1 out of 1 found this helpful