• This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Tutorial: Sub Forum Grid Listing...

bobster65 said:
Been wanting to mess with this and finally had time this AM.. did mine a little different. Only wanted the Sub Forum Grids on 2 forums and the rest remaining default xenforo. Also wanted 64 (32 new, 32 old) images for each of the 32 sub forums. Still have some tweaking that I want to do, but its coming along nicely :) Each Team uses 2 images (node_id-new.png and node_id-old.png).

View attachment 12329
Click to expand...

How did you get each sub-forum grid item to show its own icon? I tried mashing this template mod with a custom icon mod but I'm not proficient enough to know which templates to change and exactly what code to add. Any help appreciated!
 
trigatch4 said:
How did you get each sub-forum grid item to show its own icon? I tried mashing this template mod with a custom icon mod but I'm not proficient enough to know which templates to change and exactly what code to add. Any help appreciated!
Click to expand...

For the example screen shot I posted, I did it like this.

Template: node_forum_level_n

The numbers in the array (line 3) are the actual SUB FORUM IDs for the 2 grids. I have 32 Team Sub Forums , so those are the ID's of each Team Forum that I wanted ICONs for. You will then need 2 images for each sub forum. They need to be named with the specific SUB FORUM ID NUMBER .. ie, 17-new.gif and 17-old.gif where 17 is the SUB FORUM ID. You'll need to edit the width, height and paths to the images (Lines 5&8 in the h4 img tag lines below). Each image must be the same size or it will look like crap.

HTML: 
<li class="node forum level-n node_{$forum.node_id} {xen:if $renderedChildren, 'fullWidth'}">
    <div {xen:if $forum.hasNew, 'class="unread"'}>
        <xen:if is="in_array({$forum.node_id}, array(11,13,20,8,9,18,21,17,14,15,23,10,16,19,22,12,27,31,35,37,28,26,36,39,25,32,33,38,29,30,34,40))">
            <xen:if is="{$forum.hasNew}">
                <h4 class="nodeTitle"><a href="{xen:link forums, $forum}" class="menuRow"><img height="27" width="40" style="float:left;" src="@imagePath/xenforo/folder/{$forum.node_id}-new.gif" />&nbsp;{$forum.title}</a></h4>
            <xen:else />
                <h4 class="nodeTitle"><a href="{xen:link forums, $forum}" class="menuRow"><img height="27" width="40" style="float:left;" src="@imagePath/xenforo/folder/{$forum.node_id}-old.gif" />&nbsp;{$forum.title}</a></h4>
            </xen:if>
        <xen:else />
            <h4 class="nodeTitle"><a href="{xen:link forums, $forum}" class="menuRow">{$forum.title}</a></h4>
        </xen:if>
    </div>
    <xen:if is="{$renderedChildren}">
        <ol>
            <xen:foreach loop="$renderedChildren" value="$child">
                {xen:raw $child}
            </xen:foreach>
        </ol>
    </xen:if>
</li>
 
Around a dozen template changes - is there no easier way to just display the subforums on the index?
 
Jaxel said:
These edits will add a GRID LISTING of sub forums in your forum list and forum views.

...
Click to expand...

Im having a problem.

I did everything that this thread said to do and i have 2 issues.

1. The grid is wider than the forum boundries.

2. The BOLD Recent Post in Sub Forum is too big. How can i size that down so its not so big it breaks out of the button?

Here is an image showing both my issues.

forumbug.webp
 
UltimaOX said:
Im having a problem.

I did everything that this thread said to do and i have 2 issues.

1. The grid is wider than the forum boundries.

2. The BOLD Recent Post in Sub Forum is too big. How can i size that down so its not so big it breaks out of the button?

Here is an image showing both my issues.

View attachment 19068
Click to expand...

Acctully the new CSS you posted here kinda fixes it. good enough =]
 
I can't get this to work on 1.1.0 beta 2, did all the edits and nothing changes on the forum display
 
Alex said:
I can't get this to work on 1.1.0 beta 2, did all the edits and nothing changes on the forum display
Click to expand...

It works just fine. Are you sure you are making the changes on the same style that you are viewing?
 
bobster65 said:
It works just fine. Are you sure you are making the changes on the same style that you are viewing?
Click to expand...

Yep checked and double checked all my edits and nothing happened, will have another look at it tomorrow, really hoping to get ready to switch over my main site soon
 
Alex said:
Yep checked and double checked all my edits and nothing happened, will have another look at it tomorrow, really hoping to get ready to switch over my main site soon
Click to expand...

If you still can't get it and want a 2nd set of eyes, just in box me..
 
Hey there, I'm having quite a bit of difficulty with these CSS settings, I've tweaked them and played around with them however even with that said the little "read / unread" icon's won't show on some "last posts" as well as sub-forums and quite a lot of sub-forums won't even show up, they seem "invisible" however I know they're there. Because the forum right after the one that won't show up is there, and the spacing on the sub-forums seems to be off on some of my boards.

What could be the problem? I followed the instructions down to a T.

EDIT: Scratch that.. I'm so stupid. I CAREFULLY took the time to read-over this thread and it seems like I wasn't the only one with those issues, I fixed it up now. For those having the same issue as me, please take a look at the posts here carefully from page 1 to 2 should explain and fix any common issue with this you may have, cheers! :)
 
Jaxel thank you for this Mod, it will come in very handy for me.

I have one question here though, maybe someone knows the answer.

I have installed the grid successfully and it is there on the 'forums' page but if you click on the 'subforum' the structure is gone. On Jax's site the 'Grid' is on the 'forums' as well as being on the 'subforum' 'Soul Caliber Tactics' pages. The structure remains and then there are 'other' thread listed within that subforum. Does anyone know how this was done?
 
BUMP98.gif

Anyone?
 
Got this working now, but only want to show the first level of sub-forums on the home page not the next level, how can i do this?
 
Staxed said:
was wondering if someone might be able to help me a bit, been messing with it, but I guess I'm just not good enough at CSS yet to get it to work correctly.

I'm using the flexile. I'm trying to get the subforums, which look like the below image using the instructions in this thread
subforum_before.png

to look like this:
subforum_after.png


I moved the code from the end of node_category_level_2 to before the last </div> but that doesn't seem to work, plus I can't figure out how to remove the class that's assigned to it to get it like I've got pictured.

I'd love some help :)

My current extra.css looks like this:

Code: 
/* Start Subforum Grid */
    .subForumsGrid { padding-right: 4px; }
    .subForumsGrid .blockLinksGrid { width: 100%; display: inline-block; }
    .subForumsGrid .fullWidth { width: 100% !important; padding-bottom: 4px; }
    .subForumsGrid .node { width: 20%; float: left; }
    .subForumsGrid .node ol { padding-left: 10px; }
    .subForumsGrid .node  a { padding: 5px 10px 5px 18px; }
    .subForumsGrid .node .node a { padding: 0px 10px 1px 18px; }
    .subForumsGrid .node .nodeTitle { font-size: 11px; white-space: nowrap; overflow: hidden; }
    .subForumsGrid .node div { background: url('@imagePath/xenforo/widgets/read.png') no-repeat 0px 50%; }
    .subForumsGrid .node div.unread { background: url('@imagePath/xenforo/widgets/unread.png') no-repeat 0px 50%; }
    .subForumsGrid .node div,
    .subForumsGrid .node div a:hover
    {
        background-image: url('@imagePath/xenforo/widgets/read.png');
        background-repeat: no-repeat;
        background-position: 0px 50%;
    }
    .subForumsGrid .node div.unread,
    .subForumsGrid .node div.unread a:hover
    {
        background-image: url('@imagePath/xenforo/widgets/unread.png');
        background-repeat: no-repeat;
        background-position: 0px 50%;
    }
/* End Subforum Grid*/
Click to expand...

I've managed to remove the background colour from the grid listing, but can't get it to sit exactly like the second picture, I can only get it to sit the other side of the border
 
This is how I currently have mine looking, but I want to move the sub forum list above the border

subforums.webp
 
You must log in or register to reply here.

Similar threads

CaptainMorgan
Other Sub-Forums Grid
Replies
0
Views
754
CaptainMorgan
CaptainMorgan
Top Bottom