Prototype page with two columns doesn't work


I used this tutorial but can’t make it work properly

I use the demo trial for frontend and backend, the frontend uses react SPA.

prototype page is:

      jcr:primaryType: hst:component
      jcr:mixinTypes: ['hst:prototypemeta']
      hst:displayname: Two Columns
      hst:primarycontainer: main/content/left
      hst:referencecomponent: hst:abstractpages/base
        jcr:primaryType: hst:component
          jcr:primaryType: hst:component
          hst:template: twocolumns-main
            jcr:primaryType: hst:containercomponent
            hst:label: Two Columns Left
            hst:xtype: hst.vbox
            jcr:primaryType: hst:containercomponent
            hst:label: Two Columns Right
            hst:xtype: hst.vbox

twocolumns-main template is:

<#include "../include/imports.ftl">

<div class="row-fluid">
  <div class="span6">
    <@hst.include ref="left"/>
  <div class="span6">
    <@hst.include ref="right"/>

but when I create a page from this prototype page (in the Experience Manager) there are no columns, just the second container is below the first

Can somebody help to understand what I’m doing wrong? or what I missed?

Thank you

I think we have a mismatch here… twocolumns-main template is part of back-end rendering, React SPA is front-end rendering. I guess the SPA demo doesn’t support the two-columns. Is this information actually present in the Page Model API (typically on /resourceapi)?


hi, do you have some basic example? or at least some correct articles? thanks

Sorry we don’t seem to have examples on the two-column SPA… and I’m not sure if this information is in the /resourceapi output either. You can easily check that and if it is, build the React app to use it.