Show a Category on Portal

I was wondering how to how a category on the portal like the support's.

Here is a link to the same question: https://help.forumotion.com/t144001-show-forums-category-in-portal

Was also wondering if you could show individual forums from separate categories as well.

Bump.

Bump

Bump.

Bump

Bump

I don't really see an option like that in the admin panel so my guess would be that they copied the html and pasted it in a widget. That way it is possible to add forums from different categories.

There is a widget called News that will show topics from the forum you choose.

SLGray wrote:There is a widget called News that will show topics from the forum you choose.

But how to show forums?

You will have to create a customized widget.

Code:

[url=link to forum]forum title[/url]

SLGray wrote:You will have to create a customized widget.

Code:

[url=link to forum]forum title[/url]

I'd like to make it visually the same, not just a hyperlink.

This is the default html used to create the categories. It should do the trick to get the forumstyle inside a widget:

Code:

<!-- START category block --->
<div class="forabg">
   <div class="inner">
      <span class="corners-top"><span></span></span>
      <!-- START category title --->
      <ul class="topiclist">
         <li class="header">
            <dl class="icon">
            <dd class="dterm">
               <div class="table-title"><h2>--category title---</h2></div>
            </dd>
         </li>
      </ul>
      <!-- END category title --->
      <!-- START forums/topics --->
      <ul class="topiclist forums">
         <li class="row">
            <dl class="icon">
               <dd class="dterm">
                  <div style="display: block;">
                     <h3 class="hierarchy"><a href="---url to forum" class="forumtitle">Your first forum</a></h3>
                     <br>
                     ---forum description---
                     <br>
                  </div>
               </dd>
            </dl>
         </li>
      </ul>
      <!-- END forums/topics --->
      <span class="corners-bottom"><span></span></span>
   </div>
</div>
<!-- END category block --->

Thank you, what about each forum's icon?

The icons you can see on the portal here are inside the forum description. Just add float left to them and it should be oke.

Code:

<img src="---url to image---" style="float: left;" />

Not working for me, it looks all weird and different and weird things happen.

This is the code I used for the example. Normally it should do the trick.

Code:

<!--    START category block -    -->
<div class="forabg">
   <div class="inner">
      <span class="corners-top"><span></span></span>   
      <!--    START category title -    -->   
      <ul class="topiclist">
         <li class="header">
            <dl class="icon">
               <dd class="dterm">
                  <div class="table-title">
                     <h2>
                          --category title--- 
                     </h2>
                  </div>
               </dd>
            </dl> 
         </li>
      </ul>
      <!--    END category title -    -->   
      <!--    START forums/topics -    -->   
      <ul class="topiclist forums">
         <li class="row">
            <dl class="icon">
               <dd class="dterm"> 
                  <div style="display: block;">
                     <h3 class="hierarchy">
                        <a href="---url to forum" class="forumtitle">Your first forum</a> 
                     </h3>
                     <br />
                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 
                  </div>
               </dd>
            </dl>   
         </li>
      </ul>
      <!--    END forums/topics -    --> <span class="corners-bottom"><span></span></span>   
   </div>
</div>
<!--    END category block -    -->

But when you add a widget, there is another bar above for the widget title.

Bump.

Bump.

Bump.

Select 'no' by 'Use a table type' on the widget options.

Can you please send me code via PM? I keep trying to select it and I keep getting the numbers on sides as well.

I'll set it as inline code, then there are no numbers.

Code: <!--    START category block -    --> <div class="forabg">   <div class="inner">       <span class="corners-top"><span></span></span>        <!--    START category title -    -->        <ul class="topiclist">         <li class="header">             <dl class="icon">               <dd class="dterm">                   <div class="table-title">                     <h2>                           --category title---                     </h2>                   </div>               </dd>             </dl>         </li>       </ul>       <!--    END category title -    -->        <!--    START forums/topics -    -->        <ul class="topiclist forums">         <li class="row">             <dl class="icon">               <dd class="dterm">                   <div style="display: block;">                     <h3 class="hierarchy">                         <a href="---url to forum" class="forumtitle">Your first forum</a>                     </h3>                     <br />                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.                   </div>               </dd>             </dl>          </li>       </ul>       <!--    END forums/topics -    --> <span class="corners-bottom"><span></span></span>    </div> </div> <!--    END category block -    -->

Works! Thank you so much! But how do I add more forums?

Bump.

@Forumedic you do exactly the same steps.

Luffy wrote:@Forumedic you do exactly the same steps.

But won't it create a new category? As part of the code is creating the category.

Yes it will. You want it to create an other category in the same forum?

Luffy wrote:Yes it will. You want it to create an other category in the same forum?

I think? I want another forum in the same category.

Ok so you have this code here:

Code: <!--    START category block -    --> <div class="forabg">   <div class="inner">       <span class="corners-top"><span></span></span>        <!--    START category title -    -->        <ul class="topiclist">         <li class="header">             <dl class="icon">               <dd class="dterm">                   <div class="table-title">                     <h2>                           --category title---                     </h2>                   </div>               </dd>             </dl>         </li>       </ul>       <!--    END category title -    -->        <!--    START forums/topics -    -->        <ul class="topiclist forums">         <li class="row">             <dl class="icon">               <dd class="dterm">                   <div style="display: block;">                     <h3 class="hierarchy">                         <a href="---url to forum" class="forumtitle">Your first forum</a>                     </h3>                     <br />                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.                   </div>               </dd>             </dl>          </li>       </ul>       <!--    END forums/topics -    --> <span class="corners-bottom"><span></span></span>    </div> </div> <!--    END category block -    -->

to create to you a forum (the entire thingy) and a single category (the one inside it).
Using the list element is the easiest way. So in order for you to make an other one you need to add this part:

Code:  <!--    START forums/topics -    -->        <ul class="topiclist forums">         <li class="row">             <dl class="icon">               <dd class="dterm">                   <div style="display: block;">                     <h3 class="hierarchy">                         <a href="---url to forum" class="forumtitle">Your first forum</a>                     </h3>                     <br />                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.                   </div>               </dd>             </dl>          </li>       </ul>       <!--    END forums/topics -    -->

Once more exactly after this part in the code. So you need to have this:

Code: <!--    START category block -    --> <div class="forabg">   <div class="inner">       <span class="corners-top"><span></span></span>        <!--    START category title -    -->        <ul class="topiclist">         <li class="header">             <dl class="icon">               <dd class="dterm">                   <div class="table-title">                     <h2>                           --category title---                     </h2>                   </div>               </dd>             </dl>         </li>       </ul>       <!--    END category title -    -->        <!--    START forums/topics -    -->        <ul class="topiclist forums">         <li class="row">             <dl class="icon">               <dd class="dterm">                   <div style="display: block;">                     <h3 class="hierarchy">                         <a href="---url to forum" class="forumtitle">Your first forum</a>                     </h3>                     <br />                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.                   </div>               </dd>             </dl>          </li>       </ul>       <!--    END forums/topics -    --> <!--    START forums/topics -    -->        <ul class="topiclist forums">         <li class="row">             <dl class="icon">               <dd class="dterm">                   <div style="display: block;">                     <h3 class="hierarchy">                         <a href="---url to forum" class="forumtitle">Your first forum</a>                     </h3>                     <br />                     <img style="float: left;" src="http://2img.net/i/bl/logo.png" /> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.                   </div>               </dd>             </dl>          </li>       </ul>       <!--    END forums/topics -    --><span class="corners-bottom"><span></span></span>    </div> </div> <!--    END category block -    -->

and change the second part of the category. (I think)