Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.


This discussion is related to the CategoryIcons addon.
edited July 2007 in Vanilla 1.0 Help


  • Hi Jim,

    It appears the extension isn't found by Vanilla's updater.
  • Do I just need to add the version number config setting?
  • The who? You need to make sure the name of the extension is the same in the default.php file as it is on the addons site and that the version numbers match up.
  • When using the VaneaBlack style, this plugin gives an odd result when viewing the front page. Two discussion-icons appears next to each other for each discussion (that little chat bubble).

    This can be fixed by changing the padding-left property of the class .DiscussionType in VaneaBlack's vanilla.css. The original value is 30px. Change it to 0px.
  • my categories page is all messed up?

    why? i made my icons 30x30px
  • To add the solution to this, I recommended that the "#Categories li li" style be changed to add "display:inline;". eduvauchelle tried this and found the "display:compact;" worked better for him. I also noted that this add-on is theme/style dependent and tweaking it seems to be required for different styles.
  • This add-on only handles 10 Categories in the style.css, but you can expand it easily. If you need to add more, you need to add styles to 2 places in the stylesheet (one for the Discussions page and one for the Categories page). If you look for the following code, you can copy and paste and then edit to change 10 to 11 and change the jpg name. .Category_10 .DiscussionCategory a{ background: transparent url(images/nay-kiconwinter1.06.jpg) 2px 50% no-repeat; } Also look for the following code and copy and paste and edit as above: #Categories .Category_10 .CategoryDescription{ background: transparent url(images/nay-kiconwinter1.06.jpg) 2px 50% no-repeat; min-height:60px; }
  • This is a nice addon. The only thing I'd like is to still see the category names on the front page. It shows all the discussions with the icons but unless you know which icon goes for which category it isn't very obvious.
  • Would it be possible to mod this to display the icons (and padding) for only one category, and on the far right side of the discussion page while retaining the category text?

    Like so:

    (Click to enlarge)

    The numbering seems to be relative to the category ID, so having only one with the appropriate number fixes the single icon problem, but the padding remains for all the discussions on the page. Perhaps the padding wouldn't be necessary (or visible) if the icon was on the far right? How would I go about making it look like it does in the mockup?
  • I did a quick test and found that if you change the code below, the image will be to the right. This still leaves the left padding in the discussion items. I'll look at this later.
    .DiscussionCategory { width:60px !important; height:60px !important; padding:0; margin:0; text-indent:-9999px; position:absolute; top:4px; left:2px; /*change left to right if you want the image to the right*/ }
    I am also uploading a new version today to eliminate the continual update of the config settings file.
  • Uploaded version 1.0.3 of CategoryIcons.
  • Awesome, can't wait to see if you can get the other bit fixed, too!
  • The other part to solving the left indent problem, has to do with the following code.
    /* Add paddings for the linked icons */ .CategoryDescription, .CategoryDiscussionCount, .CategoryOptions, #Discussions li ul{ padding-left:65px; }

    You have to separate out the Discussions tags as follows and change the padding to 15px:
    #Discussions li ul{ padding-left:15px; }
    and place it before:
    /*Image overlap fix*/ #Discussions li li { height:40px; } /**********************/
    This will leave:
    /* Add paddings for the linked icons */ .CategoryDescription, .CategoryDiscussionCount, .CategoryOptions { padding-left:65px; }
    That should do it. In the next version, I'll separate these out to make it easier to maintain.

    And, of course, this display will vary with theme.
  • Hi, How do I go about changing this so the icons only appear on the discussion page & not the category?
  • There are 2 sections in the stylesheet one for discussions and one for categories. You could comment out the categories section by placing /* at the beginning of it and */ at the end. That way if it doesn't work the way you want it, you can uncomment it and do some more research.
  • Thank you.
  • I'd quite like the name of the category to be visible perhaps even in a thread title. Any ideas for a simple mod to do this.
  • CategoryIcons is basically just a css change. What would be needed would be to loop through the discussionmanager items, look for the image and then add the category title. In my thinking this would require another add-on or a mod to your dicsussions.php file.
  • My icons show up fine on the categories page, but I have nothing going on discussions page.


    Please, please help. I'm trying to get this thing going soon.
  • You need to edit you css file in two places not just one
Sign In or Register to comment.