Vincent Baaij
May 18, 2018
  1415
(3 votes)

Editing on a touch screen device

Working with a touch screen device, like a Surface Pro, Book or Laptop, might lead to some unexpected behaviour in the editor. In my case, I didn't receive any feedback on hovering the cursor over the editable parts of a page or block. So, no green (or grey on a content area) highlight and no information label with the field name. It didn't matter what browser I tried it in. Edge, Firefox and Chrome all gave me the same feedback-less experience.

It took some digging around to find out what caused this. I consulted developer support, but for them it was working as expected. I uninstalled all browser extensions/add-ons, but still no success. Then I moved to the browser specific settings. Turns out all the browsers have W3C Touch API support that you can change. After disabling this support all browsers started to show the expected highlight and label!

If you happen to have the same problem on a touch screen device, here's how you can change the mentioned setting:

Edge

Navigate to 'about:flags'. In the screen that appears scroll down to Standards Preview. For 'Enable touch events' select 'Always off' in the dropdwn list.

Image EdgeTouch.PNG

Firefox

Navigate to 'about:config'. In the screen that appears serch for 'touch_events'. Double click and set the value to '0'

Image FirefoxTouch.PNG

Chrome

Navigate to 'chrome://flags'. In the screen that appears look for 'Touch Events API'. Set value to 'Disabled'

Image ChromeTouch.png

Hope this helps,

Vincent

May 18, 2018

Comments

Erik Henningson
Erik Henningson May 19, 2018 07:38 AM

This is what I do:

Check "Limit touch support" on my users´s settings

Vincent Baaij
Vincent Baaij May 22, 2018 09:42 AM

Good catch Erik! Thanks.

That is indeed a lot easier to set and you don't mess with other sites that might depend on the original API support. 

Please login to comment.
Latest blogs
Fixing Optimizely Content Syncing/Caching Issues on the DXP pre CMS.Core 12.13.0

Hi all, With our recent deployments to the DXP for .NET 6 projects (one a new build and one an upgrade) our clients had raised issues where there...

Scott Reed | Mar 23, 2023

Handle hostnames, schedule jobs and role access when synchronizing content

The Environment Synchronizer module helps you to set your environment into a known state after synchronizing databases between environments. In thi...

Ove Lartelius | Mar 23, 2023 | Syndicated blog

4 tips and tricks for Hangfire on Optimizely CMS

Here are four useful tricks I always apply to any site where I use Hangfire (code included).

Stefan Holm Olsen | Mar 21, 2023 | Syndicated blog

The new LinkItem property in Optimizely CMS, and why it matters

In the past, we have used different tricks to achieve this. Now, the LinkItem property is finally built-in in Optimizely CMS 12!

Tomas Hensrud Gulla | Mar 20, 2023 | Syndicated blog

A day in the life of an Optimizely Developer - Vertical Slicing in CMS12

There is such a vast choice these days in how you can build a website, aside from all of the different programming languages out there, there are...

Graham Carr | Mar 20, 2023

Tag Helpers in CMS 12

Microsoft introduced the TagHelper back in the primordial soup of ASP.NET vNext which became .Net 5, then .NET Core then .Net 5 you know the drill…...

MartinOttosen | Mar 20, 2023