“We need to start thinking about OMNICHANNEL for our content.”
“Kentico Cloud is all about OMNICHANNEL! So, how do we use it?”
“I’ve been watching for hours but there’s nothing but reruns and infomercials on every OMNICHANNEL!”
The phrase “Omnichannel” is certainly making the rounds when it comes to content. Hatched from the minds of over-worked marketers tired of creating posts for everywhere they need to. In a quest to reduce their stress (and chances for carpal tunnel), people have gotten smarter about how and when they produce content, planning for multiple channels from the start.
Makes perfect sense, right? Everyone wants their job to be a little easier and more effective.
But what does it all mean to developers?
How the Internet Defines Omnichannel
“Omnichannel is a cross-channel business model that companies use to improve their customer experience.” – Wikipedia (so you know it’s true!)
OK, that is a pretty good explanation for this new way to create and manage content. It’s aimed at producing information across a variety of channels, allowing users to consume in the medium that suits them best. It defines how this “methodology” allows businesses to be more effective in producing and managing their content, as well as how they communicate with their customers. Everyone gets information in the way they want it, so everyone wins!
So… just go build a system to do that and everything will be great!
The “Real” Definition
Omnichannel is better defined as planning content delivery for multiple devices and systems. It’s about interoperability. Because every channel is different, they require specific platforms and processes to work properly. Content destined for the web is MUCH different than what you’re going to send to Alexa. Understanding the various formats is key for developing an omnichannel solution.
So, how does a developer do that?
To show you how to plan for Omnichannel, you have to start with some content. Let’s take the example of an online store. Businesses are constantly getting new products to sell, all of which need to be promoted to the masses so they can be picked up and given away on the next Oprah’s Favorite Things episode.
Once a new product is ready for sale, the Marketing team will want to make sure people know it. This means they’ll create a landing page, email campaigns, tweets, and a host of other communications to reach as many customers as possible. All these communications are going to need to be stored somewhere, and delivered to various destinations in the correct format.
For developers, this is where you start thinking of where you’re storing the content, and how you’re going to retrieve and display it. Kentico Cloud takes care of a lot of this for you, by giving you a central, cloud-based solution for storage. The technology-agnostic API is perfect for retrieving. This means you only need to worry about your content structure and how you’re displaying it.
Let’s break them down into a few common channels.
NOTE
In this article, I’m going to show various techniques for displaying content. If you follow my blogs, you will recognize these topics from previous posts. The idea behind this post is to show how to combine those ideas into a single, omnichannel solution.
Web
The web is probably the easiest and most familiar channel you’ll develop for. Whether you work in JavaScript, PHP, or .NET, creating sites is a straightforward process for delivering your content. Using Kentico Cloud, you can pull in the SDK flavor of your choice and quickly display content.
Storage
For storing web content, you can choose plain text or rich text, depending on your needs. Because web browsers can handle all sorts of content types, rich text with decorations and formatting can be used. In Kentico Cloud, you can use a Rich Text element to store all your product info in the formatted text.
Display
Kentico Cloud has the IRichTextContent interface, which parses the content into “blocks”. You can use these blocks to display your HTML content and retain all the formatting.
In my Product Display Template, I write the raw content, joining the blocks as I go.
<
div
class
=
"col-sm-8"
>
<
strong
>Description</
strong
>
<
br
/>
@Html.Raw(string.Join("\n", Model.ProductDescriptionRichText?.Blocks ?? (Model.ProductDescriptionRichText?.Blocks ?? Enumerable.Empty<
IRichTextBlock
>())))
</
div
>
The result is my rich text using the correlating HTML tags.
You can find out more about creating ASP.NET Core MVC sites with Kentico Cloud in my blog here.
Mobile
If you’re running a site, chances are good that you have a mobile app to go along with it. One of the biggest challenges is displaying web content on mobile devices. Because HTML is really a web technology, content needs to be in a more basic format to display properly on the device.
Storage
In Kentico Cloud, you can use the Text element to display your “simple” mobile content. This content will be more basic and only display the text without formatting.
Display
For displaying the content, you can use a generic label and text box controls to show on the device. In my demo, I’m using the following code to display the content in a Xamarin application.
<
Image
Grid.Row
=
"0"
Source
=
"{Binding ImageUrl}"
HeightRequest
=
"250"
HorizontalOptions
=
"FillAndExpand"
VerticalOptions
=
"Start"
BackgroundColor
=
"{StaticResource colorSecondaryAppBackground}"
/>
<
StackLayout
Grid.Row
=
"0"
Grid.Column
=
"1"
VerticalOptions
=
"Start"
HorizontalOptions
=
"FillAndExpand"
BackgroundColor
=
"{StaticResource colorSecondaryAppBackground}"
Padding
=
"20"
>
<
Label
Text
=
"{Binding ProductName}"
TextColor
=
"{StaticResource colorSecondaryText}"
FontSize
=
"Medium"
FontAttributes
=
"Bold"
/>
<
Label
Text
=
"{Binding ProductDescriptionPlainText}"
TextColor
=
"{StaticResource colorSecondaryText}"
FontSize
=
"Small"
/>
</
StackLayout
>
You can find out more about building Xamarin apps with Kentico Cloud in my blog here.
When it comes to social media, all content rules get thrown out the window. With character limits, proprietary formats, and social faux pas, developers really need to think about how the content gets posted to Twitter, Instagram, and other channels. This means storing content in specific elements and ensuring only valid data is entered.
Storage
For Twitter, it’s all about character limits. In Kentico Cloud, you can leverage the Character Limit properties on a Text element to ensure your editors enter valid content.
Display
There a million ways to post to Twitter. In my demo, I opted for the Azure Logic App + webhook approach. First, I created my Azure Function to retrieve the social description.
// Get request body
var codename = req.Content.ReadAsStringAsync().Result;
DeliveryClient client = new DeliveryClient("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX");
// Get the details from Kentico Cloud
DeliveryItemResponse response = await client.GetItemAsync(codename);
if(response != null)
{
var item = response.Item;
strTweet = item.GetString("product_description___social_text");
log.Info(strTweet);
}
return strTweet == ""
? req.CreateResponse(HttpStatusCode.BadRequest, "No body posted")
: req.CreateResponse(HttpStatusCode.OK, strTweet);
Next, I created an Azure Logic App to handle the webhook notification. The App validates the action, then calls my Azure Function to retrieve the social description. With that, the App uses a built-in action to post directly to Twitter.
Lastly, I created a new webhook in my Kentico Cloud project, pointing to my Logic App.
When the content is updated in Kentico Cloud, it notifies the Logic App, which kicks off the posting action.
You can find more about using Azure Logic Apps with Kentico Cloud in my blog here.
Wrapping Up
Planning for every place content will be displayed is a tough job. Luckily, when it comes to omnichannel, Kentico Cloud has your covered! With multiple ways to store and deliver information, you can easily configure your projects for any medium. By leveraging character limits and required fields, you can ensure the data your editors enter will be displayed properly. I hope this article showed you how to combine multiple development techniques into a complete omnichannel solution. Good luck!
We're always curious to see how you got on with the ideas put forward in these blog posts, so share your feedback in the comments section below.