Want to know more about DxH? Checkout this link
Do you want to beautify the URL’s that you embed in Ektron contents?
Don’t want to come outside of your Ektron workarea?
This custom smart desktop widget is for you!
This blog post is about a simple smart desktop widget.This Ektron smart desktop widget makes use of Twitter BootStrap frontend framework for the User Interface design.The functionality of this smart desktop widget is url shortening.
The idea is to make use of Google’s Url shortening service in Ektron. This can be done by making a POST request to the shortening service. The response can be deserializatied to a response class in order to retrieve the desired short url.
I made use of Twitter Bootstrap for the frontend development.
- Downloading the BootStrap: http://twitter.github.com/bootstrap/
- Adding the BootStrap files in the Ektron website.
- Refering the Bootstrap files in Widget Page
- Making use of Built-in Bootstrap classes for the widget elements.
I referred these bootstrap files in my widget page:
[gist https://gist.github.com/Bisileesh/5425049 /]
I also referred:
[gist https://gist.github.com/Bisileesh/5425053 /]
The widget panel looks like the following:
[gist https://gist.github.com/Bisileesh/5425054 /]
These built-in bootstrap classes gave a charm to my Ektron smart desktop widget.
And it looks like this:
[gist https://gist.github.com/Bisileesh/5425057 /]
Here in order to get the short url,a POST request is made to the google url shortening service url ,https://www.googleapis.com/urlshortener/v1/url.
The JSON response is parsed by deserializating the JSON string to a class. System.Runtime.Serialization namespace is made use for this purpose.
Master Layout is a concept in Ektron which adds some extra functionality to PageBuilder.This is similar to the MasterPage concept in ASP.NET.
Master Layout allows us to have some pre-defined widgets / contents in a Page Builder page.Admin can set these common widgets and can set privileges to allow/restrict other users to edit this. Thus the “Master Layout” can be used to create further page layouts.
And the pages created with master layout will be inheriting the widgets/contents that are assigned to it.
Master Layout can be created with the following simple steps:
Create Master Layout Template Page
A template page (.ASPX page) needs to be created for this. Which should contain the drop zones ,other contents needed.
A sample looks like this:
[gist https://gist.github.com/Bisileesh/5425066 /]
Adding Template to the Workarea:
This can be done in the same way, we do for the page builder wireframe templates.
Assign wireframe template to a folder:
Now we can assign this wireframe template to certain folder.
Create New Master Layout:
The drop zones in the master layout will look like the following:
For those drop zones which has to be pre-defined in the Master Layout can be unlocked by clicking the “Lock” symbol, and the rest can be left as such. Once the widgets are assigned you can “Publish” the Master Layout.
This “Master Layout” can be assigned to a folder as its Template.
And new page layouts can be created with it.
The new pages will be inheriting those pre-defined widgets.
A static page refers to a standard HTML page.
Let us look into creation of Static Web Pages using Ektron.
You can follow different approaches for achieving this. Here I am going to explain a simple approach for creation of static pages, without making use of PageBuilder technology in Ektron.
Creation of static pages by using QuickLinks in Ektron:
Create Template Page:
Create an ASPX page in Visual Studio, as this template page is going to be a static page, we can add a few ContentBlock Server Controls and necessary styling to it.
A sample Template page looks like this:
[gist https://gist.github.com/Bisileesh/5425077 /]
We can assign “DynamicParameter” attribute to the ContentBlock server control in order to assign the Content id through its URL.
By using this approach we can assign the Id’s by using Quick Links, also we can give desired Alias URL.
Create Quick Links:
Choose a folder to which you need to add the QuickLinks,
Choose QuickLinks from the Dropdownlist and Click on “Add” button
Define QuickLink by providing,
- Url Link
The url link should contain the content id’s as Query string parameters.
Create Alias URL:
Click ADD MANUAL ALIAS button,
It will allow you to create an alias by filling the following inputs,
You can choose the content to which you have assigned the QuickLink here,by choosing the content you will be able to pick the associated valid QuickLink from the adjacent dropdown.
Also you can give a proper alias name for the page, and fill out the remaining inputs accordingly. Once an alias is defined, you will be able to view the page with the alias name.
Thus, by using this approach you can create n number of static pages with a single template page.
Smart form is basically a “Content Skeleton”. You can pre-define the way in which certain contents need to be created.
The smartform configuration is defined from,
Here we can,
- Design the smartform,
- Assign properties to it,
- Define validations,
- Assign XSLT to it.
Once a Smartform is configured, we can assign this smartform configuration to a folder in order to create smartform contents.
Once a smartform content is created you will be able to do CRUD operations in a Smartform content by using Framework API,in the same way we perform for other contents.
We can use the same ContentManager class here also.
In the case of Smartform contents, The content.Html property will return XML data instead of HTML.this is because the HTML of a smart form content is authored by means of its default/custom XSLT and its corresponding XML.
So how can we get the HTML of a smartform content?
I have figured out a way to get this done.
We can get the the XSLT and XML of a smartform content using API and we can make use of XslCompiledTransform class to generate the HTML from XSLT and XML,
The code snippet for this is as follows:
By using the above approach we can get the HTML of Smart form content in Ektron.