code mirror custom gutters

I am trying to make a website using code mirror. I would like to add custom code folding gutters for lines that begin with certain characters. I have gotten this to work when a button is clicked.

editorState.dispatch({
effects: foldEffect.of({ from: 0, to: 15 })

});

The problem with the snippet above is that the gutter disappears when the code is unfolded. I would like to add a gutter at locations and be able to fold/unfold the code. I can handle finding where to put the gutter, but what function do I need to insert a gutter at a specific location so that the gutter stays there to fold/unfold the code?

I have also looked at this. CodeMirror Gutter Example

Any help on this would be appreciated.