Global switch to turn off frame borders, shadows, and titles / Frames without shadow


Hi,

I’m using Miro to make a UX wireframe flow.  This diagram has no fixed format. Now if I want to make a presentation, I need to add frames around parts of my flow. But I can’t do this because of the drop shadows that are added to the frames.

Please give an option to hide or change the borders of a frame.

Then Miro could be used like a Prezi presentation.

Regards,
Steven

I tweaked @UselesssCat‘s excellent suggestion to make the bookmarklet act as a toggle:

javascript: (async ()=>{let miroFrames = await miro.board.widgets.get({type:"FRAME"});visible=miroFrames[0].clientVisible;miroFrames.forEach(async e => {await miro.board.widgets.update({id: e.id, clientVisible: !visible})});})()

 


If the solution can be implemented with a bookmarklet, it really can’t be that hard to integrate this option in the product, no?


I tested it but the board doesnt save these changes. Anyway you can do that every time you make a presentation :/

I think that an extension can be made to add buttons to hide/show borders, but i think the the work is not worth it since you can make a bookmarklet.

 

Create a bookmark and in the URL put the code:

javascript: (async ()=>{let miroFrames = await miro.board.widgets.get({type:"FRAME"});miroFrames.forEach(async e => {await miro.board.widgets.update({id: e.id, clientVisible: false})});})()

So you can name it “miro hide frames”
 

 

This is epic, thank you so much!! 

Building on top of this, if you change the last word ‘false’ to ‘true’, you can create a bookmarklet in the same way to show the frames again. 

P.S. I’m now trying to trigger this bookmarklet via my El Gato Streamdeck. I’m not sure it will work, have failed so far but have asked someone on Fiverr to try to figure it out. If anyone has tips for that, let me know :) 


I tweaked @UselesssCat‘s excellent suggestion to make the bookmarklet act as a toggle:

javascript: (async ()=>{let miroFrames = await miro.board.widgets.get({type:"FRAME"});visible=miroFrames[0].clientVisible;miroFrames.forEach(async e => {await miro.board.widgets.update({id: e.id, clientVisible: !visible})});})()

 

oh even easier to toggle, thx! 


@UselesssCat thanks for workaround however neither the code pasted in the console or the bookmarklet work. 

Any suggestions?


Great thread - agree this is a much-needed feature. @Miro Support Team any movement on making this happen?


Me, too. 

 


It would be really nice if Miro would allow users to toggle on/off frame borders, shadows, and titles all at the same time. Neither of these solutions will work for me, because:

  1. While the white shape hides the frame shadow, it does not hide the frame outline or frame name. When I create a presentation that includes many frames that zoom in within a larger frame, the messy outlines of all these frames are still visible.
  2. I much prefer using the standalone app to the browser version and don’t believe I can execute the Javascript code from within the app.

 

C,mon Miro, this is such an easy feautre to add.


I tested it but the board doesnt save these changes. Anyway you can do that every time you make a presentation :/

I think that an extension can be made to add buttons to hide/show borders, but i think the the work is not worth it since you can make a bookmarklet.

 

Create a bookmark and in the URL put the code:

javascript: (async ()=>{let miroFrames = await miro.board.widgets.get({type:"FRAME"});miroFrames.forEach(async e => {await miro.board.widgets.update({id: e.id, clientVisible: false})});})()

So you can name it “miro hide frames”
 

 

I actually don’t think this script works anymore.  I bet Miro changed some of their syntax surrounding their APis.  Just a guess.  It would be nice if this worked for me cause the borders are driving me crazy in my presentation flow.


Hello again

Miro released its “v2 web sdk” in which “clientVisible” is not available anymore, so its not possible to hide borders as I know. See https://developers.miro.com/docs/web-sdk-reference-guide#widget--item-properties

In this guide they show how to fix the snippet https://developers.miro.com/docs/update-and-sync-item-properties

🤷🏻 Maybe they should handle frames like shapes which in fact have border properties => https://developers.miro.com/docs/shape_shape-1
 

The only way i see this can be possible is to intercept the code who prints the frame, but js files are minimized …