The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

how to make a code affect only a single category

3 posters

Go down

Solved how to make a code affect only a single category

Post by longstormicus 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
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 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.


how to make a code affect only a single category Left1212how to make a code affect only a single category Center11how to make a code affect only a single category Right112
how to make a code affect only a single category Ape_b110
how to make a code affect only a single category Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 19084
Reputation : 1988
Language : fluent in dork / mumbojumbo & English haha

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 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
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

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

Post by longstormicus 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
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 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
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

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

Post by longstormicus 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
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 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
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

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