Documentation

Documentation Menu
Go Back

Changing Your Site’s Appearance

Changing the site logo, favicon, and theme are some of first look and feel areas you may want to change. Themes are used to set the overall look and feel for your Site. A Site’s Pages can be configured to use any theme that has been deployed to your DXP instance.

The DXP Docker image has the Classic theme available by default. In this example, we will deploy a new simple theme and then show you how to switch from one theme to another.

Changing Your Site’s Theme

Deploy a New Theme

  1. Start up the Liferay DXP Docker image:

    docker run -it -p 8080:8080 liferay/dxp:7.3.10-ga1

  2. Download the WAR containing the Acme Sample Blue Theme:

    curl https://learn.liferay.com/dxp/7.x/en/getting-started/changing-your-sites-appearance/liferay-5b2v-theme.war -O

  3. Deploy the WAR containing the theme:

    docker cp liferay-5b2v-theme.war docker-container:path-to-deploy-folder

This will load the sample theme into your DXP instance. You can check your console for the following message to confirm that the theme successfully deployed:

2020-03-11 17:06:35.601 INFO  [fileinstall-/opt/liferay/osgi/war][BundleStartStopLogger:39] STARTED liferay-5b2v-theme_1.0.0 [1112]

Change Your Site’s Theme

Configure the Pages for your Site to use the deployed theme:

  1. Open your browser to https://localhost:8080 and login as an administrator.

  2. In the Site Menu on the left side of the screen, navigate to Site Builder → Pages.

  3. Click the gear icon Gear icon next to Public Pages to configure them:

    Open the Pages screen to configure your Public Pages.

  4. Scroll down and click the Change Current Theme button:

    Click Change Current Theme to select a new theme for your Public Pages.

  5. Select the deployed sample theme, Acme Sample Blue Theme.

  6. Navigate back to the home page for your Site to confirm that the theme has changed. The background for the content section of your Site is now blue.

    The home page has a different color background after changing the theme.

Your Site’s theme has been updated.

Theme Resources

There are many themes available on the Liferay Marketplace that can be used to quickly achieve a professional look and feel.

You can also learn how to create your own theme.

Changing Your Site’s Favicon

Coming soon!

Not finding what you're looking for?

Pardon our dust as we revamp and transition our product documentation to this site. If something seems missing, please check Liferay Help Center documentation for Liferay DXP 7.2 and previous versions.

Try Liferay's Help Center