Subforums in two / three columns

To make a conclusion in two or three columns, first of all, we need to enable the change the output of the subsections in the style settings.
Appearance -> Style properties -> Node/forum list
And select the item there.
Listed below node
1589217104819.webp

Then, for output in two columns, add to the template - extra.less.
Less:
.node .node-subNodeFlatList li {
  float: left;
  margin: 2px 0 2px 2%;
  width: 45%;
}
1589217169086.webp

For output in three columns, add to the template - extra.less.
Less:
.node .node-subNodeFlatList li {
  float: left;
  margin: 2px 0 2px 2%;
  width: 31%;
}
1589217227685.webp

If desired, if message statistics are not needed when outputting in three columns, you can hide it for the desired section by adding extra.less to
Less:
.node--id4 .node-stats {
  display: none;
}
Where is id4, this is the id of the desired section, respectively replace with your own.
1589217285184.webp

Also, if you want to set the section icon and block with the last message in at the section header level, just add to - extra.less
Less:
.node-body {
    .node-icon,
    .node-extra {
      vertical-align:  top;
    }   
}
 
To make a conclusion in two or three columns, first of all, we need to enable the change the output of the subsections in the style settings.
Appearance -> Style properties -> Node/forum list
And select the item there.
Listed below node
View attachment 386
Then, for output in two columns, add to the template - extra.less.
Less:
.node .node-subNodeFlatList li {
  float: left;
  margin: 2px 0 2px 2%;
  width: 45%;
}
View attachment 387
For output in three columns, add to the template - extra.less.
Less:
.node .node-subNodeFlatList li {
  float: left;
  margin: 2px 0 2px 2%;
  width: 31%;
}
View attachment 388
If desired, if message statistics are not needed when outputting in three columns, you can hide it for the desired section by adding extra.less to
Less:
.node--id4 .node-stats {
  display: none;
}
Where is id4, this is the id of the desired section, respectively replace with your own.
View attachment 389
Also, if you want to set the section icon and block with the last message in at the section header level, just add to - extra.less
Less:
.node-body {
    .node-icon,
    .node-extra {
      vertical-align:  top;
    }  
}
any tutorial for subforums grid style?
 
Back
Top