The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

how to make a code affect only a single category

View previous topic View next topic Go down

Solved how to make a code affect only a single category

Post by longstormicus on August 26th 2015, 11:39 pm

Technical Details

Forum version : #phpBB3
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Safari
Who the problem concerns : All members
When the problem appeared : It's just there.
Forum link : http://outcastwarriors.forum-motion.com/forum

Description of problem

Hello!

I have been modifying the layout of my forum's index and have been using this CSS code to make my categories on the main page lay out next to one another:

Code:
#index-forum .forabg {
 display:inline-block;
 vertical-align:top;
 margin-top:1px;
 margin-bottom:1px;
 margin-left:15px;
 margin-right:0px;
 width:45%;
}

It works absolutely fine.

However, I was wondering if it was possible if the code could only affect specific categories? As in, only some of the categories line up next to one another, and the others on the same page look like default categories?
Example:
Single Category
Two Categories
Two Categories
Single Category

I have seen this Javascript code I found in this topic (link) used to affect the "Last Post, Post Number, Post Author" tables for only specific categories and I have used it:
Code:
$(function() {
$('div.forabg:contains("TITLE OF CATEGORY") dd.topics, div.forabg:contains("TITLE OF CATEGORY") dd.posts, div.forabg:contains("TITLE OF CATEGORY") dd.lastpost').css('display','none');
});

I was wondering if something similar could be devised for the category layout?

Thank you.

EDIT: I am now worried I may have put this question in the wrong place.


Last edited by longstormicus on August 27th 2015, 6:43 pm; edited 2 times in total

longstormicus
New Member

Posts : 8
Reputation : 1
Language : English

http://outcastwarriors.forum-motion.com/forum

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by APE on August 27th 2015, 1:33 am

No this is the right place you just have to hold on for a member or a member of our staff to rad your post and help make a code for you.




APE
Manager
Manager

Male Posts : 8608
Reputation : 748
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by Ange Tuteur on August 27th 2015, 10:55 am

Hi @longstormicus,

It's possible, you'll just need to use a bit of javascript. Go to Modules > JavaScript codes management and create a new script with the following settings.

Placement : In the homepage
Code:
$(function() {
  var categories = {
    'Clan Territories' : 'clan-territories',
    'The Night Sky' : 'the-night-sky'
  },

  forabg = $('.forabg'), i = 0, j = forabg.length, h2, k;

  for (; i < j; i++) {
    h2 = forabg[i].getElementsByTagName('H2')[0];
    if (h2) {
      for (k in categories) {
        if (k.toLowerCase() == $(h2).text().toLowerCase()) {
          forabg[i].className += ' ' + categories[k];
          break;
        }
      }
    }
  }
});

To apply a class to a specific category you'll need to edit the categories object at the top of the script.
Code:
  var categories = {
    'Clan Territories' : 'clan-territories',
    'The Night Sky' : 'the-night-sky'
  },

To the left of the colon is the category title and to the right is the class name we want applied to it. So to make it simple; 'TITLE' : 'CLASSNAME' pairs, and a comma at the end if there's another pair after it.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by longstormicus on August 27th 2015, 6:05 pm

Hello Ange Tuteur,

I applied the javascript code but I do not see any change. Is there something else I need to do to get it to take effect?

Thank you!

longstormicus
New Member

Posts : 8
Reputation : 1
Language : English

http://outcastwarriors.forum-motion.com/forum

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by Ange Tuteur on August 27th 2015, 6:35 pm

It looks like you forgot a comma after :
Code:
'Roleplay Resources' : 'roleplay resources'

Here, replace it with this :
Code:
$(function() {
  var categories = {
    'Roleplay Resources' : 'roleplay resources',
    'The Night Sky' : 'the-night-sky'
  },

  forabg = $('.forabg'), i = 0, j = forabg.length, h2, k;

  for (; i < j; i++) {
    h2 = forabg[i].getElementsByTagName('H2')[0];
    if (h2) {
      for (k in categories) {
        if (k.toLowerCase() == $(h2).text().toLowerCase()) {
          forabg[i].className += ' ' + categories[k].replace(/\s/g, '-');
          break;
        }
      }
    }
  }
});

When done you should be able to reference the category via .forabg.roleplay-resources

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by longstormicus on August 27th 2015, 6:42 pm

Well, holy frickin crap, that's AMAZING. It works perfectly! THANK YOU VERY MUCH!!!

I will mark this topic "solved."

longstormicus
New Member

Posts : 8
Reputation : 1
Language : English

http://outcastwarriors.forum-motion.com/forum

Back to top Go down

Solved Re: how to make a code affect only a single category

Post by Ange Tuteur on August 27th 2015, 6:59 pm

You're welcome ^^

Topic archived

If you have anymore problems feel free to open a new topic. Smile

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum