Content Snippet in ADX Studio Portal / D365 Portal.

Hello guys....I am back again with an another post. In our last post, I described how to create a custom web page and add entity form in that page. If you have not checked this post yet then click Here to know that.

If you have a requirement like you want to modify the content from the portal side (front side) in your custom web page then Content Snippet will help this. Before moving forward, Firstly, you have to understand "What is Content Snippets."

Content Snippets are the editable content that is to be placed by a developer on a web template to modify the content from portal side (front side). Content Snippets can be edited either through the front-side or through the CRM interface.You must have website access permissions (Admin Permission) in order to edit content snippets.

When editing a snippets, either a Simple Text box will appear, allowing you to edit the content....

or the full edit appears, as it does when editing a page's copy...

Follow the steps to apply snippets in our custom web page. Here i will show you, How to apply both type of Snippets.

Step 1: Go to Portal > Content Snippets. 

Step 2: Create a new Content Snippets. 

Name : Give some name of snippet.

Type :  Give the type Text.

Value : Write some text here which you want to modify from portal.

Step 3: Go to Portal > Web Template. Open a web template on which you want to placed a content snippet.

Step 4: Now copy the below liquid template and placed it in source panel of web template.

{% editable snippets 'Name of Snippet' type: 'text' %}

Now check the Portal.....Now you are able to change the text from portal.

Follow the steps to apply Full Editor. Full Editor is use to apply image or apply custom html coding.

Step 1: Go to Portal > Content Snippet. Create a new content snippet.

Name : Give some name of snippet.

Type : Give the type HTML

Value : Leave it blank. (by the way, here we write HTML and CSS code but for better understanding leave it blank).

Step 2: Go to Portal  > Web Template. Open a web template on which you want to placed a content snippet. 

Step 3: Now copy the below liquid template and placed it in source panel of web template.

{% editable snippets 'Name of Snippet' type: 'html' %}

Now check the portal....... Now you are able to apply full editor box in portal.

Click Here to know,  Inheritance of web pages using Liquid Template in ADX Studio Portal / D365 Portal

How to add entity form in custom web page using Liquid Template in D365 Portal / ADX Studio Portal.

Hello guys.... this is the 2nd post on custom web page in portal. If you don't know the 1st post on this then click Here to know "How to create a custom web page" otherwise follow the steps to know how to add entity form in custom web page.

Step 1: Go to Portal > Entity Form and then create a new entity form.

Step 2: Go to Portal > Web page. Open a web page on which you want to apply this entity form. Now select the entity form which you created in last step.

Step 3: Now go to Portal > Web Template. Open a web template which is applied on the web page.

Step 4: Copy the below code and paste it in source panel of web template.
{% entityform id:page.adx_entityform.id %} or you can use this one also
{% entityform name:'Entity form name' %}

Now check the Portal....

If form is not visible to you then click on edit web page and check entity form is selected or not. If not then select it.

Click Here to know, Content Snippet in ADX Studio Portal / D365 Portal.

How to create a custom web page in D365 Portal / ADX Studio portal.

Hello guys.... I am back again with an another post. Guys if you have requirement like create a custom web page or you want to apply HTML and CSS then you are at right location, Here i will show you how to apply them and create a custom web page.

Step 1: Go to Portal > Web Template.

Step 2: Create a new Web Template. Give some Name and Select the website for which you are doing this.

Step 3: Now copy the below code and paste it in source of web template which you created in last step and then save this web template.
Code :

<html>
<head>
<style>
#example1 {
    background-image: url(/logo.png);
    background-position: right bottom, left top;
    background-repeat: no-repeat, repeat;
    padding: 15px;
}
</style>
</head>
<body>

<h1>sed diam nonummy nibh euismod tincidunt</h1>
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat:</p>

<div id="example1">
<h1>Lorem Ipsum Dolor</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>

</body>
</html>

Note: Most important thing is after make the changes in source panel of this web template. Don't forget to save this template. Sometime user forget to save these changes.

Step 4: Now go to Portal > Page Template.

Step 5: Create a new page template. I would suggest you, give the same name of the page template which you gave the name of web template.
Website: select the website for which you are working.
Type: type is to be web template.
Web Template: select the web template which you created in step 3.
Use website Header and Footer: Checked this option.
Entity Name: select the web page entity.

Step 6: Now go to Portal > Web Page.

Step 7: Create a new web page as shown in below snapshot. In page template field, select the page template which you created in step 5.

Step 8 (Optional): This is optional step. I am doing this step because in my code i gave Image URL.
So to show image in portal, I have to upload image in portal server as show in below snapshot.

Step 9: Add this web page in Header's Nav Bar.

Now check open this web page in the portal.....

Click Here to know, How to add entity form in our custom web page.