Bootstrap supporting Surreal CMS


#1

Are there any plans to incorporate Bootstrap support into Surreal CMS?

e.g.
Editing which maintains the Bootstrap row / column grid system containers


#2

This is something you’d incorporate into your theme, where your page already has the appropriate structure and inside that structure is where you’ll define your editable regions.

We generally don’t recommend putting structural elements inside of an editable region because a client could Select All + Delete and remove it completely.

We don’t really have plans to support structured content inside editable regions because of the nature of the service. You can have one or 100 regions on a page, but they key thing that separates Surreal CMS from — for example — a website builder is that, when integrated properly, the structure will never change.

This makes Surreal really useful for clients who tend to get a little creative when they have too much control :slight_smile:


#3

Something I found worked quite well on a client project I was working on is to offer different templates for different bootstrap layouts so that when they created a new page they could select single-column page, two-column page, etc. I filled these templates with the following markup:

<div class="container editable" id="container">
    <div class="row repeatable">
        <div class="col-md-6">
            <p>Lorem ipsum dolor</p>
        </div>
        <div class="col-md-6">
            <p>Lorem ipsum dolor</p>
        </div>
    </div>
</div>

This would allow the user to pick an initial layout, and then add as many rows as they want, so they could follow a more complex layout with ease. You can also combine different row types in the markup so that the user has even more freedom to play around with setting out each page. This is one of the many great benefits of using the repeatable class.


#4

Talking of website builders Cory (!), I just tried an experiment to add Surreal CMS to a Mobirise / Bootstrap 4 based site to see what would happen without doing anything special around the Mobirise generated code. I could define editable regions for some of their generated code but CSS animations made it tricky for other parts.

Anyway, the main thing I wanted to say was that it would be cool if a website builder tool like Mobirise could play nicely with Surreal CMS to give the designer and the client the best of both worlds but do you think that this could be possible? Trying to edit the site using 2 different systems will cause mayhem I suppose e.g. if one of the content blocks was updated slightly in Mobirise, published to the web server via FTP, and then opened in the Live Editor in Surreal CMS, any definition of that block as an editable region would be lost. I wonder what other people who use website builders do in this situation?