---
schema_version: "1"
id: 26a4ee6da8e7c76dc48a66500b26fda71aeb0f4b39182660a78f44e0e4a5b3f0
title: Lightning Page Template Component Best Practices
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/components/components-config-for-app-builder-template-component-tips.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/components-config-for-app-builder-template-component-tips.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: bd556d81a42efa558c0db50cc8a9ec73c467ca1d1b4cdd9f36d4a3fec0a6f374
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Lightning Page Template Component Best Practices

Keep these best practices and limitations in mind when creating Lightning page template components.

-   Don’t add custom background styling to a template component. It interferes with Salesforce’s Lightning Experience page themes.
-   We strongly recommend including supported form factor information in the design file of all of your components. If you don’t, the component might behave in unexpected ways.
-   Template component supported form factors must be equal to, or a subset of, the supported form factors of its page type.
-   Once a component is in use on a Lightning page, you can only increase the supported form factors for the component, not decrease them.
-   Including scrolling regions in your template component can cause problems when you try to view it in the Lightning App Builder.
-   Custom templates can’t be extensible nor extended—you can’t extend a template from anything else, nor can you extend other things from a template.
-   Using getters to get the regions as variables works at design time but not at run time. Here’s an example of what we mean.

    ```xml
    <aura:component implements="lightning:appHomeTemplate">
        <aura:attribute name="region" type="Aura.Component[]" />
        <aura:handler name="init" value="{!this}" action="{!c.init}" />
    
        <div>
            {!v.region}
        </div>
        
    </aura:component>
    ```

    ```javascript
    {
        init : function(component, event, helper) {
            var region = cmp.get('v.region'); // This will fail at run time.
            ...
        }
    }
    ```

-   You can remove regions from a template if it’s not being used by a Lightning page, and if it’s not set to access=global. You can add regions at any time.
-   A region can be used more than once in the code, but only one instance of the region should render at run time.
-   A template component can contain up to 25 regions.
-   The order that you list the regions in a page template is the order that the regions appear in when admins migrate region content using the template switching wizard in the Lightning App Builder. We recommend that you label the regions and list them in a logical order in your template, such as top to bottom or left to right.