In Europe, the sporting summer is upon us. We’ve said goodbye to football for another season (or at least until the Women’s World Cup kicks off in July!). The Ashes and Wimbledon are underway and we’re looking forward to golf’s most prestigious event, The Open Championship. All these competitions – and those to come later in the year, like the Ryder Cup and the Rugby World Cup – require an increasingly nuanced level of digital delivery, both in terms of the live, on-site event experience and the one experienced by millions of fans, at home, all over the world. The on-the-day execution for these events takes months and months of detailed planning.
As we reach the final stages of our preparations with The R&A for The 151st Open, we’ve reflected on our work together spanning seven years and the learnings we’ve taken from this and other live events we’ve worked on. We’ve condensed these learnings into “The TEC List” – our preparation checklist for the digital delivery of live events.
1. Prioritise scalability
Ensure your infrastructure is robust enough to handle the traffic spikes an event will generate.
Scalability is vital when building a digital platform for sports. Downtime has a huge negative impact on fan experience – you can have the best website in the world, packed with clever features but, if it cannot cope with the surge in visitors around the event, then it’s worthless! This is a particular consideration with sports matches and tournaments where the traffic levels can soar to 100 times the monthly average. For sports event sites, we recommend using scalable, cloud-based solutions that can handle high volumes of simultaneous users without compromising performance.
Make sure you have done your research to understand the potential peaks and make sure you have load tested based on these estimations. Employing this approach when building TheOpen.com website for The R&A, allowed TEC to deliver 100% uptime throughout the tournament each year.
2. Onsite vs remote support – strike a balance
Create a blended support team to maximise response times and minimise costs.
Having a skilled support team onsite during live events is crucial for ensuring that immediate technical assistance is on hand if required. If something significant does occur, the event organiser needs to know that it can be directly addressed without delay. However, routine maintenance and troubleshooting can easily be handled by remote support teams, which require less investment and resources to operate. Remote teams don’t require additional office space, hardware, catering or accommodation and utilise familiar surroundings to deliver support as part of an extended team.
We recommended this approach to The R&A for The Open Championship. For the week of the tournament, we provide a 2 person onsite team, that works alongside The R&A’s digital staff, backed up by a 12-person team operating out of TEC’s offices in Cluj. This is a dedicated remote team, focused solely on the event giving the organisers a comprehensive skilled support resource, capable of addressing a range of digital requirements for a fraction of what it would cost to host the same team onsite.
3. Multiple teams. One Goal.
Clear cross-team communication drives the delivery of successful digital platforms.
The digital experience of any sports event involves numerous technology providers, agencies, sponsors and of course the rights holders themselves. Each one is an important cog in the machine that delivers the digital experience, both at the venue and at home, and clear communication is the oil that keeps it working smoothly. The digital platform team needs to develop an ongoing dialogue with the organiser and the network of stakeholders involved parties to ensure there is alignment on project goals, delays are minimised, and overall efficiency of service is enhanced.
Developments with video calling and remote communications make it easier to maintain these regular lines of communication, but we recommend committing to a number of face-to-face interactions, to help you deep dive collectively into key stages of preparation/development. This can also build a rapport that can help future remote meetings run more smoothly. We have adopted this approach with a number of event clients, including a major sports federation where we ran discovery workshops at their offices and hosted their senior team in Cluj to refine our service offering.
4. One size does not fit all
Customise digital platforms to the needs of different stakeholders to optimize their experience.
From the media and VIPs to fans and the athletes themselves, different stakeholders have different requirements, in terms of the digital platforms they use at sporting events. Never assume that one app or website can be used for all. Take time with the event organiser at the beginning of preparations to analyse the needs of each stakeholder group and how these can best be met digitally.
Working alongside The R&A in the buildup to The 149th Open Championship, it was agreed that global media coverage of the event would be facilitated by a dedicated Virtual Media Centre (VMC). We built a new fully responsive platform for the event which gave journalists who could not attend full access to interviews, highlights, photos, transcripts and scoring statistics while also ensuring that those who walked the course could access a myriad of content to enhance their experience. With speed of access to content a priority – the platform allowed users to set content alerts such as individual players, so journalists could, in turn, feed their audiences. The VMC enabled more than 10,000 images, videos and interview transcripts to be downloaded during The Open Championship, ensuring golf fans got the best possible coverage.
5. Don’t forget the folks at home!
Use digital platforms to bring the action to fans around the world.
You can’t beat the experience of live sports but for most people, it’s just not possible to catch the action in person, and with some sports like golf there’s a ton of action you miss even if you’re there! With interest increasingly global, there is a pressure on the rights holder to ensure they offer streaming capabilities to connect fans to the action remotely.
When implementing streaming technologies, there are two primary considerations that need to be looked at in conjunction. Firstly, rights holders need to ensure the streams operate according to the agreed territorial broadcast rights and a strict set of rules needs to be applied to ensure that the right content is streamed in each territory. Secondly, the streaming service needs to fit seamlessly into the rights holders existing digital experience. It is important here that rights holders consider how rights restrictions will impact the presentation of content in different territories – for example, you don’t want to offer a video player in territories where video can’t be streamed.
Our advice here is to think carefully about the regional presentation of content, setting up different landing pages as necessary to ensure the quality of experience is maintained and proactively monitoring to make sure the experience is up to standard and that rights restrictions are being upheld.
6. Enhance access, enhance the experience
Embrace the opportunities digital ticketing can bring but be alert to the pitfalls.
Digital ticketing and digital identification systems have revolutionised the way fans can access sporting events reducing queue times and ticket fraud and improving data capture in the process.
It’s vital for rights holders to have a clear digital access strategy that incorporates these different elements into a secure solution, but which also is mindful of the potential pitfalls – for example, issues with the ticketing app or with venue wifi / mobile connectivity can negate any benefit the digital platform provides so we recommend a hybrid approach where digital access is supported by the more “analogue” option to print the ticket. Also, communicate with attendees in advance to highlight if there might be connectivity issues.
7. Look to the future
Optimise platform analytics to provide insights that can shape the future fan experience.
The platforms that deliver the digital experience for fans also provide a digital picture of fan behaviour and the process of capturing and analysing fane engagement data is key to understanding their buying triggers and preferences. It is vital that platforms used by the rights holder have comprehensive analytic options that can be leveraged to track interactions and gain valuable insights into fan behaviour and trends.
This information can help the rights holder refine the fan experience – and commercial returns – at future events through lookalike modelling but also enable a more targeted, more personalised level of engagement. We recommend taking the time to evaluate the built-in analytics package provided with the content management systems used – ask yourself: Does it provide the range of data queries needed? What other analytic platforms are being used by the rights holder? Do they need to be integrated? Evaluating the analytic capabilities upfront will ensure the rights holder gets the data they need from the platforms you have built.
Want help planning the digital experience at your sporting event? We’re happy to help.
The data gap in football
Football has a first-party data problem. Clubs of all sizes now boast increasingly global fanbases, but many are failing to keep pace with the digitalization that has accelerated rapidly over the past few years. As a result, the disparity between followers and the fans they hold actionable data on is growing. The pandemic kept fans from going to matches and this highlighted the game’s reliance on ticketing and stadia activity as a source of data. Yes, clubs were able to reach out via social media and other third-party channels, but this left many without the first-party data they needed to communicate directly with their fanbases and offer value to their sponsors.
A microcosm of first-party data’s importance to football can be seen in Spotify’s sponsorship of FC Barcelona. The partnership between the streaming giant and one of the game’s biggest global brands came into effect in the summer of 2022, and was, in part, driven by Spotify’s own quest for first party data. Enticed by a global fanbase of over 350 million across social and digital, they enquired about the number of “registered fans” Barca had – i.e., fans they held first-party data on like full names, contact details and other personal information. However, only 1% – just over 3 million – qualified as registered and it is reported that Spotify’s valuation of the deal was affected as a result (the deal does have a positive first-party story to tell but more on that later…).
In the modern age of digital engagement and global reach, clubs need to adopt a data-driven approach to their fanbases centred around capturing and processing first-party data to deliver the more personalised experience that their fans, and sponsors, crave. In this article, we will draw on our experience working with a mix of rights holders to l look at the technology involved and highlight best practice examples of how they can be used to drive a successful first-party data strategy.
To delve deeper into this topic and explore comprehensive insights, we invite you to download our whitepaper below. It offers a wealth of valuable information that can help you further optimize your digital infrastructure and implement an effective first-party data strategy. Happy reading!
Whatever your digital challenge, we’d be happy to discuss how we can help.
In our last Software Head-to-Head, we used insights from our senior development team to compare Sitecore and Kontent.ai. While the two Content Management Systems (CMS) are established market options, it could be argued that it is not a like-for-like comparison. Fundamental differences bound up in their construction as coupled (Sitecore) and headless (Kontent.ai) solutions are important to understand when making your selection, but if you decide that the greater agility provided by a headless CMS is the best option for your business needs, then what options should you be looking at?
In this Head-to-Head, we compare apples with apples by looking at Kontent.ai and Contentful, two of the leading players in the headless CMS software market, estimated to be worth $1.6 billion by 2027.
Once again, we’ve picked the considerable brains of our internal experts to determine the key differences – and areas of value – that these two headless content platforms offer. We’ve tapped into their hands-on experience working with both solutions for leading sports federations to provide guidance to help you decide which option will best support the digital experience you want to deliver.
What’s in a name?
The first difference comes in how the two software companies describe their offerings. While they both offer the core decoupled benefits of increased agility, flexibility and scalability, their differing self-descriptions highlight a small but significant difference in how they provide them.
Both position themselves as content platforms, but Kontent.ai refer to their solution as modular instead of Contentful, which makes a big play on positioning their content platform as composable.
Kontent.ai’s modular approach is centred around splitting the content into different pre-defined modules or templates(content types) that can be extended/managed without affecting the other modules.
On the other hand, Contentful defines their offering as composable as their platform works by starting with a clean slate and encouraging users to build up their content by combining lots of small components to create the models they need.
We will address the benefits of their different approaches to structuring content a bit further on, but it is worth acknowledging how both as “content platforms” differ from some other headless solutions on the market – this ability to structure your content, as opposed to having it stored in more unstructured buckets, makes it easier to find, manage and reuse across multiple different channels via APIs.
When comparing CMSs, areas such as functionality, customization, performance, and costs are all important to evaluate, but as Kontent.ai and Contentful are both headless solutions, their costs and the benefits they offer compared to traditional, coupled CMS are similar.
The key points of difference between Kontent.ai and Contentful are more subtle but essential nonetheless and stem from Kontent.ai’s more “traditional” heritage. What began in 2015 as Kentico’s first foray into then the emerging trend of headless CMS, Kontent.ai now operates as its own entity. However, it has maintained a focus on the front end and how the content is presented, offering bolt-on elements such as Web Spotlight, a WYSIWYG editor that allows contextual website management, that are more in keeping with the broader service offering provided by the coupled CMS Kentico first created.
This connection to how the content is presented was a key factor in choosing Kontent.ai for the Virtual Media Centre we built for The R&A, one of golf’s governing bodies and organizers of The Open Championship. They wanted the flexibility of a headless solution but also the ability to simply define how the content is presented, making Kontent.ai the obvious choice.
Contentful, on the other hand, is a native headless solution with no ties to a coupled past. It was designed to offer a composable CMS, focused on content storage rather than presentation, wholly reliant on APIs with a wide range of software solutions to supplement their service offering.
Content modelling – the art of defining the relationship between different types of content and how they are delivered and presented across your different digital platforms – is perhaps the biggest difference between the two CMS.
Kontent.ai offers a top-down content modelling approach that focuses on starting with defining the high-level structure of content types (templates) and then building your components and sub-components. This approach is more structured and quicker to operate in the short term but has a more significant margin for error and can create complications between the content model and presentation as the content tends to be very specific to each client, thus losing some of its reusability.
This approach works best for content-driven solutions with a small number of end-user applications (i.e. only a web app and a mobile app) consuming the content because the content modelling is faster and easy to follow by breaking the specification into simpler and simpler pieces.
Contentful, on the other hand, works bottom-up providing you with a wide range of low-level components you can use to construct content models to your exact requirements. The approach is ideally suited for mobile projects offering greater levels of flexibility and customisation, making it easier to extend and add new components to the model and, therefore, more suitable for constructing complex mobile-first models. It was this capability that led TEC to use Contentful when building a digital concierge application for a leading sports federation. The app provided VIP guests at their signature event with ticket, travel and accommodation details, pulling content from multiple sources into one convenient platform.
Digital Asset Management
Whether they are images, videos or audio files, your digital assets are integral pieces of content that need to be stored, edited and repurposed for usage across different platforms, so how you do this is a vital part of how you manage your content.
Kontent.ai offers a built-in digital asset management tool making it easy for you to access and manipulate the assets you need.
Contentful, on the other hand, doesn’t. Instead, it offers APIs to a wide range of 3rd party tools. However, rather than being a negative, this can offer significant benefits if the client is already using digital asset management tools for other purposes; by integrating them with Contentful, you can avoid duplicating assets across the tools saving time and money. It is, therefore, crucial to assess the full digital ecosystem of an organisation before selecting which content is best suited.
Localization is an increasingly important consideration as organisations look to personalise their content offering for different international markets.
Technically Kontent.ai offers a broader range of language options – more than 200 compared with 50 provided by Contentful. However, only five of these language options are offered “out the box” with Kontent.ai, with a fee to add each additional language, compared to Contentful, which offers the full 50 as part of the package.
Support & Training
Both offer comprehensive support and training services; however, Kontent.ai edges ahead in terms of support by offering a phone support service which Contentful does not. At the same time, Contentful’s training package is more comprehensive as it includes video training materials, while Kontent.ai does not.
These are small differences, but it is essential to understand client preferences in the context of both, as the inability to pick up the phone or refer to a training video may swing your selection decision one way or the other.
Cost & Packages
Their comparable pricing and package offerings mean mid-large-sized businesses widely use both. Kontent.ai is used by globally renowned organisations like Zurich Insurance, Algolia, and Oxford University, while Contentful claims to power digital experiences for 31% of the Fortune 500 and thousands of leading global brands.
Both provide a free entry-level service, with Contentful offering theirs for up to five users compared with Kontent.ai’s two. Contentful also offers a standard “Basic” package costing $300 per month, whereas the Basic equivalent for Kontent.ai is called “Scale”, but as with all of Kontent.ai’s pricing, it is bespoke based on the number of content items and if there is a need to add any add-ons (i.e. Web Spotlight).
Overall, Contentful’s pricing models and their more comprehensive free offering make it a better option for smaller businesses.
In many ways, you can’t go wrong with either of these headless content platforms. They both offer the recognized benefits of increased agility, flexibility, and scalability compared to the coupled, monolithic solutions provided by the likes of Sitecore and WordPress.
Kontent.ai’s links to its more traditional roots create a focus on content presentation, making it a great option for businesses that want the benefits of a headless solution but also the safety net of having an additional proprietary presentation, digital asset management, and analytics tools bolted on.
Contentful is a child of the headless age and delivers greater flexibility through a wider range of API integrations that will be appealing to digitally native businesses in need of complex content models, particularly for mobile applications.
Differences in support and training offerings are marginal but essential to consider depending on client preferences. Kontent.ai provides greater scope for localization, but Contentful is a more cost-effective way of doing so, and its pricing models make it a more viable option for smaller businesses.
Kontent.ai Contentful Traditional roots Native headless Modular focus on content presentation Composable focus on content storage Top-down content modeling is more structured and quicker to use in the short term Bottom-up content modeling offers greater flexibility and allows for complex customization Best suited to websites Best suited to mobile applications Built-in Digital Asset management tool No built-in Digital asset management tool but APIs to a wide selection of 3rd party options More localization options but only five are free Fewer localization options but more included “out the box” Includes phone support but not training videos Includes training videos but no phone support Two users in the free package – custom pricing Five users in free package – basic package available making it more suited to small businesses
TEC has skilled and experienced engineers who can work with you to supplement your development team, providing essential resources at attractive nearshore rates, whichever CMS you decide is best suited to your client’s needs.
Whatever your digital challenge, we’d be happy to discuss how we can help.
Looking to stay ahead of the digital transformation curve in the DACH region, agencies are increasingly turning to nearshore partnerships to access the IT resources they need. At TEC, we have been providing nearshore engineering services out of Cluj-Napoca, Romania, for nearly a decade. Our team has worked with a wide range of European agencies and we have learned a lot about the ins and outs of nearshore collaborations.
We are excited to share our insights with agencies in Germany, Austria, and Switzerland, and help them understand how to best leverage nearshore partnerships to meet their client’s needs while staying on time and on budget. To that end, we have put together a comprehensive whitepaper that covers everything you need to know about nearshore collaborations.
Download our whitepaper now and learn how to successfully collaborate with nearshore partners to achieve your business goals.
With a shortage of specialist IT resources impacting digital transformation across the Nordics, more and more agencies are looking to outsource to plug the gap. At TEC, we offer a comprehensive and collaborative nearshore engineering service based out of Cluj-Napoca, the technology capital of Romania. Tapping into almost a decade of working with a range of agencies across Europe, we wanted to share some of our learnings on nearshore collaborations and how agencies in the Nordics and their partners can best collaborate to meet clients’ needs, on time and on budget… and make a profit!
Which way to go?
When analyzing the right Content Management System (CMS) for a client brief, two industry heavyweights that often enter the conversation are Sitecore and Kontent.ai platforms. The two platforms underpin almost 30,000 websites globally, and both offer the advanced content management systems needed to power the online platforms and marketing initiatives that medium-to-large-sized businesses need.
There are some key differences – most notably Sitecore as the more traditional, coupled solution versus Kontent.ai, a cloud-based headless CMS started by Kentico – but the similarity in capabilities is such that agencies need to carefully evaluate both the needs of the clients and their end users. They must analyse the benefits and limitations of both, in order to make the best recommendation.
To help with that evaluation, we spoke to our senior development team to get their take on how the two software platforms compare. We picked their brains, delving into their extensive experience across both platforms from working with the likes of Royal Canin, Safestore and The R&A, looking at a range of criteria. This is what they came up with…
Functionality is perhaps the biggest point of difference between the two CMS solutions.
Think of them as two Porsche 911s (other sports cars are available!). Sitecore is the latest model, fully laden with tech and functionality to aid the driver’s experience, but only part of this is focused on making the car go faster. Kontent.ai is the same model of car but stripped of all but the essential functionality – anything that might weigh it down – so it is optimized for the primary purpose of being fast.
Being coupled to the front end, Sitecore’s CMS solution offers loads of built-in digital marketing and analytics to help the client’s marketing efforts, whereas Kontent.ai is designed to focus on the primary task of providing a platform to create, store and distribute content. It can integrate with other tools to provide the same level of analytics and digital marketing support, but it is worth bearing in mind that the client needs to have these other tools in place – or be willing to invest in them.
Sitecore provides a whole digital ecosystem, and if this is what a client needs, if it doesn’t have solutions for things like marketing automation and analytics in place, then it can be a perfect solution, but it can also offer more than a client needs. It can be like paying for the whole toolbox when all you need is a screwdriver, so understanding the client’s objectives and resources is a key component in choosing between the two.
Cost & scalability
Understandably, with added functionality comes additional cost. It is no secret that Sitecore is a more expensive tool, but for many businesses (almost twice as many globally use Sitecore compared with Kontent.ai), the additional cost is worth it because of what it provides. That said, if the added functionality is not needed by the client, then switching to Kontent.ai can offer real cost savings – something all clients like! We helped The R&A do just this when working on their new website – Sitecore was the incumbent CMS, but they were only using a fraction of the platform’s functionality, so by recommending they switch to the more streamlined option in Kontent.ai we helped them achieve significant cost reductions.
Another facet of Kontent.ai that led us to recommend it to The R&A for randa.org, and which also helps with cost savings, is their consumption-based payment model, based on the number of calls made rather than a set license fee. The model Kontent.ai offers means that The R&A’s infrastructure fee fluctuates based on traffic, keeping the overall cost down. This model is ideal for elastic scaling where a website encounters significant seasonal variations in traffic levels; in the case of The R&A, randa.org obviously receives huge spikes in visitor numbers around the time of golf tournaments like The AIG Women’s Open and The Open Championship, with traffic tailing off afterwards.
It is worth noting that the consumption model can work the other way too. Suppose a client expects a steadily growing, high level of traffic. In that case, Sitecore can be a better option, with additional investment over and above the license fee only required if the traffic levels get to a point where the hosting infrastructure needs to be upgraded.
Also, if the client plans to roll out different versions of a website – for example, in other languages – then Sitecore can be better suited as they would all be covered by the one license. Kontent.ai does offer a limited number of language offerings out of the box, which does, in fairness, cover the key global languages – but if you are working with a business that is looking to scale up in the Nordics or the Middle East, then with Kontent.ai you would be paying for each additional site.
In terms of speed – like with the Porsche analogy – both are quick, but with its streamlined service offering, our team have found Kontent.ai to be a little quicker. With all the added functionality and its connection to the front end, users will usually tolerate the reduction in speed – which is not significant – that Sitecore provides, but for those who need their Sitecore platform to be that little bit faster, the clever people in our DevOps team have found a way to fine-tune the system and make it turbo-charged!
Working in conjunction with Akamai as the Content Delivery Network, we were able to achieve increases in performance for TheOpen.com by optimizing content size and format, and the website’s code and architecture, to reduce load times. We also enabled caching for frequently accessed pages to improve response time and increased the size of the Sitecore databases and indexes to improve query performance and reduce the load on the server.
From a developer’s perspective, the user experience with Kontent.ai is much easier because of the freedom and flexibility it offers; being decoupled from the front end, you are not restricted by the technology you can use, meaning you can build in precisely the way you want, using the tools, libraries and frameworks that you want rather than having your toolkit forced upon you.
The coupled v decoupled aspect also impacts the cost implications of customizing the front end of each solution. With Kontent.ai, if the client wants to change or update their website, then you just need to change the front end, and the CMS stays the same. With Sitecore, however, they would need to change the back end and the content structure as well, which would involve more resources and investment.
Support & Security
Both providers offer pretty comprehensive support packages. However, being the more mature of the two, Sitecore has a great depth of community-driven support materials available, which can prove to be very useful, especially when trying to configure its many different out-the-box functionalities.
It is a similar story in terms of security. Both offer a level of security that is sufficient for most businesses, with Sitecore offering the potential to go that bit further if needed: as in most cases when using Sitecore, you need to manage the hosting infrastructure yourselves, which means you have opportunity to enhance the security levels yourself whereas with Kontent.ai you are reliant on the provider for managing this element.
To couple or not to couple…
Many of the differences identified here stem from whether or not the CMS solution should be headless. Interestingly, Sitecore actually tries to position itself as a true headless solution while questioning the benefits of headless solutions in the conventional sense. It has been adapting elements of its offering to bring elements of its service in line with headless solutions like Kontent.ai.
The rise of headless solutions was built on a combination of improved choice and improved connectivity and is symptomatic of a wider shift in societal behaviour. Where once we had to turn to one of a limited number of providers to cover a multitude of products or services, the growth of online technologies has increased the opportunity for competition, driving down costs.
For example, let’s think about the travel industry; once upon a time, you had to go to a travel agent to source to book the different elements of your holiday. Whereas now we think nothing of sourcing accommodation, travel and activities from different providers who each offer the service we want, connecting the different elements to deliver the holiday we want for less. So too, with technology. Today we see customers expecting to consume content across a variety of devices and formats, and this has enabled businesses to focus on building tools that serve specific functions really well, knowing that these functions can be connected as needed, through APIs, to provide the service the client wants for less. Sitecore is acknowledging this trend opening its solution to a wider market by splitting some of the elements of its service offering.
With its coupled solution and array of functionality, Sitecore makes an excellent choice for larger enterprise clients looking to upgrade their digital platforms and the marketing benefits they offer to their businesses.
With the greater flexibility Kontent.ai offers with development and pricing, by way of being a headless CMS, it can be a better choice for mid-large businesses, particularly if they experience seasonal traffic spikes or have specific tools in their digital ecosystem that cover other essential marketing and analytical tasks.
Sitecore Kontent.ai More mature Newer to market / less established More functionality – including digital marketing & analytical tools Less functionality – focuses on content management and can easily integrate with third-party marketing and analytical tools Provides a whole digital ecosystem Provides a component of the digital ecosystem More expensive Less expensive, consumption based Slightly slower (although TEC can fix that!) Slightly faster More complex to customize/integrate with other software More flexibility/freedom to work with other software Great for steady traffic growth Great for traffic spikes In-house infrastructure-managed – giving more control but meaning more resources are needed. Infrastructure managed by Kentico – less control but fewer resources needed Site changes/upgrades need to involve both frontend and backend work Site changes/upgrades only need frontend work Slightly better support and security Good support and security
TEC has skilled and experienced engineers who can work with you to supplement your development team, providing essential resources at attractive nearshore rates, whichever CMS you decide is best suited to your client’s needs.
Whatever your digital challenge, we’d be happy to discuss how we can help.
Having a customizable site is always a key requirement for our clients. We have always enjoyed working with content management systems. This approach is helping us to create complex and interesting customizable components instead of spending precious development time with small and very frequent content changes.
Working with a CMS is highly efficient and easier to maintain for dynamic websites for events and the ever-changing sports industry.
At the start of every project, we evaluate which CMS is better suited for our clients. For some projects, Sitecore was preferred for complex and interesting features, for others we decided that we should choose Kentico Kontent, a headless CMS perfectly suited for lightweight websites that are mostly based on the React Js code with a small necessity of .Net APIs.
We started a series of projects with Kentico Kontent recently. The good collaboration and smooth integration with React JS and .Net resulted in fun and interesting work for our engineering team.
We created simple clean websites that load fast and have the advantage of customizable content edited in Kentico Kontent. This includes every label, every description text, image, and even the elements that are displayed on each page and the pages themselves.
This website also takes advantage of custom forms that can be added in a popup or new page with customizable actions on submit and different types of fields.
Kentico Kontent offered us the opportunity to get certifications and provided detailed and well-written documentation as part of our collaboration. We now have several colleagues certified as Kentico Kontent developers.
It is a good feeling to find the appropriate technology and CMS that covers the projects you work on and Kentico Kontent for us was a very good choice. Therefore, we continue developing with Kentico Kontent new projects and interesting features for our clients.
Custom Form in Kentico Kontent with React
One of our key challenges was to create a customizable form that can be created from Kentico Kontent dynamically and added anywhere in our React Website. We started with a few field types suited for the minimum necessity of the project at the first release and we needed to leave the option to add as many complex and interesting field types, as necessary. We needed this form to be edited, transformed, and do a vast set of submitting actions without having to deploy our code or have advance technical knowledge.
This is how we decided to model our content:
How are we going to open a custom form?
We decided to open the custom form in a popup using a button inserted dynamically on the website.
The button has a separate content type containing a button Label and the linked item Custom form to open, which is mandatory and must be exactly one item. This is the form we are opening when clicking the button.
In React we associated this with a component we have, a button, that is opening the linked Custom form in a modal.
Modeling the custom form
The final form should be able to look like this one:
Section 1 name
Section 1 Description
Field validation 2
Section 2 name
Section 2 Description
Field validation 3
As you can see the form has multiple sections, with or without title and description, also it has multiple configurable fields dynamically added in sections.
The custom form is a dynamic component having the following Kentico Kontent setup:
Custom Form Content-Type:
Title – required text
Description – rich-text
Sections – linked items to Form Section Content-Type with at least one item
Callback action – linked item to the exactly one Callback Action Content-Type
Submit button text – text required limited to 100 characters
Success message – text
Should send confirmation email – multiple-choice check box with one value stating a Boolean option to send a confirmation email to an email field if it is present in the form
Email template – text containing the id of the email template for confirmation emails (if necessary)
Form Section Content-Type
Title – text
Style – required used to color the section in different colors
Form fields – linked items of one or many Field Content Types
Kentico Kontent allows you to select any from a list of predefined content types and this is how we render different fields that have complex functionality.
To not repeat a few common settings for each field we use a Content-Type Snippet. This brings together some settings such as Title, Description, and validation expression in regex, the setup being used for all custom fields.
To submit the form we use Callback actions. This submits the entire validated submission object, containing all fields with their values to a specific API. We gave the option to set up the callback URL from Kentico Kontent. The callback we are using sends an email to a specific address with the form details but you can set up the API to save data or process it however it is needed. Multiple options can be created for different APIs and the content creator can choose the one appropriate.
This is an overview of how to implement the content modeling for custom forms in Kentico Kontent.
The solution has a React Js solution linked for processing, interpreting, and designing the custom form feature. Another .Net solution is providing the API for processing the submission data.
I hope you got inspired by our custom form implementation and if you have any more questions we are happy to respond to them.
Anca MATEI Software Engineer