howto: change xibo layout designer resolution

quite a few people have been asking how to increase the resolution or size of the layout designer in xibo, which has a default size of 800×450 (16:9 resolution. media is scaled to the correct res on your display).

the accepted way of changing the designer resolution is to go to Management > Resolutions from within the xibo web interface and edit the resolution that you want. when i tried this, for some reason, it did not work for me. an alternate way of changing the resolution is to edit the database which i will show you how to do below. i assume in this howto that you already have phpmyadmin installed and working.

one thing to note is that this method will only work for new layouts that you create, all pre-existing layouts will use the old 800×450 editor size. you can manually change the size on each of the old layouts, but if you do, then you’ll have to redo the position and size of your content again. i will not go over that part at this time, but can later if people show enough interest.

log into phpmyadmin with you mysql username/password


click on your xibo database


click on the template table


edit your template (i’ll be using the Full Screen 16:9 template) and change the width/height tags using a proper resolution. the default resolution for this template is 800×450. i changed mine to 1280×720 which provided more than enough room to fully edit my layouts with ease on my 1920×1200 computer monitor.


once saved, all new layouts using this aspect ratio will have a larger layout designer. again, this will not change the size of your existing layouts; only layouts created from this point forward.

if you are unsure of what resolution you need, this handy calculator will help you. 16:9 Aspect Ratio Calc:


results! remember, xibo automatically scales your layout and content to your display as long as the aspect ratio is correct.

Tagged: , ,


  1. Thanks! says:

    I enjoy you because of all of the hard work on this web page. My niece enjoys engaging in research and it’s obvious why. A number of us notice all regarding the compelling ways you give effective suggestions by means of the web blog and strongly encourage participation from some other people on this idea and our own child is without a doubt discovering a lot. Take advantage of the rest of the year. You have been conducting a remarkable job.

  2. Mark says:

    Has anyone else had this issue: after performing this change, I can create a layout with the new resolution, however, if I happen to click on the corner or any of the sides of the layout border (the portions where you get the re-size icon) it will reduce the layout back to the default resolution and there seems to be no way to revert.

  3. Jouse says:

    I have the same problem here. I’ve set the default to 1920X1080 but if i want to reduce to something lower than that, it scales back to 800X600.
    Any help?

  4. Shaun says:

    This fix worked for me. Made editing much mor comfortable. Only problem happened after I applied a background. The designer reverted to a funky resolution.
    So If you dont have a backround to apply, this makes editing less of a chore.
    Thank you for this quick hack. Hopefully the XIBO team will realise editing on such a small designer window is next to impossible.

Add a Comment