Portal CMS

Inline Editing in Portal CMS

I recently releasd a huge change to the Portal CMS technology I have been working on. The ability to change content just like you do offline in Microsoft Office. No need to save changed, nor wait for changes to be made.

Author Avatar

Author: Tom McClean

Updated: 26 Jul 2016 21:12

Always looking for a way to make my websites easier to use, today I set out to give Portal CMS the easiest editing of all the content management systems around. To do this I have used the TinyMCE Inline Editing plugin and built it into my Blog Builder and Page Builder.


If you ask most non technical users what they would want when editing a web page, the closest they tend to get to the web paradigm is their use of Microsoft Office. Microsoft Office is quick and easy to use and allows the user to simply type what they want in a way that is easily understood - because they have used these programs for years.

It is hard to recreate the functionality you can get from product like Microsoft Office on a website because the web is stateless. But there are a few really good plugins around online like CKEditor and TinyMCE that give you inline editing which is at least familiar to the user from a user interface perspective. Using these plugins you just click or tap on words and the page immediately but subtly transforms into a word processor.

The difficulty in implementing this functionality is saving the changes made in a efficient and reliable way. When you press refresh on a web page, anything that has not been sent to the server for saving will be lost, and you don't want to make the user wait all the time because you need to save the content to the server because they will get frustrated and leave.

The implementation I have gone with is to allow users not to edit the entire page as you would with a word document, but to edit individual elements, this makes saving a lot less tricky because it doesn't need to save the whole page everytime, it just needs to save the one element you changed.

It also works out positive in another way, because the users can only edit one element at a time - the website can continue to lay out components in a testable way (with regard to the way it reacts in the interface), the user can pick a templated section and easily change its content with the website responding to that change in real time, and saving the changes when desired.


I am pretty happy with the way this functionality worked out so I decided to record a short video showing how the new page editing tools work on Portal CMS. Take a look at it below!



You need to Login or Register to comment.


New Project: XContext

Find out how I decided to cut down my SQL Azure costs on Microsoft Azure.


Introducing LogBook

I recently wanted to add some basic logging into an MVC Web Project, but all of the big offerings like Elmah and Log4Net are too bloated, so I decided to write a minimalistic logging tool of my own.

Tips and Tricks

Implementing Effort into a C# MVC Website to allow Unit Testing

I recently wanted to have the ability to write Unit Tests for a personal project, I picked Effort.EF6 to help. This post goes through the setup for "Effort" and why you should choose it.

Portal CMS

Portal CMS Demo Website Now Available

I wanted to make it as easy as possible to try out Portal CMS. So I have setup a demo website you can login to and try it out!

Portal CMS

User Experience Improvements to the Portal CMS Page Builder

We recently made some changes to the Page Builder in Portal CMS to make it easier and quicker to use. Learn more about what has changed inside this post.


Summer Holiday in Thassos, Greece

I just returned from a holiday in Thassos in Greece, so I wanted to post up some photo's to show what I got up too!


What is SendGrid?

As somebody who develops quite a lot of websites, I find that most of the time I tend to use a lot of the same technologies and services. A lesser known service which I have come to love is called SendGrid, heres why I love it.

Tips and Tricks

How to setup a Web App on Microsoft Azure

A how to guide to creating a Web App on Microsoft Azure, deploying it using Continuous Deployment and hooking it up to a database.

Portal CMS

Portal CMS - Promotional Website

I decided to make a standalone website for Portal CMS; the technology I wrote to sit behind this website and many others. Why not take a look and see what its about?


Website Relaunch

Welcome to my personal website. I am just in the process of relaunching it under my new technology called Portal CMS.

Tips and Tricks

Cost Effective Email Hosting for Custom Domains (Migrated)

This article takes a look at options for setting up multiple email accounts for multiple custom domains.

Portal CMS

Portal CMS - Page Builder Demo

Portal CMS is my latest technology, this article shows a video demonstration of the new technology in action.


Windows 10 - Initial Reaction (Migrated)

This article covers my initial reaction to Windows 10 after using it on my main computer for a few days.


Windows 10 - Coming soon (Migrated)

A brief look at the upcoming Windows 10 release and a look at the new features in the update.