gistfile1.txt

The problem: 

The revolution slider requires that you include your layers and images inside of a <li> item. 


when a plugin is editable it wraps the plugin in a div with a  unique class id, in this case cms-plugin-16646. 
I assume this is so it has a way to reference the element on double click in the visual editor. 

<div class="cms-plugin cms-plugin-16646" style="display: inline;">

  <li data-transition="slideright">
    <!-- MAIN IMAGE -->
    <img src="http://www.spca.org/image/2014-redesign/landing-page-banne.jpg" alt="">
  </li>
  
</div>

this breaks the visual editor because revolution slider simply expects a <li> item: 

<li data-transition="slideright">
  <!-- MAIN IMAGE -->
  <img src="http://www.spca.org/image/2014-redesign/landing-page-banne.jpg" alt="">
</li>


solutions: 
1. we ignore the visual editor and only make slides attributes editable on the structure ui. Let the content editor view just sort of stay broken. 

2. build a visual editor for when we are in edit mode. So when in the content editor mode we have a sort of gallery view to that the user can click on to edit each slide. 

we can check if we are in edit mode: 

{% if request.toolbar.edit_mode %}
	we build an alternate template that is more editable friendly. 
{% endif %}