Kentico Developer Issue 1

Page 1

Kentico Developer Issue 1 September 2009

Conditional Transformation Tips and Tricks The Making of Tweet Me Worked Sample Code Accidental Notoriety Ralph Spandl


002 Content

Features 10 RALPH SPANDL Candice Pendergast writes about the man behind the blog that has so quickly become a mustread for anyone working within Kentico.

14 TWEET ME Ralph Spandl pulls apart the inner workings of his first Marketplace contribution Tweet Me, sharing the thought processes behind his development.

20 FROM WORDPRESS TO KENTICO The introduction of a tutorial series which will see us working through the migration of the Kentico Develper site from Wordpress to Kentico.

22 SOCIAL NETWORKING WITH KENTICO The introduction of a tutorial series which will see us working through the re-creation of the mumspace.net social network within Kentico.

r42

.CA


Content 003

Regulars 4 MY DESK Richard Pendergast has an issue with magazines being labelled up to the minute and interactive, seeing value in the fact that they aren’t.

8 NEWS It’s been a big month with a hell of a lot happening in such a small space of time. Candice Pendergast writes up the real head-turners.

24 TIPS AND TRICKS Matthew Lee shares the first of the many lessons he has learned, rolling out nearly 70 Kentico sites within the last 18 months.

26 BEST OF THE BLOGOSPHERE Every month we search out interesting blogs and blog posts, sharing any of those we find real value in, or that we think add real value to the community.

Published by Not At All Strange Pty Ltd ABN 91 125 365 979 PO Box 353 Menai NSW Australia Enquiries Subscription enquiries: sales@kenticodeveloper.com Editorial enquiries: editorial@kenticodeveloper.com Advertising enquiries: advertising@kenticodeveloper.com Copyright Kentico Developer 2009 www.kenticodeveloper.com


004 Editorial

Richard Pendergast @kenticodev richard.pendergast@kenticodeveloper.com

My Desk I have an issue with magazines being labelled up to the minute and interactive (especially when I’m running late with an issue), and actually see real value in the fact that they aren’t. You see the value of a magazine stems from the fact that it is not dynamic, it is not now, and it is not realtime. A magazine sets out to provide an insightful window into the past, however recent, surrounding it with commentary and observation, colouring the everyday and producing a snapshot for the future. The online world of today on the other hand derives value from the fact that it is dynamic, that it is now, that it is constantly changing and evolving, drawing upon a very real user need to be here, now, and interacting. Kentico Developer magazine aims to be a mashup of the two - a regular snapshot of a rapidly evolving medium. One day I hope to look back at this, our first issue, and to discover insight into how we used Kentico way back in September 2009. I hope to look back at those setting the

benchmarks in both development and design, and to draw inspiration from what they were able to do way back when. I hope to discover best practices that still stand, and discussions surrounding technique that still apply. So, looking back, August saw us in amongst an exciting month for Kentico - with a new version released, a new partner program launched, the first installment in a new webinar series aired, and a promise made to plant a tree for every bug found. Unfortunately, August also saw us in amongst the final nastiness of launching both a website and a printed issue of Kentico Developer. We bit off a little more than we should have and spent most of the month chewing frantically. This issue and the launch of Kentico Developer as a whole owe a hell of a lot to the many people who got behind us and helped get it over

the line. September sees us introducing the first members of the team, Matthew Lee (Tips and Tricks), Candice Pendergast (Features), and yours truly. It also sees us introducing our first feature contributer, Ralph Spandl (Tweet Me), who’s passion promises to add real colour to the magazine, We’ll also be launching two new tutorial series, Wordpress to Kentico, and Social Networking with Kentico. Most of all September sees us already on the way to our second issue. I hope you enjoy the read, and look forward to what we can deliver in October. Richard Pendergast Editor


Save on your content management When we went to look for a content management system for our customers we had two things in mind: it should be flexible for our customers as well as us, and it should be good value for money. That’s why we like Kentico CMS. And so do our customers. It’s so flexible that we were able to integrate Microsoft Commerce Serve, creating a powerful e-commerce platform. But it’s also so flexible and easy to learn that we can create a new web site in two weeks. So why don’t you contact us and see how we can help you save your piggy?

Knowledge. People. Solutions.

T: + 31(0)6 - 497 819 21 E: contact@avivasolutions.nl W: www.avivasolutions.nl W: blog.avivasolutions.nl

Internet & Commerce - Business Intelligence - Information Worker - Application & Software integration - Custom Solutions & Software factories



Editorial 007


008 News

News It’s been a big month with a hell of a lot happening in such a small space of time. Candice Pendergast writes up the real head-turners. Kentico CMS 4.1 Released

Partner Program

I think I can speak for most of us when I say that the August 17 release of Kentico CMS 4.1 was an unexpected surprise. The release date given several months ago was easily forgotten, and the hints of a pending release littered through Martin’s blog posts were easy to overlook if you were caught up with the frequent patch releases of 4.0. The new functionality is awesome, and this is is a release that goes a long towards satisfying the wishlists of most Kentico developers. You can take a look at the release notes on the Kentico website, but some of the major enhancements found in the new version are: • a new Lucene based search engine bringing to the table relevency, preview, and scope • new media dialogs leading to more intuitive media usage • output caching, partial caching, and cache debugging • multilingual improvements including culture specific workflows • customisable module installation • versioning, worklow, and permissioning of attachments. You can read more about the release at: ȖȖKentico CMS 4.1 Released http://bit.ly/orzKF ȖȖ10 new things I value most in Kentico CMS 4.1 http://bit.ly/2l2Dy0 ȖȖInsertion of images and media was never easier http://bit.ly/10DK17

A brand new Kentico Partner Program launched last month, with the major change being that the program now offers discounts and benefits based upon a points system, rewarding more active partners with higher discounts and increased benefits. Partners collect points for various activities, and are assigned a level based upon the number of points collected. This level is then used to determine discounting on future Kentico purchases. The discounting can be significant and a Gold Certified Partner will now receive a 30% discount on Kentico purchases. The program appears to be very well thought out and takes all Kentico partners into account, big and small. Allowing partners to gain points for activities, as well as sales, meaning that a passionate Kentico advocate is now given the same opportunities as an established operation bringing in a high volume of sales. The new program also provides a heap of other enhancements and additions, including a designated account manager, targeted marketing materials, invitations to partner only events, early access to new blog posts and online material, quick and responsive technical support, a listing in the Kentico partner directory for Certified and Gold Certified Partners, and a new website - the Partner Portal - to allow partners to manage their participation. This is a great initiative and one I really look forward to watching mature. ȖȖNew Partner Portal & Program Launch http://bit.ly/rdHBh


News 009

First Kentico Webinar As part of the newly updated partner program, Kentico kicked off a series of instructional webinars for partners. The idea behind the series is that Kentico partners will now not only have early access to educational presentations of this nature, but also to the guys holed up in the engine room at question time, and seriously, for those of us not located anywhere near the Czech Republic this access may prove to be the larger opportunity. The material behind this installment of the series – Advanced transformations in Kentico CMS – was well and truly worthwhile, and Martin delivered it without incident, overcoming the difficulties of engaging an audience he could not see, and feelings of speaking into the void. The webinar was a great success, and I look forward to further installments. A recording of the presentation, together with the supporting Powerpoint presentation will be made available for download via the Kentico partner portal over the next couple of days. You can read more about the webinar at: ȖȖFirst Kentico CMS Webinar http://bit.ly/DOose

Kentico Sharepoint Conector August also saw Kentico release a free Kentico CMS Connector for Microsoft SharePoint, allowing business users to create content on their SharePoint intranet and to publish it on public-facing Kentico web sites. This is a great move by Kentico, allowing organizations to work around the lack of Web Content Management features within Microsoft SharePoint whilst also simplifying the publishing workflow. Surprisingly, the connector works with all editions of Kentico CMS 4 including the free version. The Kentico position is that the fast adoption of Microsoft SharePoint leaves many organizations in a difficult situation, since SharePoint doesn’t provide a complete solution for public-facing web sites, leaving users to manage their online content via other systems. Kentico addresses this by allowing users to create content in the SharePoint environment they are already familiar with and publish it

automatically to Kentico-powered public sites. This should enable organizations to publish content faster, with lower costs, and with better control over the content lifecycle. Needless to say we will be installing Sharepoint, putting the connector in place and getting back to you with a review. The connector is available free of charge at the Kentico website, within the Kentico Marketplace. You can read more about the connector at: ȖȖSharePoint Connector http://bit.ly/12JNlq ȖȖSharepoint connector demo video http://bit.ly/3EFkV8

Kentico Trees and the Bug Olympics Kentico announced in August that they will be planting a tree for any bug found within version 4.0, and endeavouring to fix the bug within seven days of it being reported. In a very cool move, each tree will be devoted to the person who reported the bug first. The trees will be planted by company employees and management in November 2009, in partnership with Czech Environmental Partnership Foundation. Kentico have committed to the planting of at least 100 trees, if the bug count does not reach that high. This is a great initiative, providing at least three incentives that I can see for users to find and report bugs early: • find a bug and help the environment • find a bug early and have it fixed quickly • find a bug and make a programmer do some real work. Eighteen bugs later, and we are being given further incentive to hunt - do it for your country. Will Australia find more bugs than New Zealand in the bug olympics? Let’s see. I for one will be having a good go at making sure of it. Then again I was sold on the idea of having a tree commemorating my find. You can read more about the initiatives at: ȖȖKentico Software Plants a Tree for Every Bug http://bit.ly/mzg7H ȖȖBug Finding - New sport at Autumn Olympic Games http://bit.ly/Iub6Z


010 Feature

Story by Candice Pendergast @candypendo candice.pendergast@kenticodeveloper.com

Ralph Spandl - Accidental Notoriety We interview the man behind the company behind the blog that has so quickly become a musthave bookmark for anyone working within the Kentico space, discovering along the way that the recognition was an accidental by-product of a career spanning well over a decade. Until fairly recently the blogosphere has been relatively quiet with regard to Kentico, but as the Kentico story begins to gain traction, there is one voice that is becoming increasingly recognised, that of Ralph Spandl, Interactive Architect and founder of r42. Although almost accidentally, Ralph’s series of blog posts on his use of Kentico have become a starting point, a research resource, and in many ways, a bible for other Kentico developers worldwide.

In the beginning Ralph was designing for interactivity well before the heady days of the modern internet, with his first real break coming way back, while completing a Masters of Visual Communication at the University of Fine Arts in Berlin.

Taken under the wing of one of his lecturers Prof. Joachim Sauter, who also happened to be one of the founders of ART+COM, a new media agency, Ralph was hired on a part-time basis, meaning that half his was spent time working with ART+COM, and the other half was spent completing his Masterpiece. ART+COM had just been fortunate enough to land a major contract with T-Mobile (formerly Telekom), researching interfaces and interactive applications that might prove practical on a broadband connection, and Ralph was taken on in order to bring his knowledge and ideas surrounding user interfaces to developer driven projects to the table. This very quickly meant that, at a time when user experience design and information architecture were largely theoretical concepts, Ralph found himself at the forefront and exploring

what would later become best practice. Ralph had found his passion, and even his Masterpiece focused on developments within the usability space, working with an architect to design and develop applications that allowed 3D models of buildings and skyscrapers to be visualised online. The resulting application (although struggling on the bandwidth and CPU capabilities of the day) even allowed for the rendering of environmental factors and infrastructure details, within an interface that allowed a user to zoom into buildings and perform flythroughs.

Moving on On completing his studies, instead of staying at ART+COM, Ralph opted to leave Berlin. “I couldn’t stand the city anymore. I like big cities, but


Feature 011

“People think I’m the big Kentico expert, but I would say there are hundereds of people out there who know a lot more about Kentico than I do, they just don’t talk about it.”

He may not understand why, but Ralph’s blog has led him to be one of the most respected Kentico developers to date.

Berlin is very dark, grey, no snow, no mountains, and I found the people very unfriendly. In the six years I studied there I enjoyed it a lot, but in the end I just couldn’t take it anymore.” During his studies, Ralph had spent some time in Canada, gaining experience at an advertising agency in Montreal. This experience highlighted two things – that he did not want to work in advertising, and that Montreal was not Berlin. It was here that he had met Matthew Alapi, the founder of another agency, Mosaic, and asked for a job. “I told him I wanted to get into this interactive stuff and that I didn’t want to do print anymore. So he said ‘let’s

try it - come over’. When we started off I still did a lot of print, but the goal was to push websites and CD-ROMs.“ Being 1997, it took a lot of effort for Mosaic to sell websites, but Ralph persisted, determined to follow his passion for interactive media. While the web was a hard sell back then, Ralph was able to spent much of his six years at Mosaic learning as much as he could about designing and programming for the web. “We finally had a client where we could build a website where we needed databases so I learned how to set up a database, first using Access then moving onto SQL Server. I was doing everything in ASP and I was

doing everything – the programming, the design, the HTML, everything. Even though I came from a designer background, back then you had to pick up everything. You had to learn the programming skills, even if you weren’t that good at it.” With the bandwidth not what it is today, Ralph often found it more logical to create CD-ROMs as opposed to websites and give them out with brochures. However over time, capabilities improved, and online technologies were introduced, in particular Flash and e-commerce, and this led to new opportunities. After six years though, Matthew developed a new partnership with someone very keen on print, and not all that keen on interactive media, and so, with the writing on the wall at Mosaic, Ralph decided to go out on his own. “I still have an excellent


012 Feature

“It’s not good enough just to be good at something. You have to tell people you are good at it.”

Having an office is expensive, but it changes the client’s perception – you are not a freelancer anymore.

relationship with Matthew. We just had a talk back then and I decided that if there was not much more exciting work then I might just go off myself and build something on my own.”

Stepping out After leaving Mosaic, Ralph started working as a freelancer, a career which continued for the next two to three years. “I was working from home, and as it is with freelancers I had to get myself organised and build up my clientele. I was still doing a little bit of work for Mosaic with clients who had their websites hosted there, but it wasn’t that much anymore. The first year was not easy, but it picked up fairly quickly.” Work began to roll in through word of mouth. “Everything goes on client satisfaction. They like what I do, they tell their friends, and their friends

call me.” After two years or so, Ralph partnered up with a fellow developer named Francis, with whom he founded Quattrocento, and decided to move out of home into an office to attract higher profile clientele. “When you’re a freelancer there are limits. At some point the companies don’t trust you anymore. They say ‘who is this guy doing my website – he might be gone tomorrow.’ Having an office is expensive, but it changes the client’s perception – you are a not freelancer anymore, you are a company, and you are going to be around for a while.” Ralph continued with Quattrocento for around three to four years, at which point he and Francis began to have different ideas about the direction of the company – Francis wanted to move more towards communications, while Ralph wanted to stick to interactive and websites.

“These days everything is becoming so specialised that you cannot do both in a small company. It would just not work out.”

Founding r42 and Kentico True to his passion, Ralph founded r42 in September 2008, an agency built upon website development and interactive media design that he was able to get started with the support of Alice O’Brien - who he’d worked with at Mosaic, during his time as a freelancer, and at Quattrocento. The work at r42 lent itself nicely to content management, and this led to his discovery of Kentico. “Kentico is something that I had been looking for since I started doing websites and databases.” “Very quickly I realised that you have to separate content from structure from representation. In the beginning things were more laborious, with


Feature 013

changes having to be made manually, and interfaces having to be created for e-commerce sites. It became obvious that this was expensive, and that not many clients would be able to invest that much money.” As a solution to this Ralph began building his own CMS, but he realised very early on that the time and development required developing and maintaining this would be too much to make it worth it, and so began the hunt for a good off-the-shelf CMS. After trialling the most promising of those available and being turned off by bad support, awful interfaces and inadequate features, he came across Kentico. “I installed Kentico and tried it out on a website on a one month free trial. The support was really good, and I was even given a longer trial – it was all no problem. I reported some bugs and the bugs were fixed during my trial period. It was a completely different experience – they really listened.” “We got an opportunity to use it on a website we needed to build quickly and I decided to take the gamble. The project we did was quite large – over 100 pages – and it went well. The client was super happy, and at this point I decided that we should build everything with the same system.” On a recent trip to Prague, Ralph found time to meet up with some of the guys from Kentico. “They are really nice guys. Petr seems to be the genius behind everything, but they are really nice and humble and friendly. I had a list of things I still don’t like in Kentico and we had a great discussion about them and I think most of it will come out in the newer versions. I felt

comfortable with the people and felt comfortable with the software.”

Getting social Surprisingly, Ralph is relatively inexperienced with social media. “Social media is something new to me. I have to admit that I didn’t believe in blogs, or Facebook or Twitter. I thought that this is just stuff for people that just want to communicate on the web. I was never a great communicator – I just never thought I had to say a lot. Everything was written there, why should I have to add my stuff in here.” This changed as he began writing about Kentico to convince clients that it was the best solution for their project. “Every time I meet a new client I have to repeat myself, showing off all of the features, so I started writing articles. Then when I got a new client I would just send them a link to all all of my blog posts, and they could read up on what I’m preaching.” But he’d tapped into something. Other people were picking up on the content in his posts, even Kentico. “They talked about my blog posts on their website and made me sort of ‘famous’. I started to think about using social media to create a network - to get out there and say ‘this is my point of view’ and start some conversation. I realised that you have to make some sort of fuss to get people to pay attention. It’s not good enough to be good. You have to tell people that you are good to have them know about you.” Ralph has become a bit of an accidental celebrity in the Kentico space. “People think I’m the big

Kentico expert, but I would say there are hundreds of people out there who know a lot more about Kentico than I do, they just don’t talk about it.” Accidental or not though, Ralph is certainly becoming revered as a specialist when it comes to Kentico. “I don’t just go off the Developer Guide and then just write about it. Everything I write about I have tried before. I don’t go into major detail though. I give people the basics.” With the passionate voices of others like Ralph, Kentico are slowly managing to create a community around licensed software, in a similar manner to that of open source software. “I am committed to Kentico as a CMS, so anything I can do to help them and build a community I am happy to do.” And like most of us he also commits to more than that. “I am going to try to do one Tweet a day, and two blog posts a week, so let’s see how I go.” Will he hit two blog posts a week? Maybe not, But will the posts he write be read by an avid Kentico community? Without doubt. ȖȖr42 http://r42.ca ȖȖthe r42 blog http://r42.ca/r42-blog


014 Feature

Story by Ralph Spandl @r_42 blog@r42.ca

The building of Tweet Me Ralph Spandl pulls apart the inner workings of Tweet Me - a custom Kentico web part allowing for the sharing of blog posts via Twitter - sharing the thought processes behind the development. The idea of developing a Kentico web part that would automatically append a Twitter update link came one raining morning. Until that point I had not planned to write a web part and I was not a big fan of Twitter. I’d had one of my colleagues Alice O’Brien telling me that I should be using Twitter, for weeks, but I could not imagine spending any time tweeting, and I had no idea what to tweet about. In fact, the only thing I could think of using Twitter for was to maybe spread the word about my blog posts. An idea was born. I needed a simple, easy-to-use button that would create tweets of my blog posts, usable by my readers as well - a simple one click web part. Google confirmed that this could be achieved in one morning. The simplest solution I found used JavaScript. Turning this into a server side thing was easy enough to do - creating a twitter-status-update-link using the title information and the URL of the current page.

Ironing out the kinks On the way to my second cup of coffee, I bumped into the first problem pretty much all my post URLs would eat up all the available 140 characters for a tweet. I had to look

into URL shortener APIs. The first that came to mind was obviously, “TinyURL” (what a genius name) and surprisingly, ready to use C# code was already available. But while researching for a solution to the TinyURL part, I stumbled upon a blog post that discussed the benefits of a shortener named bit.ly, wich also provided click statistics of the shortened URLs. This was a solid argument, and convinced me to include it in my web part. Unfortunately, because bit.ly requires a developer API, I still needed to integrate the TinyURL shortener as a plug and play alternative. Bit.ly was quite a bit trickier to implement. The API returns the result either in JSON or XML format, both of which require extra parsing. The code from the Emad Ibrahim somehow didn`t work for me, but the Yahoo developer network offered a very nice tutorial on how to use XML returned from a web service. I’d only just hit lunch time, and with the impression that my creation wouldn’t really offer any benefits over a solution


Feature 015

like AddThis, I decided to add the option of configuring Google Analytics campaign tags for the shortened URL. On top of this, as a designer, I of course wanted complete control over the look of the button, and so I decided to allow for either a text link or an image button. The thinking was done, most of the code was already written (and by someone else in most cases). I just needed to put the pieces together.

Building a Kentico web part Building re-usable web parts in Kentico is not as complicated as it appears. As always, it’s worth planning before getting started, and in this case the planning involved deciding what the web part should do, and more importantly which properties should be made available in order to keep the web part flexible. To save time covering the basics, I recommend reading “Developing Web Parts” in the Kentico Developers Guide http://bit.ly/EgtD9.

The web part properties If you want other developers to use your web part, you should document the web part - through the web part field captions, and the descriptions in both the properties tab and the documentation tab - and then submit it to the Kentico Marketplace.

TinyURL or bit.ly) • bit.ly API login (for use with bit.ly shortener) • bitly API key (for use with bit.ly shortener) • Five text fields for Google Analytics campaign tags For the status update text, or the text of the tweet, I took advantage of the built in macros of version 4.0, deciding to To make your configuration window nice and clean, it is wort using the category separators which are available. use the page title. This macro or any other macro can easily be created with the macro pull-down menus. If you are wondering how When using the page title macro, the page title for the page must be defined. The inherit checkbox will not do the job, and unfortunately the “Page Title Generator” web part from by Elijah Taylor / Aceoft Studios) won’t work in this case either. The macro that I use is: {%cmscontext.currentdocument. documentpagetitle%} to access the macro window, try to click on the tiny little black arrow to the left of each property field.

Defining the properties When developing a web part, you usually start with the code behind, but to get an overview of all functions, I prefer to cover the web part properties first. Each Kentico web part automatically has a set of properties, like visibility and HTML envelope included. There is no need to configure or code these properties which saves a lot of work. Based on the concept of the Tweet Me web part I configured following properties : • Text to be tweeted (text box) • Image or text link (drop-down list) • Text link (used if text link was selected above) • Image source for image links • URL shortener (Drop-down list with choice between

For Tweet Me, all properties used in the web part configuration box had to be defined. public partial class CMSWebParts_r42_TweetMe: CMSAbstractWebPart { #region “Public properties” /// <summary> /// Text to tweet /// </summary> public string TweetText { get { return ValidationHelper.GetString(this.GetValue(“TweetText”), “”); } set {


016 Feature

} }

this.SetValue(“TweetText”, value);

The TinyURL string queries the TinyURL web service which returns the shortened URL. private string TinyUrl(string Url) { try { WebRequest request = WebRequest.Create(“http://tinyurl.com/api-create. php?url=” + Url); WebResponse res = request.GetResponse(); string text; using (StreamReader reader = new StreamReader(res. GetResponseStream())) { text = reader.ReadToEnd(); } return text; } catch (Exception) { return Url; } }

The bit.ly string queries the bit.ly web service which returns the requested XML. First, the web part searches to see if the status code is “OK”. If it`s not then TinyURL is used to shorten the URL. Otherwise it returns the value of the node with the ID shortUrl, which is the shortened URL. The only other thing to note here is that the bit.ly history is turned on. This means that if you log onto your bit.ly account, you can see which URLs have been shortened with your API key and you will also have access to the statistics of each. By default, history is turned off when shortening URLs through the API. private string BitlyUrl(string Url) { string requestUrl; try { requestUrl = string.Format(“http://api.bit.ly/shorten?format=xml&versio n=2.0.1&history=1&longUrl={0}&login={1}&apiKey={2}”, HttpUtility.UrlEncode(Url), BitlyAPILogin, BitlyAPIKey); XmlDocument doc = new XmlDocument(); doc.Load(requestUrl); XmlNodeList nodes = doc.GetElementsByTagName(“statusCode”);

foreach(XmlNode node in nodes) { statusCode += node.InnerText; } if (statusCode == “OK”) { XmlNodeList nodes_2 = doc.GetElementsByTagName(“shortUrl”); foreach(XmlNode node in nodes_2) { shortURL += node.InnerText; } return shortURL; } else { // Fall back to TinyURL if Bit.ly fails (no API key etc) Url = TinyUrl(Url); return Url; } } catch(Exception e) { // Fall back to TinyURL if Bit.ly fails (no API key etc) Url = TinyUrl(Url); return Url; } }

I have to admit that I am not too proud of the Google Analytics String. It is a bit cumbersome, but it works. The code loops through all query strings in the URL and keeps all but the one for Google Analytics, because we want to add our own Google Analytics code to it, if they have been defined in the web part. private string createGAString() { try { string GAString = “?”;

// Typical GA query string // ?utm_source=source // &utm_medium=medium // &utm_term=term // &utm_content=content // &utm_campaign=name

// Get querystring collection and add all querystrings except GA and aliaspath HttpRequest q = Request; NameValueCollection collection = q.QueryString; foreach (string key in collection.AllKeys) // <-- No duplicates returned. { switch (key) { case “utm_source”:


Feature 017

break; case “utm_medium”: break; case “utm_campaign”: break; case “utm_term”: break; case “utm_content”: break; case “aliaspath”: break; default: GAString += key + “=” + collection[key] + “&”; break; } } // Now add own GA querystring if (GA_CampaignSource.Length > 0) { GAString += “utm_source=” + GA_CampaignSource + “&”; } if (GA_CampaignMedium.Length > 0) { GAString += “utm_medium=” + GA_CampaignMedium + “&”; } if (GA_CampaignName.Length > 0) { GAString += “utm_campaign=” + GA_CampaignName + “&”; } if (GA_CampaignTerm.Length > 0) { GAString += “utm_term=” + GA_CampaignTerm + “&”; } if (GA_CampaignContent.Length > 0) { GAString += “utm_content=” + GA_CampaignContent + “&”; } if (GAString.Length == 1) { return “”; } else { // TRIM TRAILING AMPERSAMP GAString = GAString.Substring(0, GAString.Length - 1); return GAString; } } catch (Exception) { return “”; } }

Tying the pieces together Once these pieces had been built, I had to bring all the parts together. First I had to stop the web part from being executed, when the web part is not actually visible.

This is not done automatically by Kentico and if this line is not included, the web part will query the web service, even if it is not rendered. For example, if you were to include the web part in a template, configuring it to be shown only for blog posts, without this code the web part would be processed for ALL pages using this template, regardless of whether or not they are blog posts.

// Don’t process if web part is set to be not show on doc type if (StopProcessing) return;

Next, I had to get rid of the query string and create a new one: // Trim all querystrings - we will add on when we create the GA querystring string[] urlArray = new string[2]; char[] splitter = {‘?’}; urlArray = currentURL.Split(splitter); string GAString = createGAString(); currentURL = urlArray[0] + GAString;

Then I used one of the two web services to create the shortened URL, unless I am in the CMS Desk, in which case bit.ly would create shortened URLs of your CMS Desk pages. // Don’t create shortURL in preview mode if (ViewMode != CMS.PortalEngine.ViewModeEnum.LiveSite) { tinyURL = “(No URL in preview mode.)”; } else { // What service to use if (TinyURLService == 2) { tinyURL = TinyUrl(currentURL); } else if (TinyURLService == 1) { tinyURL = BitlyUrl(currentURL); } }

Then I made sure that the total message is not longer than 140 characters including the shortened URL.

// Make sure complete message is not longer than 140 characters int MAX_CHAR_ALLOWED = 140; int TweetTextLength = tinyURL.Length + TweetText.Length + 1; // 1 is for additional space between text and URL

if (TweetTextLength > MAX_CHAR_ALLOWED) { TrimCharacter = TweetTextLength - MAX_CHAR_ALLOWED; CharLength = TweetText.Length - TrimCharacter - 3; TweetText = TweetText.Substring(0, CharLength) + “...”; }

Finally I created the hyperlink. Either an image or a


018 Tutorial

text link, make sure that the page opens in a new window. if (ImageOrTextLink == 1){ // Text link tweetMeLink.Text = TextLink; } else if (ImageOrTextLink == 2) { // IMAGE LINK tweetMeLink.ImageUrl = ImgSource; } tweetMeLink.Target = “_blank”; tweetMeLink.NavigateUrl = “http://twitter.com/home?status=” + TweetText + “ “ + tinyURL;

The last part was the Web User Control - it contains only the hyperlink. The CSS class and the IDs allow the html to be styled properly. <%@ Control Language=”C#” AutoEventWireup=”true” CodeFile=”~\CMSWebParts\ r42\TweetMe.ascx.cs” Inherits=”CMSWebParts_r42_TweetMe” %> <div id=”tweetMe”> <asp:HyperLink ID=”tweetMeLink” runat=”server” CssClass=”tweetMeLink” /> </div>

The bit.ly effect Nobody likes bugs. But finding and fixing bugs can help you to discover amazing things. I had such a bug, when I developed the Tweet Me web part for Kentico CMS. The query string The one I came across was that I had forgotten to remove any existing Google Analytics campaign tags before adding new ones. The result of this was that if a user landed via the shortened URL on my site, the new, un-shortened URL had all of the campaign parameters included twice. In practice this should make no difference, except that it would create long URLs that would only get longer as users keep the snowball rolling.

Analytics check Two hours after implemented Tweet Me on my blog though, Google Analytics indicated that I’d had over 200 visits. I checked the bit.ly history and found that bit.ly had shortened the same page many, many times, even though this waqs not supposed to happen. This was how I discovered that each shortened page had

a very long query string. I looked into my Google Analytics statistics and found out that the visits to my site were from Linux systems, and that all had a network location of amazon.com. This triggered something, and I remembered reading somewhere that bit.ly stores a cached copy of every page who’s URL is shortened. Digging a little, I found out that these thumbnails are stored on Amazon’s S3 storage and the processing is done on Amazon Elastic Compute Cloud (Amazon EC2).

Thumbnail creation Now it began to make sense. Amazon alone was responsible for the traffic. Every time the service visited my page to create a thumbnail a new URL (same base link but different query string) was created. This led to another thumbnail, leading the service to visit the page over and over again. The bug is now fixed, but don’t be surprised if with Tweet Me installed on your site and bit.ly as the shortener, you get quite a few visits from Amazon.

A rewarding experience And that’s it. Tweet Me is complete. As with almost any software development, it happens that every now and then you run into bugs that double your estimated development time, but outside of this it is actually quite easy to built Kentico web parts. Just don’t expect as I did, to finish it off in one morning. ȖȖTweet Me download http://bit.ly/12CZhD


Tomorrow starts today

Building web sites is not the problem anymore. The real challenge is to build sites that can not only be easily updated by non-technical personnel, but that are also flexible enough to be adapted to the constantly changing environment of the web. Ralph Spandl – founder of r42 communication

r42 uses Kentico CMS to built web sites. We are convinced of the power and the flexibility of this content management system, and we love and value the unparalleled support and customer relationship. Our experience is that Kentico has two open ears for its partners, and that’s why we are proud to become a Kentico Gold Certified Partner.

Interactive branding agency

r42

.CA

To learn more visit www.r42.ca


020 Tutorial

Tutorial series by Richard Pendergast @kenticodev richard.pendergast@kenticodeveloper.com

Wordpress to Kentico Series Introduction

When a Wordpress site gets out of hand, there comes a point where another platform is needed. Here we forecast what’s coming up in the first of our How-to series - migration a Wordpress site to Kentico. For those who’ve been living in a cave, and do not know, Wordpress is a PHP/MySQL based open source blogging engine, supported by a passionate developer community. With thousands of free themes, and a smorgasbord of plugins, it really is amazing what you can do with it.

“... what begins life as a blog, evolves into a blog with a CMS, and then a blog with a CMS and a forum, and so on.” In many cases though, what begins life as a blog, evolves into a blog with a CMS, and then a blog with a CMS and a forum and so on. Very quickly we reach a tipping point, where we begin to believe we have a candidate for migration to another platform.

Personal experience shows that sites that evolve in this way rapidly become unwieldy monsters, requiring much more time programming, testing and training of clients than would otherwise be required. We will be taking such a site and migrating it to Kentico, learning how to: • setup and configure a Kentico development environment and a Kentico production environment • use several of the Kentico default modules including Article, Blog, Forum, Bizform, and Newsletter • use several key web parts including Repeaters, Editable Text Regions, and Page Placeholder • take advantage of Page Templates, Layouts, and Containers, making the best use of visual inheritance • skin a Kentico website drawing upon an existing template (Wordpress)

• use version control to manage a large project • deploy new code, promoting it from development to production, and • import data from an external source (Wordpress) The site being migrated will be the Kentico Developer site itself, initially set up in Wordpress for this very reason. We will let the existing site evolve as our needs become apparent, tapping into existing Wordpress plugins when and where we need to, in a way that matches the natural life-cycle of a typical site. Hopefully, by the time we perform the actual migration, not only will we have something a little complex and interesting in it’s requirements, but we will have demonstrated the need for the migration. The project is already underway, and the series begins with this post. The site is starting to evolve as requirements


Tutorial 021

surface - we are in the process of adding author profiles, newsletter subscription functionality, ecommerce add-ons, and community building capabilities. I am already in the process of uploading the intial codebase (Wordpress based) to an SVN repository which will be made available, and am finishing up a post on the preliminary installation and configuration of the new Kentico website. This tutorial series will be interactive. We will be publishing our work online as it happens, encouraging regular updates and open discussions. Each issue of the magazine will

summarise our progress and provide insight into lessons learned over the course of the month. All of the code that we develop over the course of the series will be made freely available on the website via an SVN repository, and any useful pieces which can be separately packaged will be made available via the Kentico marketplace. This is an exciting project. We were worried that a series aimed at those new to Kentico, or evaluating Kentico for the first time, covering the basics software selection and configuration, hosting selection and configuration,

site evolution and migration, and site deployment - would not be interesting to most people, but since we already have questions coming in I think we may have hit a nerve. Along the way we will make a point of trying to introduce industry best practice, and established techniques wherever posssible. I hope you get as much out of the series as we hope to get out of developing it.


022 Tutorial

Tutorial series by Richard Pendergast @kenticodev richard.pendergast@kenticodeveloper.com

Social networking with Kentico Series Introduction

Once a vibrant community, mumspace.net is in need of a little love. And what better way to give it some then by migrating it over to the lastest Kentico platform - and learning a thing or two along the way. A couple of years ago my wife and I put in place the beginnings of a self service social network for mothers, based upon a heavily customised Wordpress MU blogging engine. The site was fairly revolutionary at the time, and grew very quickly, but our lack of experience, our financial commitments, and a new addition to our family saw us very quickly overtaken in the space. The site still exists today, but with the many mistakes made setting it up, and the lack of love shown it over the last 12 months, it has degraded into something which is used fairly extensively by spammers for link farming, and would require regular attention if we were to continue. There is however the remnants of a passionate community still present, and although we published a notice pre-empting the closure of the site, we’ve decided to re-build it instead,

using Kentico, and to set this as the basis for a tutorial series. The project will provide an opportunity to discuss not only the design, development and rollout of a Kentico community, but also the mistakes made, lessons learned, and real world experiences of building such a large and complex site.

Introducing mumspace.net Mumspace.net was essentially a female ning.com before we knew what Ning was. It was an extension of minti.com before we knew that Minti existed. It was the dream of two doe eyed individuals who thought they could take on the world with no budget and no understanding of what or who they were up against. And surprisingly, we nearly carried it off. These were the heady days of readily available advertising

dollars that came prior to the global financial crisis. It didn’t matter that we didn’t understand the business of growth, or that we knew little about our audience. It simply mattered that we were targetting a niche that advertisers wanted to tap into. Our wake up call came in the form of a media buyer, offering to purchase all of our advertising inventory, with the realisation that we were not nearly organised enough or professional enough to be able to guarantee expected growth or reliability. Eighteen months later and the sleep deprivation associated with trying to grow a business on the side with no budget, no time, and no resources finally took it’s toll and saw us walk away a lot wiser.

Functionality In the interest of bringing real


Tutorial 023

“... although we published a notice pre-empting the closure of the site, we’ve decided to re-build it instead, using Kentico.”

world examples to our readers we will endeavour to re-create as much of the funtionality of mumspace.net within Kentico as we can. However, at the same time it is very important that we pay attention to the lessons we learned the last time around and do not introduce so much custom code that we lose the benefits of tapping into an existing platform. Mumspace.net allowed a user to create a virtual site which they were able to personalise, contribute to, and socilaise through. With this in mind then, the basic functionality we will be looking to emulate will include the ability for a user to: • maintain a profile • create one or more blogs • create a virtual site containing one or more pages • upload photos and group them in albums • create groups which other

members can join and contribute to • host forums which other members can join and contribute to Something I believe will prove difficult, but that was central to the success of mumspace.net, will be providing a user with the ability to personalise their profile within the site, in a similar manner to the way in which a Twitter user is able to personalise the look of their Twitter page.

Logistics The project begins the moment this article is published. The series will not be rolled out issue by issue, installment by installment, in the manner expected of a magazine. We will be publishing most of our work online as it happens, with regular updates and open discussions. Each issue of the magazine will summarise our progress and provide insight into

lessons learned. Our progress will be viewed as a series of baby steps which we hope will encourage interaction, rather than a collection of tutorials you simply follow along. Think of this tutorial series as an experiment in open source publishing. You have a very real say in where we go and how we get there. All of the code that we develop over the course of the series will be made freely available on the website via an SVN repository, and any useful pieces which can be separately packaged will be made available via the Kentico marketplace. Watch the site, subscribe to the feeds, sign up for the newsletter. This project is underway.


024 Tips and Tricks

Tips and Tricks by Matthew Lee @seanbun matthew.lee@kenticodeveloper.com

Tips and Tricks We take some time out to give some tried and tested answers to your pressing questions about developing with Kentico. Repeaters

Conditional Display

Several people forwarded questions about Kentico repeaters after viewing the first partner webinar given by Petr, so it made sense for the Tips and Tricks this month to answer at least some of these. A repeater is essentially nothing more than a loop. It loops through a group of items, repeatedly applying a transformation to each. However, if you dig a little deeper, you’ll find that the Repeater is one of the real strengths of Kentico. Given the appropriate queries and transformations for a given document type, a user with little or no programming experience can construct pages on the fly using repeaters, choosing not only what is displayed, but how it is displayed, when it is will be displayed, and to whom it will be displayed. Once you get past the initial question - “What is the big deal about repeaters?” - and begin using them, you very quickly come to the next question - “How can I conditonally change what is displayed?“, and while I won’t try to answer every question that then stems from this, I’ll provide the groundwork which will get you started.

There are several ways to conditionally display content within a transformation, but two that I use regularly are: • the conditional operator • block visibility

The Conditional operator One of my favourite constructs within C# is the conditional operator. It uses the syntax condition?true:false and is by far the easiest way to add conditonal display elements to a transformation. The use of the conditional operator can be demonstrated via a simple test for whether the record being displayed is the first record, but I’ll follow up with a couple of other funky real world examples that I use regularly.

Conditional first record The following transformation displays “First record” for the first record displayed by the repeater, and “Not first record” for each record other than the first. <%# DataItemIndex ==0?”First record”:”Not first record” %>


Tips and Tricks 025

Conditional last record

maintain.

The following transformation displays “Last record” for the first record displayed by the repeater, and “Not last record” for each record other than the last.

<div runat=”server” visible=”<%# DataItemIndex==0?”true”:”false” #>” class=”changedrecord”> <img src=”/images/changedrecord.gif” alt=”Changed record” /> <p>Caption</p> </div>

<%# DataItemIndex==DataRowView.DataView.Count-1?”Last record”:”Not last record” %>

Conditional based upon changing value A requirement you’ll come across fairly regularly in reporting is the ability to show a value if it is different from the row above it. The following transformation displays “Changed” if the value contained within the “name” field is different from the value contained within the “name” field for the previous record, and “Not changed” if it is the same. You’ll notice that the test also looks for the first row. This is because the frist row has no previous row to test against. <%# DataItemIndex==0?”Changed”:DataRowView.DataView[DataItemIndex] [“name”].ToString()!=DataRowView.DataView[DataItemIndex-1][“name”]. ToString()?”Changed”:”Not changed” %>

Although this one looks a little funky, it’s basically just saying: if this is the first record display “Changed”. Otherwise, check whether the value of the “name” field is different to the previous value of the “name” field, and display “Changed” if it is different, or “Not changed” if it is the same.

Block visibility The conditional operator very quickly becomes unwieldy and difficult to work with if you have entire chunks of HTML that you wish to display conditonally. The following example demonstrates this. <%# DataItemIndex ==0?”<div class=\”changedrecord\”><img src=\”/images/ changedrecord.gif\” alt=\”Changed record\” /></div><p>Caption</p>”:”” %>

This can be overcome using a block visibility technique, which basically involves making an entire block of HTML visible based upon a condition operator. The following example does exactly the same as the previous code, but in a way that is much easier to read and

Hope this shines a light on what is a very cool capability, that a lot of people are not yet taking advantage of.


026 Best of the Blogosphere

Best of the Blogosphere

Kentico Geeko

An Irishman Down Under

Appetere

Carl Dean writes about his experience choosing a CMS, and about why he finally chose Kentico. Sometimes the research of others helps confirm our own, and let’s face it, it’s always reassuring to hear that someone given the same opportunities as yourself made the same decision. I’d love to know what the scores reports are based upon, but this is a well written post, and well worth the read. ȖȖKentico Geeko - How and Why We Chose Kentico http://bit.ly/19WgdD

Keith Patton writes about a relatively painless method for implementing extensionless URLs in Kentico under IIS7. For anyone looking for clean SEO friendly URLs with no .aspx on the end, this is your bible. ȖȖAn Irishman Down Under - IIS7 Extensionless Urls and Kentico CMS 4.0 http://bit.ly/XbamQ

In what is well and truly the most technical post I’ve seen come out of anywhere but Kentico itself, Steve Moss deep dives ViewState, highlighting some of the things that can go wrong, and how they can be diagnosed. I can’t recommend this post enough. Although a little technical for most, this has the potential to help you avoid hours diagnosing various recurring ViewState exceptions by tapping into the Steve’s findings. ȖȖAppetere - Working with ViewState http://bit.ly/yoAfC


Best of the Blogosphere 027

r42 - Kentico 4.0 Features Ralph Spandl writes about the new and extended functionality now available within Kentico 4.0. There is not yet much in the way of 3rd party educational material regarding Kentico, and so when you find something, and especially when it is well written, it is well worth the read. When the author puts together an entire series it’s well worth a bookmark. ȖȖPart 1 - Blogs http://bit.ly/mDBas ȖȖPart 2 - Media Libraries http://bit.ly/TezPi ȖȖPart 3 - Image Editor http://bit.ly/128BAI ȖȖPart 4 - Notification Module http://bit.ly/yhm6d

Kentico Internet World Expo Interviews During Internet World Expo in London, Petr ad the chance to speak with a few of the original Kentico solution partners. Take the opportunity to get to know a couple of others in the Kentico world. In some cases they might be your competitors, but in most cases, they are also your best sources for new ideas and support. ȖȖAndy & Adrian from Last Exit http://bit.ly/14LLtT ȖȖFelix Wolf from Yachtbooker http://bit.ly/3fSf6V ȖȖCarl Dean from Silkmoth http://bit.ly/stIxq

Kentico DevNet Surprisingly enough, one of the best sources of material regarding Kentico is Kentico. The guys regularly put together in depth pieces and deep dives which provide not only insight into what is possible, but the thinking behind it. It’s worth your time keeping an eye on the blogs at Kentico DevNet. Some great stuff comes out here. For now though, check out the following 2 posts on Kentico customisation. ȖȖHow to effectively customize Kentico CMS UI http://t.ly/19ytZG ȖȖHow to add custom modules to Kentico CMS http://bit.ly/VLJS5