Create a new Portal-Page in Dynamics PowerApps Portal

To create a new page in Dynamics portal, the important step is to create a web-page first as the web-page is the backbone of your portal page.
So to create the Portal page we will first create the web page in Dynamics CRM.
Before Creating the portal I will show you how my newly provisioned portal looks. I have installed a Partner Portal here.

Now I will go to Dynamics CRM and will create the web-page first.
Steps to create the web-page are:
1. Open Dynamics CRM Portal modules and go to Website Entity Home-Page.

2. Now you can open the Web-Page entity home-page directly from the portal module and click on the create (New) button

3. on the create form you need to provide all the required details :
1. Name: The name of the web-Page
2. Website: Select the website record name from the lookup.
3. Parent Page: Select “Home Page” if its not the child of any other page.
4. Partial-URL: Provide the path of the page. This will form the URL for the portal page by concatenating with the root portal URL.
5. Page Template: Create a new one or provide an existing one if the Page is similar to any other page. Create a new one if you need to add a need web-template to the Page.
6. Publishing State: Select “Publish” if you want the page to appear or be available to the end-users.
7. Web-Form: Provide a web-form if the page need to accept or show data to the use in a step wise(multiple-tab) manner.
8. Entity-List: Add the entity-list if you want to show the grid data to the end Users.
9. Entity Form: Provide a web-form if the page need to accept or show data to the use from or on a single page.
10. Enable Ratings: Provide yes, if you wants your end-users to provide rating to the portal page.
11. Hidden From Sitemap: Every portal has its own site-map which shows the structure of the website and the hierarchy of the portal.You can select No if you want to show that page on the sitemap.
12. Display Order: Provide the numbers to all the web page. to understand the hierarchy of the web-page.

Here I have created this web-Page with name Show Folders List, which has partial URL as show-folders-list and I have also created one new Page Template called Show Folders List as I need to add the new custom Web Template.
There on the web Page you will find a Localized Content section below where a record gets created once you save the Web-Page.
So here in Dynamics Portal, when you create a new Web-Page which is also called the root Web-Page, Creates localized Web_page based on the no of Languages you have activated for your portal. In our case currently we only have English , So it created only one new page.

Based on your Language you can add the page title in the language web-page otherwise it will take the default or root web-page name as the page title.

Now coming back to our root Web-Page or say web-page only we have added the below page-template in there, which further has the web template which is currently blank.

And this is our Web-Template, which is currently blank.

Now to show this Web-Page on the primary Navigation we need to create a new Web-Link Set as our Show Folders List Page is the Parent page(as it’s parent is Home), Or you can also open this Show Folders List page using a button or link of this page from a different page,
But we will add this page to the primary Navigation. (It will also help you in understanding Web-Link & Web-Link Sets)
First I will let you know what is the Primary Navigation is in our PowerApps Portal, below is the image of the portal primary navigation.

This is your primary Navigation

Now we will go to Web Link Sets Entity and find the Primary Navigation record. This record will have child records of web-Link , Which will help in adding this page on the primary Navigation.
This Web-Link entity has been added in Dynamics to create a list and added them to a set and use them as per your need inside portal.

So in the Child Link images you can see what-ever link appearing on the primary Navigation of the portal is coming from here.
But it’s not an OOB feature of this list, There is an OOB liquid code on the header which reads the child record from the Primary navigation Record and it add all the web -pages attached in the web-link sets to the Primary Navigation.

We will now create a new Web Link and add our web-page in there.

Now all set , We can clear the portal cache and check the output. One more thing you need to create a contact in CRM add the username and password from the Web Authentication Section in Portal Contact form and also provide him the web-Role “Administrator” to login and clear the cache.

TO clear the Cache you will need to login the portal and then go to https://*******
Add this “/_services/about” to your current root portal URL and open in new tab. Below screen will appear, Click on Clear Cache. Then we back to previous tab and refresh.

Once you clear your cache your page will appear on the navigation Page

Now you can click on that Page and see how it appears on the portal
Since our Web Template is currently Blank So, it will only show the header and footer , as we marked that as default in the Page template.
Do check the URL, So you will understand how the partial URL from the Web-Page works with the portal.

Now we will go and try to add some basic Liquid code with The HTML and will see what happens on the portal.
I have added this code in the web-template:

<div class="container">
    <div class="page-heading">
        {% include 'breadcrumbs' %}

And lets See how this will appear on the Portal. Clear your portal cache again and refresh the URL.

You will find that the page is now displaying the path(Called breadcrumbs) appearing on top of the page. As we placed that in the header div inside the main container(Area between header and footer) .

I have explained the Liquid code and how to add that in web template in detail in my next blog . Go to Get Start with writing Liquid templates in Dynamics PowerApps Portal

Further you can add any entity form,entity-list to check how it renders on Portal. I have created on entity-List to display list of all contacts related to current user Account.

Now you can Add this entity-list in the web Page, Clear cache and check the portal Page.

Sometime it can create some issue and the Entity-list might not render directly on the portal-page, Then you can add it dynamically from web-template, By this line of code {% include ‘entity_list’ key:’Display Contacts’ %}

<div class="container">
    <div class="page-heading">
        {% include 'breadcrumbs' %}
     {% include 'page_header' %}
    {% include 'entity_list' key:'Display Contacts' %}
//This code will dynamically add the entity list on the portal-page using the name of the entity-List

Try again with Clear cache and check the portal Page.

Sorry for the markers, But I hope this will help many of you to understand the Dynamics portal structure.
Hope it Helps! 🙂 Thanks..
Comment back if you have any question or suggestions.

Next Page: Get Start with writing Liquid templates in Dynamics PowerApps Portal

2 thoughts on “Create a new Portal-Page in Dynamics PowerApps Portal

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s