Creating Liferay Layout Templates

By now, you’ve likely added portlets to a page by dragging them from the Add menu and dropping them into place. Are there times, though, when you find yourself limited by Liferay’s page layout options? Maybe your Feng Shui (pronounced fung SHWAY) senses are picking up on some negative energy? Or perhaps you find yourself adding the same portlets over and over again onto the same types of pages? Don’t despair! Break the monotony by creating your own custom layout templates. Layout template plugins let you design layouts that flow nicely, embed commonly used portlets, and apply CSS, Velocity, and HTML to make your pages visually pop.

In this chapter, you’ll learn everything you need to know about layout templates:

  • Creating a layout template project
  • Anatomy of a layout template project
  • Designing a layout template
  • Embedding portlets in a layout template
  • Available variables

Let’s create a custom layout template!

Creating a Layout Template

With the Plugins SDK you can deploy layout templates as plugins, and creating layout templates with Liferay Developer Studio is easier than ever. Let’s call our layout template called Columns 1 4...

Read More

Anatomy of a Layout Template Project

Let’s look at the directory structure of a layout template project and learn about its various files: columns-1-4-1-layouttpl/ docroot/ WEB-INF/

Read More

Designing a layout template

Initially, the layout template’s generated TPL files are empty, a fresh canvas on which you design layout templates. If this seems overwhelming, don’t worry. With the handy palette in Developer...

Read More

Embedding portlets in a layout template

Are there portlets you need displayed in the same location on all pages using a particular layout template? Perhaps you want to prevent others from disrupting the Feng Shui you’ve generated with...

Read More

Available variables

A number of variables are available for you to use in your custom TPL files. For your convenience, we’ve listed all of them in the following table. Variable Type Description $processor...

Read More


In this chapter we created layout templates, arranged their rows and columns, and embedded portlets in them. Congratulations on mastering the fundamentals of Liferay’s layout templates, but be...

Read More
0 (0 Votes)
Summary Previous