XF 2.1 page node prevent p-body

[AcidCat]

Ok so whatever content I put in a page currently gets wrapped within p-body > p-body-inner > p-body-main > p-body-content > p-body-pageContent

I need it so my raw html is outputed instead.


Current output is:

<div class="p-body">
    <div class="p-body-inner">
            <div class="p-body-header">
                    <div class="p-title ">
                            <h1 class="p-title-value">Home</h1>
                            <div class="p-title-pageAction">
        <a href="/index.php?pages/front/bookmark" class="bookmarkLink button button--link " title="" data-xf-click="bookmark-click" data-label=".js-bookmarkText" data-sk-bookmarked="addClass:is-bookmarked, Edit bookmark" data-sk-bookmarkremoved="removeClass:is-bookmarked, Add bookmark"><span class="js-bookmarkText ">Add bookmark</span></a>

</div>
                    </div>
            </div>
     
        <div class="p-body-main  ">
            <div class="p-body-content">
                <div class="p-body-pageContent">
test
<div class="blockMessage blockMessage--none">
</div>
</div>   
            </div>
        </div>
    </div>
</div>

I just need it to output "test"

 

[Snog]

That's not possible without custom coding to bypass the XF template system.

 

[AcidCat]

That's not possible without custom coding to bypass the XF template system.

is there any add-ons that do it? all i need is a page with 2 sidebars, on on the left, one on the right

 

[gouwepeer.nl]

That is possible with extra css. On my homepage i have 1 sidebar.
You can create a extra div class in extra.less to use in you're page.

 

[AcidCat]

That is possible with extra css. On my homepage i have 1 sidebar.
You can create a extra div class in extra.less to use in you're page.

I want a sidebar on both sides like this:

aaaaaaaa

bbbbbbbbbbbbbbbb

ccccc

So that theres 2 small parts and 1 big part

 

[gouwepeer.nl]

Example:

.column {
  float: left;
}

/* Left column */
.column.leftside {
  width: 25%;
}

/* Middle column */
.column.middle {
  width: 50%;
}
/* Right column */
.column.rightside {
  width: 25%;
}
/* Responsive layout - breakpoint at 800pixels */
@media screen and (max-width: 800px) {
  .column.side, .column.middle {
    width: 100%;
  }
}

You can change the width if you want. Put this code in extra.less.

The raw html:

<div class="row">
  <div class="column leftside">
    <h2>LEFT</h2>
    <p>Left Sidebar</p>
  </div>
    <div class="column middle">
    <h2>Main Content</h2>
    <p>This is the main container</p>
    </div>
    <div class="column rightside">
    <h2>RIGHT</h2>
    <p>Right Sidebar</p>
  </div>
</div>

 

[gouwepeer.nl]

If you want a specific width for the sidebars you can use the calc function in css.
Example:
Leftsidebar = 300 pixels
Rightsidebar = 300 pixels
___ +
Total sidebars = 600 pixels (important to know to use the calc function)
Width middle column = 100% - 600 pixels

The css code:

.column {
  float: left;
}

/* Left column */
.column.leftside {
  width: 300px;
}

/* Middle column */
.column.middle {
  width: calc(100% - 600px);
}
/* Right column */
.column.rightside {
  width: 300px;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .column.side, .column.middle {
    width: 100%;
  }
}

Now you can set a specified width for the sidebars.

 

[Snog]

That's not what was asked for, but if it's what you wanted.... Great!

 

[AcidCat]

If you want a specific width for the sidebars you can use the calc function in css.
Example:
Leftsidebar = 300 pixels
Rightsidebar = 300 pixels
___ +
Total sidebars = 600 pixels (important to know to use the calc function)
Width middle column = 100% - 600 pixels

The css code:

.column {
  float: left;
}

/* Left column */
.column.leftside {
  width: 300px;
}

/* Middle column */
.column.middle {
  width: calc(100% - 600px);
}
/* Right column */
.column.rightside {
  width: 300px;
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .column.side, .column.middle {
    width: 100%;
  }
}

Now you can set a specified width for the sidebars.

this works perfectly, thanks!

That's not what was asked for, but if it's what you wanted.... Great!

It provides the same result regardless so its fine