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 customize Personalize sub-forums display (more)

4 posters

Go down

Solved How to customize Personalize sub-forums display (more)

Post by coaogati December 23rd 2014, 10:32 am

Dear Forumotion,

I have just finished several steps on the topic "
Personalize sub-forums display". However, I have more requests as below:

5 - How to customize Personalize sub-forums display (more) 10862675_423702871119855_585154012219606811_o

The image with 5 steps:

- Pic. #1, Categories and forums setup.
- Pic. #2, The completed of construction "Personalize sub-forums display".
- Pic. #3, The icons that I want them show up the topic got news or not.

Link images:
- New responses:
Code:
https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-xpf1/v/t1.0-9/960132_423705514452924_5132713039085827794_n.jpg?oh=81b0889db832d5834e6fdc547385517e&oe=553F9275&__gda__=1425620889_c853fc987499cc51915fe8a0603e8a45
- Nothing news:
Code:
https://scontent-a-sin.xx.fbcdn.net/hphotos-xaf1/v/t1.0-9/10325504_423705524452923_4492252961070206696_n.jpg?oh=91a052273091e31111b3e1083958c27a&oe=54FC6E2C

- Pic. #4, I tried however It is not what I want.

- Pic. #5, I need the Sub-forums must be align (Rows and columns) as per Pic.#5 but the icons can be show that these posts are new or old.

This is link to my forum (Version phpBB3):
Code:
http://coaogati.forumvi.com

Test account if needed:
Code:
Account: testingacc
Password: A123456Z

Merry Christmas and Happy New Year!

Thank you!


Last edited by coaogati on December 30th 2014, 1:17 pm; edited 1 time in total
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 25th 2014, 2:12 am

Dear Forumotion,

How to get things done? Is this possible?
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 25th 2014, 4:16 am

Hello @coaogati,

You are wanting the sub-forum links to be equal in width ? I didn't understand too well, could you clarify ?

Thanks
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 25th 2014, 5:52 am

Hello Ange,

Please look at the image below to make my requests clearer.

Since I have many sub-forums in one category. So, I need the sub-forums align as three columns in the picture. In another case, if the width of homepage not enough space, we can arrange sub-forums in 2 columns. We also can call "equal in width" as well.

5 - How to customize Personalize sub-forums display (more) 10849097_685581584889120_2768451275102141557_o
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 25th 2014, 5:56 am

You can do this, however you'll need more width in your forum if you're going to use 3 in a row.

Add to CSS :
Display > Colors > CSS stylesheet
Code:
.s_forum a.gensmall {
  display:inline-block;
  width:250px;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 25th 2014, 6:10 am

This is what I mean. However, it worked not very well. Could you do this by percent (%)?
This means: column one how many percent, column two how many percent and three too.

Thank you for your support!

5 - How to customize Personalize sub-forums display (more) 10310614_685592174888061_8260527135612508635_n
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 25th 2014, 6:28 am

of course, simply change "250px" to something like "50%"
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 25th 2014, 6:35 am

Sorry! I want difficult more than that.

For example:

- Column one: 45%
- Column two: 30%
- Column three: 25%.

Something like this.
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 26th 2014, 9:43 pm

Anyway to do that?

With your code below, all sub-forum in horizontal will be the same space.
Code:
.s_forum a.gensmall {
  display:inline-block;
  width:250px;
}

I need your help to get them different spaces as below :
- Column one: 45% of width
- Column two: 30% of width
- Column three: 25% of width
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by SLGray December 26th 2014, 10:12 pm

You will have to give each column a different selector to have different sizes.


5 - How to customize Personalize sub-forums display (more) Slgray10

When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
SLGray
SLGray
Administrator
Administrator

Male Posts : 50346
Reputation : 3473
Language : English
Location : United States

View user profile https://forumsclub.com/gc/128-link-directory/

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 28th 2014, 3:53 pm

Hello Forumotion,
I hope that you have not yet out of control on many questions of your member.
How long can I have your help?

Thank you!
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 29th 2014, 11:08 pm

Hi @SLGray,

Who is the person working on my request? It is in progress 3 days ago.

Thank you!
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 30th 2014, 12:23 am

Hello,

I apologize for the wait, I've been busy. Go to Administration Panel > Modules > JavaScript codes management > Create a new script

Title : Your choice
Placement : In the homepage
Paste the code below :
Code:
$(function() {
  var max_by_line = 3;
  for (var i=0,a=document.getElementsByTagName('DIV'); i<a.length; i++) {
    if (/s_forum/.test(a[i].className)) {
      var n = 1;
      for (var j=0,b=a[i].getElementsByTagName('A'); j<b.length; j++) {
        if (/gensmall/.test(b[j].className)) {
          if (n>max_by_line) n = 1;
          b[j].className += ' sublink_' + n;
          n++
        }
      }
    }
  }
});

Modify max_by_line to the amount of links you allow per row.

After that you should be able to modify each link with a unique class, like below.
Code:
.s_forum a.gensmall { display:inline-block }
.sublink_1 { width:45% }
.sublink_2 { width:30% }
.sublink_3 { width:25% }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 30th 2014, 12:45 am

Hi @Ange Tuteur,

Anyway to understand it easier? Since I do not know anything about coding, so I think that I only can revise number. Can not touch to code.

Thank you!
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 30th 2014, 1:03 am

The script I gave you will number each "column" in a row. So if you have 3 "columns" you would use the following :

for column1 : .sublink_1
for column2 : .sublink_2
for column3 : .sublink_3
and so on...

You can use these classes in your CSS stylesheet. The only thing you need to change in the script I gave you is var max_by_line = 3; change the 3 to the number of columns you have in a row. If it's 2, put 2, if not put whatever it is. Wink
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 30th 2014, 2:07 am

Hi @Ange Tuteur

I applied in JS and CSS per below image:
5 - How to customize Personalize sub-forums display (more) 10828074_688977384549540_7290387813604001294_o

Sub-Forum will look like below:
5 - How to customize Personalize sub-forums display (more) 10688172_688977401216205_5369971225797621627_o

Have I do something wrong?
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ange Tuteur December 30th 2014, 4:59 am

You'll need to lower the total width so it comes under 100%. For example :

37% + 27% + 27% = 91%

It might need to be lower, I'm not sure. Anyway, you just need to play around with different values to see what looks good. If the combined width ( see math above ) is too high, then the sublinks will wrap to the next line or row.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13244
Reputation : 2990
Language : English & 日本語
Location : Pennsylvania

View user profile https://fmdesign.forumotion.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 30th 2014, 1:16 pm


Icon fourth (#4) of sub-forum is always in the first horizontal line. I am current only use 70% in totally. (30% + 20% + 20% = 70%). I went around with many values, but it does not work. I think it will difficult to resize if we have many categories and sub-forum. So, I will make them the same size (space).

5 - How to customize Personalize sub-forums display (more) 10830979_689291001184845_171324758083749480_o

Thank you very much Ange!
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ape December 30th 2014, 4:46 pm

Is this problem now solved as it marked as solved on the icon ?


5 - How to customize Personalize sub-forums display (more) Left12125 - How to customize Personalize sub-forums display (more) Center115 - How to customize Personalize sub-forums display (more) Right112
5 - How to customize Personalize sub-forums display (more) Ape_b110
5 - How to customize Personalize sub-forums display (more) Keep_s10
5 - How to customize Personalize sub-forums display (more) Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 17862
Reputation : 1904
Language : fluent in dork / mumbojumbo & English haha

View user profile http://chatworld.forumotion.co.uk/

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by coaogati December 30th 2014, 5:48 pm

@APE Done!
coaogati
coaogati
New Member

Posts : 12
Reputation : 2
Language : English

View user profile http://coaogati.forumvi.com

Back to top Go down

Solved Re: How to customize Personalize sub-forums display (more)

Post by Ape December 30th 2014, 6:01 pm

Thank you @coaogati
Topic solved and archived

Have A APE New Year

5 - How to customize Personalize sub-forums display (more) Dancin12


5 - How to customize Personalize sub-forums display (more) Left12125 - How to customize Personalize sub-forums display (more) Center115 - How to customize Personalize sub-forums display (more) Right112
5 - How to customize Personalize sub-forums display (more) Ape_b110
5 - How to customize Personalize sub-forums display (more) Keep_s10
5 - How to customize Personalize sub-forums display (more) Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 17862
Reputation : 1904
Language : fluent in dork / mumbojumbo & English haha

View user profile http://chatworld.forumotion.co.uk/

Back to top Go down

Back to top

- Similar topics

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