Configuring Individual Pages¶
You can configure individual Pages to meet your needs. All changes made in this way are scoped to the selected Page.
To configure a Page, open the Site Menu and go to Site Builder → Pages. Then click the Actions button () for the Page you want to customize and select Configure.
Alternatively, you can access individual Page settings by navigating to the Page you want to customize and clicking the Configure Page button ( ) at the top right of the Application Bar.
These settings are organized into the following tabs:
Here you can configure the basic information and design of a Page, including its name, friendly URL, layout, and more.
Name and Friendly URL¶
Use the Name field to set a Page’s title used for Site navigation and displayed in a browser’s title bar. Use the Friendly URL field to set a new URL for a Page, or click the Restore icon ( ) to see and restore a previously used URL. See Configuring Your Page’s Friendly URL for more information.
While a Page’s name and friendly URL are initially defined together at Page creation, they are configured independently afterwards. It is best practice to update them together so that they match.
For basic Widget Pages created using a global template (e.g., blog, wiki, search), determine whether the Page Inherits Changes made to the global template. If the Page does not inherit changes, select a custom layout to define row and column containers for its widgets.
Use Topics and Tags to categorize a Page’s content so users can more easily find it. For more information on using tags and categories, see Organizing Content with Tags and Categories.
Look and Feel¶
Here you can use the Page set’s theme settings or define a unique look and feel for your Page. When you choose to customize the Page’s theme, you can toggle various theme settings.
You can also access a CSS editor where you can add custom CSS code to the Page. Any CSS code added to a Page in this way is loaded after the theme.
While Widget Pages include the Look and Feel tab here, Content Pages include these settings in the Edit sidebar menu.
Access additional settings to customize a Page’s content and features, including query strings, mobile device rules, custom fields, and embedded widgets.
While Widget Pages include the Advanced tab here, Content Pages include these settings in the Edit sidebar menu under Look and Feel.
Query String: Use this to provide default parameters for a Page when no others exist. Query strings are useful for web content templates.
Target: Use this field to determine Page link behavior using specific target attributes, such as opening the link in a new window, tab, or frameset.
Icon: Choose an icon to display along with a Page’s name in the Site’s navigation menus.
Mobile Device Rules: Determine whether a Page uses its Page Set’s rules for mobile devices or is uniquely configured. These rules determine how a Page’s content renders for different types of mobile devices.
Customization Settings: Determine whether a Widget Page’s columns are Customizable for users. If customization is enabled, specify the columns users can customize. See Personalizing Pages for more information.
Custom Fields: View and configure the Custom Fields you’ve defined for Site Pages. See Custom Fields for more information.
The Custom Fields and Embedded Widget sections only appear once you’ve created custom fields and embedded widgets in a Page.
Search engine optimization (SEO) refers to the methods used to improve your Page’s ranking in search engine results Pages (SERP). The SEO tab provides easy access to settings you can use to optimize your Page’s content. See Configuring SEO and Open Graph for more information about the following settings.
Use the HTML Title field to define a Page’s
<title> tag. This title is used by search engines to rank your Page and serves as the Page’s heading in search engine results, though without replacing a Page’s Name. The recommended length for an HTML title is under 60 characters.
Use the Description field to define a Page’s
<description> tag. This description is used by search engines to rank your Page and also appears in search result previews of your Page. The recommended length for a description is under 155 characters.
Custom Canonical URL¶
Set a custom canonical URL for a Page. Custom URLs set in this way take precedence over the global and instance level settings.
List words that people are likely to use when searching for your Page’s content. These keywords contribute to your Page’s ranking.
Use keywords often throughout your Page’s content, including titles, headings, descriptions, paragraphs, and image alt text.
Preview how a Page is displayed in search engine results Pages (SERP) based on your configuration of its HTML title, description, and custom URL.
robots.txt rules for a Page. These rules provide instructions to search engines and other tools crawling and indexing your Site, either blocking or granting a crawler access to a specified path.
Determine whether a Page is included in the sitemap used by site crawlers. By excluding a Page, you instruct site crawlers to skip it when crawling and indexing your Site.
Set a Page’s priority from 0.0 to 1.0. This informs tools crawling and indexing your Site how a Page should be prioritized relative to other Pages in your Site.
Use the drop-down menu to inform tools crawling and indexing your Site how frequently a Page is updated.
Available: Liferay DXP/Portal 7.3+
Open Graph is an Internet protocol that standardizes previews of Site content when shared in application contexts that support it, such as Facebook, Slack, and Twitter. It does this by embedding structured data in page headers as
<meta> tags, similar to RDFa.
In the Open Graph tab, you can use Open Graph
<meta> tags to define a Page’s metadata and create engaging representations of your content. Values defined here override default values defined at the Site level.
<meta> tags are only included in page headers to unauthenticated users. They are not included when the user is logged in.
Use the Image field to define the following Open Graph
<meta> properties for a Page:
<meta property="og:image" content="http://example.com/ogp.jpg" /> <meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" /> <meta property="og:image:type" content="image/jpeg" /> <meta property="og:image:width" content="400" /> <meta property="og:image:height" content="300" />
Image Alt Description¶
Use the Image Alt Description field to define the
og:image:alt property for a Page. You can also localize an image’s alt description via the Language Flag button.
Custom Title and Description¶
Use the Title and Description fields to define the
og:description properties. These properties create custom text used for rich previews in place of a Page’s HTML title and description. You can also localize these values via their Language Flag buttons.
Preview Open Graph Page Representation¶
Preview your Page’s Open Graph configuration. This section displays how your Page’s content appears when its URL is shared in contexts supporting the protocol. Though an image’s ratio may change depending on where the URL is posted.