Hello, this is my first day with October. I am working with static page plugin and trying to make play nicely with some bootstrap enabled html.

In my static layout I use {% component 'staticPage' %} to call my page content. Which originally looks like this:

    <section class="duplicatable-content">
            <div class="container">
              <div class="row">
                <div class="col-sm-4">
                  <div class="feature">
                    <h5>Amazingly Simple Use</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>
                  </div>
                </div>

                <div class="col-sm-4">
                  <div class="feature">
                    <h5>Built on Bootstrap 3</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>
                  </div>
                </div>

                <div class="col-sm-4">
                  <div class="feature">
                    <h5>Rock Solid Flexibility</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>
                  </div>
                </div>
              </div>
            </div>
          </section>

However the final output differs somehow:

    <p><br></p><section class="duplicatable-content">
            <div class="row">
                <div class="col-sm-4">
                  <div class="feature">
                    <h5>Amazingly Simple Use</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>

                </div>

                <div class="feature">
                    <h5>Built on Bootstrap 3</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>

                </div>

                <div class="feature">
                    <h5>Rock Solid Flexibility</h5>
                    <p>
                      Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
                    </p>

                </div>
              </div>
            </div>
          </section><p><br></p>

Please notice how I am missing <div class="container"> and have received additinal p br p

Last updated 10 years ago

It turns out it the online editor that changes my code during the save procedure. I fixed the file manually and all is good. Still it would be much more easier if I could rely on the browser editor only.

Last updated 10 years ago

Why don't you use a CMS > partial or CMS > page to store your structural code and then use contents for each of your "features"?

e.g

Partial / Page:

<section class="duplicatable-content">
    <div class="container">
        <div class="row">
            <div class="col-sm-4">
                <div class="feature">
                    {% content "Amazingly-Simple-Use.htm" %}
                </div>
            </div>

            <div class="col-sm-4">
                <div class="feature">
                    {% content "Built-on-Bootstrap-3.htm" %}
                </div>
            </div>

            <div class="col-sm-4">
                <div class="feature">
                    {% content "Rock Solid Flexibility.htm" %}
                </div>
            </div>
        </div>
    </div>
</section>

Content "Amazingly-Simple-Use.htm":

<h5>Amazingly Simple Use</h5>
<p>
    Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus
</p>

and so on - that way you're separating content from structure.

We are using an external bootstrap enabled builder which outputs html code. Creating a new page means I need to replace the code in just one place.

Whereas in the way approach I would have to separate the html from the content first. Then have an appropriate layout ready (one per page mostly) and only then I start setting individual partials.

Then I'd just recommend creating your pages via the CMS > Pages tab or as partials in a parent layout via CMS > Partials and insert in a page using {% partial "file.htm" %}.

If you know you're going to be using the same layout multiple times, then my solution above would work, it would just take a little time separating content from structure, but once it's done, it's done.

Last updated 10 years ago

It's a shame a workaround is needed but not answer/solution as to why the DIV tags are being stripped. I'm having the same issue.