custom forum row

aliasjo, honey
pronounsfeminine
645written posts
offlinecurrently
honey and the forgor land
Part of the Furniture
honey and the forgor land Avatar
fed up with y'all bitches
hi i'll keep this short and simple:

idk how to do custom forum row (different shapes and sizes for forum row structure).
i was hoping someone could do a tutorial for it as if you're talking to a 5 year old because i get confused easily and shit when it comes to coding and all the terms.
frog on the floor
aliasfreiheit, microwaved burrito
pronounsany
1,496written posts
pharaoh leapearned bits
offlinecurrently
pharaoh leap
Administrator
pharaoh leap Avatar
i fear you: your silence, your blindness. see what you want to see!
Someone else should probably come in here and clear/clean this up, because I'm literally coding my first Jcink skin, so my custom forums are probably designed really sloppily. The basic idea, though, is that you have to use the forum_id variable, and use that to change the CSS of everything within it. For example:

<div class="class-<!-- |forum_id| -->">
<div class="class-name">meow</div>
<div class="class-name-2">woof</div>
</div>

<style>
.class-1 .class-name { display:none; }
.class-2 .class-name-2 { display:none; }
</style>

To specify, this would make it so 'meow' only shows up in your first forum, and 'woof' only shows up in your second.

I just inspect element for my forum's ids, because I'm lazy, but that's the basic jist of it? The html loads the same for every individual forum (because Jcink is GROSS and doesn't let you use IF STATEMENTS like PROBOARDS), so it's mostly just a matter of picking and choosing what shows up for what forum, or how different classes display in different forums. o>
last edit on Oct 12, 2019 4:08:25 GMT by pharaoh leap

custom forum row written Oct 12, 2019 4:27:49 GMT via mobile
phantom of the black parade
pronounsshe / her pronouns
4,232written posts
Kuroyaearned bits
offlinecurrently
Kuroya
Part of the Furniture
Kuroya Avatar
at this, the world's end, do we cast off tomorrow~!
leap i'm gonna blow your mind. if statements do work on jcink. i'm mobile so i might not have the exact coding right but i think it's in the format of <script>if('<!-- |forum_id| -->' == '1') { document.write("YOUR CODE HERE") }</script> and then you use the elseif additions to add more. but that way is generally p messy and slow to load since it's loading that script for every single board. i generally prefer to use css and instead use a general class for the board css and then add in an id in the format "board-<!-- |forum_id| -->" since then you can reference that in the css using #board-1 to add in a background color or something (or yknow reference a child element under that id to change something). that way load times are a little faster since i can use scripts to reference smaller bits of code (ie if there's a board description at all) instead of asking it to go through every single board's code for each board on the page and then render one of them twice.

honestly i can pull an example from one of my old skins to show how it works when i'm online, i'm just. about to go to bed oops.
last edit on Oct 12, 2019 4:29:10 GMT by Kuroya

stultifera navis
aliasnines
pronounsshe/her
526written posts
ninelieearned bits
offlinecurrently
ninelie
Part of the Furniture
ninelie Avatar
warming the water for the crown prince's turtle
Kuroya Avatar
leap i'm gonna blow your mind. if statements do work on jcink. i'm mobile so i might not have the exact coding right but i think it's in the format of <script>if('<!-- |forum_id| -->' == '1') { document.write("YOUR CODE HERE") }</script> and then you use the elseif additions to add more. but that way is generally p messy and slow to load since it's loading that script for every single board. i generally prefer to use css and instead use a general class for the board css and then add in an id in the format "board-<!-- |forum_id| -->" since then you can reference that in the css using #board-1 to add in a background color or something (or yknow reference a child element under that id to change something). that way load times are a little faster since i can use scripts to reference smaller bits of code (ie if there's a board description at all) instead of asking it to go through every single board's code for each board on the page and then render one of them twice.

honestly i can pull an example from one of my old skins to show how it works when i'm online, i'm just. about to go to bed oops.
Except if the thread title (or anything that shows up that has a double quote, forum descriptions included) happens to have double quotation in it he. It’ll break the coding and the forum won’t even show up. That was the method I employed for one of Mega’s skins, and that’s how I know this error is a thing.

I would rather play it safe by employing forum variables and playing with visibility elements in the css if it means I can allow members to use double quotes in their topic titles, just as a precaution personally.

edit: mobile posting is hard

double edit: you can tell what id number your forum is by its url, denoted but he number at the end.
last edit on Oct 12, 2019 15:33:59 GMT by ninelie
custom forum row written Oct 12, 2019 16:08:10 GMT via mobile
phantom of the black parade
pronounsshe / her pronouns
4,232written posts
Kuroyaearned bits
offlinecurrently
Kuroya
Part of the Furniture
Kuroya Avatar
at this, the world's end, do we cast off tomorrow~!
ninelie Avatar
Except if the thread title (or anything that shows up that has a double quote, forum descriptions included) happens to have double quotation in it he. It’ll break the coding and the forum won’t even show up. That was the method I employed for one of Mega’s skins, and that’s how I know this error is a thing.

I would rather play it safe by employing forum variables and playing with visibility elements in the css if it means I can allow members to use double quotes in their topic titles, just as a precaution personally.

edit: mobile posting is hard

double edit: you can tell what id number your forum is by its url, denoted but he number at the end.


i mean, you can get around that by switching which quotes you're using where, but then you have the opposite problem.

i still like using if statements for skins - they just work better when it's for small segments of a design (like the list of subboards) over large sections like an entire board, especially since you can't do multiple layers of if statements.

and in the morning uhh. leap the coding is a lil backwards? i'd probably aim more towards something like this

<div class="class-<!-- |forum_id| -->">
<div class="class-name" id="id- 1">meow</div>
<div class="class-name" id="id- 2">woof</div>
</div>

<style>
.class-name { display:none; }
.class-1 #id-1, .class-2 #id-2 { display:block; }
</style>

(obviously i'd pull the style code out and put it into the stylesheets, but that's a bit neater.)

which that's something you can use for doing all individual custom board layouts or just neat little accents or even for different layouts in other templates (i actually use it v heavily for my profiles and mini-profiles). it's less likely to break, like ninelie said, and you can use a similar thing for like. hiding signature codes if they don't exist, for example. but i also just like it because i can come up with entirely different layouts in codepen and convert it over fairly easily with little to no difficulties. (also yep forum number is at the end of the url when you look at it but it's also not a bad idea to use inspect element since membergroup ids are hard to find out any other way).

i'm still mobile so i still don't have actual examples of working code but yeah.
last edit on Oct 12, 2019 16:11:16 GMT by Kuroya

aliasdismay
pronounsshe/her
445written posts
fossaearned bits
offlinecurrently
fossa
Senior Member
fossa Avatar
he's suppose to be DEAD
 

i think you guys are going past the point of what jo was asking about and getting into stuff that is more complicated than she's looking for at the moment.



just to be sure, do you mean a structure like this? where each forum itself is a separate and unique size? if so, leap's example is really good! you basically code it like you would any template, using the class + forum id combo to separate them. the tricky part will just be managing all the sizes together.

unless you mean like this? i don't THINK this is what you meant but i just want 2 double check.
last edit on Oct 13, 2019 16:53:27 GMT by fossa
stultifera navis
aliasnines
pronounsshe/her
526written posts
ninelieearned bits
offlinecurrently
ninelie
Part of the Furniture
ninelie Avatar
warming the water for the crown prince's turtle
fossa Avatar
i think you guys are going past the point of what jo was asking about and getting into stuff that is more complicated than she's looking for at the moment.


I was going to follow up with an actual answer but yesterday was incredibly hectic on my schedule. Thanks for the heads-up, tho.



A similar answer I provided on the community Discord a little while back. Same concept that Leap provided. 

Hide div classes that function as a Forum ID label/container by toggling visibility CSS in your stylesheets. No Javascript/JQuery required, because that's going to tread into deeper layer of complexity especially if you're new to skinning in general.
aliasjo, honey
pronounsfeminine
645written posts
offlinecurrently
honey and the forgor land
Part of the Furniture
honey and the forgor land Avatar
fed up with y'all bitches
m-monkas

i think this answered my question guys. sorry for any confusion but this really clears it up. thank you again!
last edit on Oct 13, 2019 21:29:02 GMT by honey and the forgor land
3,083written posts
Kitten4uearned bits
offlinecurrently
Kitten4u
Part of the Furniture
Kitten4u Avatar
[nospaces]

[attr="class","infoBG"]
[attr="class","infoBG2"]
[attr="class","infoBack"]
[attr="class","infoTitle"][attr="class","fa fa-star-o"] threadarchived
[attr="class","infoDiv"]

[attr="class","infoBody"]

To keep the forum clean and so people know that all threads in certain areas are current and that the OP is likely to still have interest, we archive threads that haven't gotten posts for 2 weeks. This thread is being archived for that reason. If you would like this thread reopened, contact a staff member.