Liferay 6.2 User Interface Development

Breathe new life into the look and responsiveness of your website with Liferay Portal. With this tutorial you’ll learn everything you need to know about this versatile technology. Experience with Java would be a big help.

Liferay 6.2 User Interface Development

Progressing
Xinsheng Chen, Jonas X. Yuan

Breathe new life into the look and responsiveness of your website with Liferay Portal. With this tutorial you’ll learn everything you need to know about this versatile technology. Experience with Java would be a big help.
$10.00
$49.99
RRP $29.99
RRP $49.99
eBook
Print + eBook
$12.99 p/month

Get Access

Get Unlimited Access to every Packt eBook and Video course

Enjoy full and instant access to over 3000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.

+ Collection
Free Sample

Book Details

ISBN 139781782162346
Paperback356 pages

About This Book

  • Create eye-catching themes, develop responsive layouts, and write portlets with various technologies that ensure efficiency and performance
  • Showcase the latest features in the user interface of Liferay 6.2 and provide solutions to real problems on recent projects
  • Implement Alloy User Interface to achieve the best page appearance and generate reports
  • This comprehensive guide is packed with screenshots for illustration and a lot of code examples that are ready to run

Who This Book Is For

"Liferay 6.2 User Interface Development" is for anyone who is interested in the Liferay Portal. It contains text that explicitly introduces you to the Liferay Portal. You will benefit most from this book if you have Java programming experience and have coded servlets or JavaServer Pages before. Experienced Liferay portal developers will also find this book useful because it explains the latest technologies used in the Liferay Portal. This book is a good reference for Liferay architects as the book also explains different technologies for portlet development and their strong and weak points.

Table of Contents

Chapter 1: Customizing Your Liferay Portal
Liferay functionalities
Documents and Media – CMS
Integrating with Liferay Sync
Leveraging framework and architecture for user interface development
Service Oriented Architecture
Customization and development strategies
Customizing the user interface through theme development frameworks
Developing the user interface through layout template development frameworks
Alloy UI customization
JavaScript frameworks
Responsive themes
More useful information
Summary
Chapter 2: Basic Theme
Structure of a Liferay Portal page
Creating a theme
Analyzing the portal_normal.vm file
Velocity variables available in a theme
Rendering a theme
Summary
Chapter 3: Layout Template
Out of the box layout templates
Creating our first layout template
Rendering a layout template
Available variables in a layout template
Developing a layout template based on the client's requirements
Multiple layout templates in one package
Embedding portlets in a layout template
Responsive layout templates
Source code
Summary
Chapter 4: Content Collaboration and Publishing
Before we start
Static content versus dynamic content
Basic web content
Web content based on structure
Developing web content based on client's requirements
Velocity variables available for web content
Web content that accesses a database
Web content for interoperability
Publishing
Source code
Summary
Chapter 5: Portlet
Before we start
Understanding a simple JSR-286 portlet
The Spring MVC portlet
About the Vaadin portlet
Source code
Summary
Chapter 6: JavaScript Frameworks and Portlets
Before we start
The jQuery UI
Understanding Ext JS
Dojo Toolkit
OpenXava for autocoding
Source code
Summary
Chapter 7: Advanced Theme
Creating a theme as per client requirements
Embedding portlets in a theme
Creating a responsive theme
Upgrading themes
Multiple-level navigation menus in themes
Implementing browser support in themes
Integrating Google Analytics
Source code
Summary
Chapter 8: Understanding Alloy UI/YUI
Knowing the background
Peeping into HTML5
Trying out CSS3
Working with YUI3
Learning Alloy UI tags
Getting familiar with Node and Nodelist
Making Ajax calls in Alloy UI
Understanding a plugin
Finding out widgets in Alloy UI
Learning other Alloy UI features
Source code
Summary
Chapter 9: Using UI Taglib
Getting started with the UI tag
Understanding the asset tag and category
Using the search container
Adding custom attributes
Using tabs, toggle, and calendar
Using breadcrumb, navigation, and panel
Adding social activity tracking and social bookmarks
Using the discussion, ratings, diff, and flags tags
Adding icons and input forms
Updating content with inline editing
Something more
Summary
Chapter 10: Responsive Mobile Theme, Reporting, Searching, and More
Using jQuery in plugins
Knowing workflow capabilities in plugins
Custom attributes in plugins
OpenSocial, Social Activity, and Social Equity in plugins
Friendly URL routing and mapping in plugins
Knowing reporting portlets
Getting to know Lucene indexing, search API, and faceted search in plugins
The responsive theme approach
Building a mobile theme
Deploying themes
Summary

What You Will Learn

  • Set up Liferay IDE for rapid development of plugins
  • Use Compass to write Syntactically Awesome Stylesheets
  • Develop a responsive theme
  • Integrate Google Analytics in a theme
  • Create a page layout that responds to the change in width of the browser screen
  • Write generic-style portlets, Spring MVC portlets, and Vaadin portlets
  • Use jQuery, Ext JS, and Dojo Toolkit in a portlet
  • Develop a portlet using tools like OpenXava
  • Create an image gallery with Alloy UI
  • Construct an Alloy UI video player
  • Use Liferay tags for rich page rendering
  • Develop a mobile user interface, create reports, and enable searching

In Detail

Liferay employs a specialized theming system that allows you to change the look and feel of the user interfaces. Liferay Portal provides layout templates in order to describe how various columns and rows are arranged to display portlets. It also provides themes that can be used to customize the overall look and feel of web sites and web pages. As a developer, by using the right tools to create and manipulate themes with Liferay Portal 6.2, you can get your site to look any way you want it to; however the Liferay theming system can be difficult to get started with. This practical guide is a well organized manual to help you get started with Liferay as a programmer.

"Liferay 6.2 User Interface Development" will show you the efficient ways to develop custom user interface components for a Liferay Portal website. You will learn how to create themes, write page layouts, develop portlets, and use Alloy User Interface widgets. This book will prepare you with a full set of tools and skills for the development of Liferay user interfaces.

"Liferay 6.2 User Interface Development" guides you through the components of the Liferay Portal user interface step-by-step.The Liferay tags, analysis of the Alloy UI widgets, and the anatomy of a theme are explained in detail. Explanations are accompanied with screenshots and code that executes smoothly. This book explains how the components are rendered one after another into a complete HTML file.

You will learn how to create and upgrade a theme, how to write a responsive page layout and how to develop generic-style portlets, Spring MVC portlets, and Vaadin portlets. The book will help you in using Alloy UI, jQuery, Ext JS, and Dojo Toolkit in Liferay.

By the end of this book, you will have gained experience in developing all the user interface components for the Liferay Portal and know the latest ways of using tags, composing widgets, and writing Ajax calls and developing portlets, page layouts, and themes efficiently.

Authors

Table of Contents

Chapter 1: Customizing Your Liferay Portal
Liferay functionalities
Documents and Media – CMS
Integrating with Liferay Sync
Leveraging framework and architecture for user interface development
Service Oriented Architecture
Customization and development strategies
Customizing the user interface through theme development frameworks
Developing the user interface through layout template development frameworks
Alloy UI customization
JavaScript frameworks
Responsive themes
More useful information
Summary
Chapter 2: Basic Theme
Structure of a Liferay Portal page
Creating a theme
Analyzing the portal_normal.vm file
Velocity variables available in a theme
Rendering a theme
Summary
Chapter 3: Layout Template
Out of the box layout templates
Creating our first layout template
Rendering a layout template
Available variables in a layout template
Developing a layout template based on the client's requirements
Multiple layout templates in one package
Embedding portlets in a layout template
Responsive layout templates
Source code
Summary
Chapter 4: Content Collaboration and Publishing
Before we start
Static content versus dynamic content
Basic web content
Web content based on structure
Developing web content based on client's requirements
Velocity variables available for web content
Web content that accesses a database
Web content for interoperability
Publishing
Source code
Summary
Chapter 5: Portlet
Before we start
Understanding a simple JSR-286 portlet
The Spring MVC portlet
About the Vaadin portlet
Source code
Summary
Chapter 6: JavaScript Frameworks and Portlets
Before we start
The jQuery UI
Understanding Ext JS
Dojo Toolkit
OpenXava for autocoding
Source code
Summary
Chapter 7: Advanced Theme
Creating a theme as per client requirements
Embedding portlets in a theme
Creating a responsive theme
Upgrading themes
Multiple-level navigation menus in themes
Implementing browser support in themes
Integrating Google Analytics
Source code
Summary
Chapter 8: Understanding Alloy UI/YUI
Knowing the background
Peeping into HTML5
Trying out CSS3
Working with YUI3
Learning Alloy UI tags
Getting familiar with Node and Nodelist
Making Ajax calls in Alloy UI
Understanding a plugin
Finding out widgets in Alloy UI
Learning other Alloy UI features
Source code
Summary
Chapter 9: Using UI Taglib
Getting started with the UI tag
Understanding the asset tag and category
Using the search container
Adding custom attributes
Using tabs, toggle, and calendar
Using breadcrumb, navigation, and panel
Adding social activity tracking and social bookmarks
Using the discussion, ratings, diff, and flags tags
Adding icons and input forms
Updating content with inline editing
Something more
Summary
Chapter 10: Responsive Mobile Theme, Reporting, Searching, and More
Using jQuery in plugins
Knowing workflow capabilities in plugins
Custom attributes in plugins
OpenSocial, Social Activity, and Social Equity in plugins
Friendly URL routing and mapping in plugins
Knowing reporting portlets
Getting to know Lucene indexing, search API, and faceted search in plugins
The responsive theme approach
Building a mobile theme
Deploying themes
Summary

Book Details

ISBN 139781782162346
Paperback356 pages
Read More

Recommended for You

Liferay Portal 6 Enterprise Intranets
$ 10.00
Liferay Portal Enterprise Intranets
$ 10.00
Instant Liferay Portal 6 Starter
$ 10.00
Liferay Portal Systems Development
$ 10.00
Liferay User Interface Development
$ 10.00