How to enable the new "Responsive preview modes" in 3.3


I saw some vids of this years conference. Now I’m keen to try the new Responsive preview modes.
What has to be done to enable them?


Hi Klaus,

if you use the new UI, you can simply define it in the Settings. yaml. You can find an example here:

Best regards,

Would like to use «Responsive preview mode» too.
Have commented out line 11 to 14. Seams to work: Configuration>Settings
with 300 x 600.

In the backend I tried the rawContent (Roh-Ansicht) and all others, but there is no changing in Preview? Do I have to enable it somewhere else or do I have done something wrong?

Something is still fishy here:

First I’ve got it running with the following conf:

          isEditingMode: false
          isPreviewMode: true
          fusionRenderingPath: ''
          title: 'Mobile'
          #position: 200
          width: 360px
          height: 640px

The name rawContent is in use, so I used mobileXs.
Got a new Button “Mobile”. The small view is working.
But strange: I could edit. I did it and published it. Everything else seems to work fine.
So, I added another mode to my conf (portait + landscape):

        isEditingMode: false
        isPreviewMode: true
        fusionRenderingPath: ''
        title: 'xs 360'
        #position: 200
        width: 360px
        height: 640px
       isEditingMode: false
        isPreviewMode: true
        fusionRenderingPath: ''
        title: 'sm 640'
        #position: 200
        width: 640px
        height: 360px

But now everything is spoiled! - Got a blank page in the backend.
I took away the second change, flushed caches, but the backend is still broken.
Even after turning back to the original settings (NeosDemo) the backend is a white page.

I have to reinstall the demo page again.

Page source (only the body, its too big):

        <div id="appContainer" data-csrf-token="20e27dd31aea66e19cab0fe677a03459" data-first-tab="" data-env="Development">

So, be careful!


Thank you @energyWinner,
will wait until there is some more stable version/information how to do.

I can confirm this. After adding the second config, i’ve added one for tablet and one for mobile, my neos installation is broken. First i get a 502, after resetting all additonal configs and cache flush my backend is “white”, too. In the browser console, javascript errors from host.js. “TypeError: Cannot read property ‘isEditingMode’ of undefined”

@energyWinner, don’t know if that helps, but I think the “isEditingMode” below “mobileSm” is missing one space-indention in your yaml.

Did not test anything yet, I watch this post because I am planning to test this feature too.

It’s a problem with the user profile or workspace? After deleting my user and recreate, all is fine again.

No every thing is fine.
If you have an indention error in yaml yo’ll get a neat exeption.

Now your system is working only with change the space?

Have the same problem with white-dead-of-neos altought I reset the settings.yaml, delete the Temporary-Folder, rescan the packages, flush cache, delete and publish resource.
With a different user all works fine, but the particular user seams to be demaged.

On your system the white-death-of-neos is gone only by change the space-idention?

No. There were some typos in my post, which led to a missunderstanding.
What I wanted to say is:

  1. The problem is not the yaml file. With the original settings.yaml the backend is still broken.
  2. Try for yourself: add or delete a SPACE in a yaml file and Neos/Flow thrwos an exeption. So, a miss interpretation due to indention issues of a yaml file is notpossible. The execution stops.

But a question back:
Can you work in the backend with another user?
Bad luck, I’ve only one.


You can create a new user with the flow-command on cli.

Yes, I could continue working with antother user (only editor rule unfortunatelly).
But the system became unstable. repair, or resource publish get’s errors…
Bad luck too, I had to rebuild the system from backup. :triumph:

@energyWinner: Have ask in «slack» for a solution/bugfix.
If your system is still demaged maybe your DB-entries would help to find the reason.
Unfortunately I have played back my system from backup. So no entries to look for. And do it again will broke maybe something important with no-way-back.
In neos-demo I can’t replay the damage.

@christianm asked my for:
can you check neos_neos_domain_model_userpreferences in the DB?
would like to see the entry for the broken user?

Maybe you could look in your db for the users entry? Or maybe @kathleen.peschke?

Ok, that’s really crazy. Can’t reproduce it.

Half an hour testing with different procedures, no crash. Only after remove one of two cofigurations, user with removed setting in DB get a blank/white page. But adding it again, all is fine.

Sry :frowning: