Printable Version of Topic
Click here to view this topic in its original format
Jcink.com Forums > Development News > HTML Templates / Custom Forum Templates


Posted by: John Mar 25 2016, 03:09 PM
HTML Templates

UPDATE: HTML Templates / Custom Forum Templates have gone into beta testing.

QUOTE
We have seen developers do amazing things with JFH and JavaScript.  A well-known available script is https://github.com/ConnorWiseman/jcink-custom-structure by Connor Wiseman.

While this popular 3rd party script has done amazing job for JFH users and we're amazed and even grateful at how much work was put into it all for JFH's benefit, it unfortunately did not come http://forum.jcink.com/index.php?showtopic=24248, some of them beyond control of the original author.

As with many things, while JavaScript is fantastic, certain features are sometimes best done from the server side.

Today, we address that by announcing the development of HTML Templates.

HTML Templates will become a section within the Admin CP for each skin, very similar to Board Wrappers, Macros, and CSS. HTML templates will be editable just like the wrappers and CSS as well.

While we are not allowing the ENTIRE board template scheme to be edited, we are focusing on certain areas of interest that will be possible to reshape. These will include the following when the system is launched:





  • The category head container on the index & single view




  • The forum row layout on the index & sub-forum indexes




  • The topic row layout while in-forum




  • The main profiles layout




  • Board statistics layout




  • Mini Profiles layout (see below)




Rather than struggling with JavaScript and the problems that occur with it, you will have the ability to insert your own custom template directly into an editor in the Admin CP. You'll be able to use system-supported variables such as such as <!-- last_topic --> to get a working link to the last topic of a given forum, and many, many more variables that are impossible to even see via javascript because they are hidden within the system itself.

This system will be reliable and fast - your templates will not break, there will be no quirks - everything will be processed on the system's end. You will be able to export HTML template sets and import them as part of skins themselves. A single template set can be used on multiple different skins as well.

Finally, we are also consolidating templates and will be handling mini-profile HTML templates via this new location as well. Everything you're used to regarding editing mini profile templates will not change, and you can still use the old system, however, we definitely believe that keeping everything all in the same area and doing away with some of the awkwardness of the original MP editor is the best course of action. Mini profiles are much more complex now than when we first setup the editor almost 6 or 7 years ago and it's time to make editing and managing them easier.

Posted by: John Mar 25 2016, 03:09 PM
Important Links and Notes

HTML Template Variables: http://jcink.com/main/wiki/jfh-html-templates
Converting CFS Templates to HTML Templates: http://jcink.com/main/wiki/jfh-converting-cfs-html-templates

Please note, at this time, topic rows are NOT stable and are going to be rewritten. Do not test them / test them at your own risk ,we are not looking for feedback regarding that section right now.

Posted by: RichLord Mar 25 2016, 05:25 PM
Nice development.

Posted by: multiplicity! Mar 25 2016, 05:38 PM
    This is awesome and amazing work. I can't wait for a system that relies on the software itself and not a third party script.

    Just want to put this out there, but if and when you get it totally developed and are ready to test it, I volunteer any site I may have or my coding ability to try it out. I love new things. xD

    Luckily I have a lot of patience, LOL.

    Though I do have a question John. I'm assuming the templates will be editable with custom HTML, like you said, and that will show up everywhere the forum template does? Such as the sub-forums of a forum?

    Will you consider adding a template for custom post layouts, such as what we have here:

Posted by: John Mar 25 2016, 07:03 PM
QUOTE
Will you consider adding a template for custom post layouts, such as what we have here:

Yes. I may not do this for the initial release of this feature; but this will happen as long as it isn't technically difficult.

This system is being designed by me in a way that making a section of the forums templateable will not necessarily be a huge ordeal for 95% of the system. I am thinking ahead.

That being said we will not be enabling HTML templates for the entire forum. I want to keep this system relatively simple by focusing on areas that are mainly the most customized. I would class the in-topic post layout as one of these!

QUOTE
Though I do have a question John. I'm assuming the templates will be editable with custom HTML, like you said, and that will show up everywhere the forum template does? Such as the sub-forums of a forum?

Yes. This is a problem with CFS (I think?) and causes consistency issues. We might add a template called subforum-row though as an option, because there are some significant differences in the template in both areas.

Posted by: Delphi Mar 25 2016, 08:24 PM
I know I for one am very excited for this, I agree with multiplicity! that I volunteer my sites as well for play and manipulation during any testing phases.

I know you get a lot of crap for not having a like system, (http://files.b1.jcink.com/html/emoticons/tongue.gif) I would like this, haha.

Posted by: multiplicity! Mar 25 2016, 08:24 PM
    John, it all sounds wonderful. Thank you for considering the custom post layout.

    Another question.

    Would it be possible to create the templates in such a way that on the topic list view, you can move the sub-forums to below the topic list itself if it has one?

Posted by: John Mar 25 2016, 08:27 PM
Probably not - that would involve something else. That being said I'm not against creating a little hidden div to clip them to with jQuery. Or straight up creating a setting for it...

Posted by: multiplicity! Mar 25 2016, 08:39 PM
    Either one of those would be awesome! ^^

Posted by: owl Mar 25 2016, 09:17 PM
Awesome news; I've been holding out doing much development with CFS (haven't touched it for a few years) waiting for this to come around. Can't wait to get my hands on it and see all the cool stuff people do with it moving forward. I'm already dreaming of stabilized customization and optimizing some of my more specific codes.

Posted by: John Mar 26 2016, 05:33 PM
A very basic custom profile example. More to come as this system develops.

CODE
<div class="tableborder">
<table width='100%' border="0" cellspacing="1" cellpadding="4">
   <tr>
  <td colspan="2" align="center" nowrap="nowrap" class="titlemedium">Viewing Profile</td>
   </tr>
    <tr>
       <td class="row4" align="center" valign="top" style="width: 25%;">
     <span style="font-weight: bold;">
                <a href="http://forum.jcink.com/index.php?showuser=1"><!-- |name| --></a>
               </span>
     <br /><!-- |photo| --><br /><br /><!-- |group_title| -->
    </td>
     <td align="left" class="row2" style="width: 75%;">
 <b>Posts:</b> <!-- |posts| --> <br />
               <b>Active:</b> <!-- |last_activity| --> <br />
               <b>Last Post:</b> <!-- |last_post| --> <br />
  <b>Birthday:</b> <!-- |birthday| --> <br />
 <b>Location:</b> <!-- |location| --> <br />
 </td>
    </tr>
   </table>
   </div><br />

Posted by: John Mar 27 2016, 01:13 PM
I created a wiki page that you will be able to follow and comment on. For starters I have added what I think are definitely the most important variables for all forum-row usage. The other sections will be filled as time progresses with development.

http://jcink.com/main/wiki/jfh-html-templates

Posted by: multiplicity! Mar 27 2016, 04:20 PM
    Question!

    For this string:

    CODE
    <!-- |subforums| -->


    Are you going to remove the Subforums: text so we can add it ourselves if we want?

    Same for this one, as just a list of names with their links?

    CODE
    <!-- |moderator| -->


    For these variables:

    CODE
    <!-- |topics| -->  <!-- |posts| -->


    Is it going to automatically include posts and topics text? Or is it just going to display the numbers?

Posted by: John Mar 27 2016, 04:27 PM
QUOTE
Are you going to remove the Subforums: text so we can add it ourselves if we want?

Same for this one, as just a list of names with their links?

Yes, I am just going to strip it out.

QUOTE
    Is it going to automatically include posts and topics text? Or is it just going to display the numbers?

Numbers. Generally when you see a variable especially a boolean or other numeric, it's rarely going to be something annoying like "Posts: #";

So if it's a numeric we will try to just make it a numeric variable. Otherwise that's just a pain in the ass for developers. (I can only think of very few reasons to include text with the post/topic numeric, and not very good ones heh).

Good questions though, thanks!

Posted by: Black Mar 29 2016, 03:14 PM
Oh good, I'm glad I won't have to keep supporting this any longer.

Not that it's not been an informative adventure, but wheedling through tables within tables within tables and trying to get content read and replaced in a matter of milliseconds, especially on boards with 50+ forums visible on the front page, was not fun.

A pox upon ye for your poor markup writing practices, Matt Mecham. Still, it's not entirely his fault. 2003 was a different time...

Oh well! I've got a final release to make that should be moderately better than what currently exists, and then I guess I'm done. I'll make a note of this upcoming feature the next time I update the project README, if I can get around to updating before this feature goes live.

Posted by: John Mar 29 2016, 06:19 PM
Indeed, that was awful. You did great with what you had to work with. Just time for us to implement this now. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: John Mar 30 2016, 11:06 PM
Development is moving along quite quickly. Here are some Admin CP screenshots. Don't worry if some areas look a little rough; it's still being worked on of course. But this should give you an idea of the template editing area. It's very consistent with what you're all already used to.

Posted by: multiplicity! Mar 31 2016, 02:22 AM
    So the HTML templates will be like another components of skins, and it's possible to have different template styles for different skins?

Posted by: John Mar 31 2016, 12:11 PM
100% correct.

Posted by: owl Mar 31 2016, 04:38 PM
Will this mean that, eventually, we'll be able to include line-breaks in the miniprofile templates?

Posted by: John Mar 31 2016, 04:40 PM
When this is released, the old MP editor will be depreciated. What you're seeing now will be the new location to go to add MP data. The current editor is terrible esp due to the line break stupidity, but it was created at a different time and is hard to change now w/o messing with it. This new system is a much better one that makes sense, and we'll encourage people to move their MP templates over to it, eventually phasing out the old editor.

MPs have evolved far beyond the days where users at the time simply wanted to change the order of a couple things around or add a few divs. So a full editor that permits line breaks is necessary for readability, just like everything else in the Admin CP.

Posted by: VoidPC Apr 1 2016, 01:11 PM
Will there be HTML Templates for mobile mode?

Posted by: John Apr 1 2016, 01:34 PM
Not for initial release. We'll consider it for the future though.

Posted by: Gunblaza Apr 2 2016, 03:21 AM
Avatars for forums? Post layout?

Posted by: John Apr 2 2016, 10:17 AM
Post layout was addressed earlier in the thread. An avatar variable will come along at some point, most difficult thing will be performance checking it rather than putting it in. One will be needed for topic and post rows.

Posted by: GMaster479 Apr 2 2016, 03:36 PM
QUOTE (John @ Apr 2 2016, 10:17 AM)
An avatar variable will come along at some point, most difficult thing will be performance checking it rather than putting it in.


I'm hoping the performance issues are not too bad. This existing for the initial release would be great

Posted by: Kumo Apr 2 2016, 08:38 PM
This is fantastic news John http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: xexes Apr 4 2016, 04:57 PM
I'm super excited for this because it means so much customization! Wow! I see posts every now and then pining for the old AcornRack days and I think this might be a suitable replacement - AND I can see it quickly dominating over webs.com roleplay sites, the ugly step-cousin of forums that came first and stuck around.

Questions!

Will the Custom Forum Templates incorporate Webpage Maker keys? With the Pages keys, there would be so many options available and I feel like it would make it easier to teach and grasp. A forum could now insert their cbox into a page and that page into the Custom Forum Template.

Also, will there be some way to differentiate if a user is logged in or not and/or use a different template for that area like MyBB? This would mean that LogIn/Register would be removed for logged in users and replaced with UCP, etc links. If it's not available, there's going to be a rush for javascript DOM that does this.


Posted by: John Apr 4 2016, 05:17 PM
QUOTE
Will the Custom Forum Templates incorporate Webpage Maker keys? With the Pages keys, there would be so many options available and I feel like it would make it easier to teach and grasp. A forum could now insert their cbox into a page and that page into the Custom Forum Template.


Unfortunately, probably not. If it can be done without a lot of harm to performance, I will look into it, but otherwise this isn't planned.

QUOTE
Also, will there be some way to differentiate if a user is logged in or not and/or use a different template for that area like MyBB? This would mean that LogIn/Register would be removed for logged in users and replaced with UCP, etc links. If it's not available, there's going to be a rush for javascript DOM that does this.


I am planning on trying to add some conditionals for the templates themselves. Something like
<if logged_in> </if> for logged-in material only.
These will probably be experimental.

Posted by: Miss Amy Apr 4 2016, 05:49 PM
Yay!! So much yay! I'm so glad to hear this is going into effect soon.

I heard you mention previously that you wanted to make a converter that would convert current CFS into the HTML templates for skins. Is this still something you plan to do with the development?

Posted by: John Apr 4 2016, 05:53 PM
QUOTE
I heard you mention previously that you wanted to make a converter that would convert current CFS into the HTML templates for skins. Is this still something you plan to do with the development?


Yes. The conversion would be relatively passive. So you could paste a template in the Admin CP, save it, and it would just detect it and convert the CFS variables over to ours. This will also be useful for people who are just used to using CFS vars.

Posted by: Miss Amy Apr 4 2016, 06:15 PM
Sometimes, I really wish I could Like/Love a post here on JCink. Yours is one of them. I'm super stoked to see this getting implemented and am definitely looking forward to putting it to good use!

Posted by: John Apr 4 2016, 11:21 PM
Dev log for the day, made the "Create new template based on" function actually work. Added "board stats" to the template list to edit. Created a way to edit a template's name. This is mainly really boring work and nothing to write home about; just showing that I'm working on it.

The most tedious aspects will be putting together all of the variables and testing things thoroughly. For now I'm just focused on making the module in the Admin CP 100% up to the task.

(These are two screenshots in one, btw, all of this is not on one page)

Posted by: owl Apr 4 2016, 11:41 PM
QUOTE (xexes @ Apr 4 2016, 04:57 PM)
...will there be some way to differentiate if a user is logged in or not and/or use a different template for that area like MyBB? This would mean that LogIn/Register would be removed for logged in users and replaced with UCP, etc links. If it's not available, there's going to be a rush for javascript DOM that does this.


So, this is not what you're asking for, but here's a work-around I use for similar results. I replace:

<body>

With:

<body id="ID<!-- |g_id| -->">

Then I code the site the way I want it to look for logged in members, and go in and recode it for guests when I'm done. You just put #ID2 in front of whatever CSS you want to use just for guest accounts. You probably already know about this method, I just figured I'd offer it posterity.

Posted by: John Apr 5 2016, 09:29 AM
Yep, most are using css for situations like that and it works pretty well (no need for js). However, I would still like to have some basic conditional syntax. If it's crazy complicated to implement <if x then> </if> then I'll scrap the idea for the moment / make it experimental. I would really like to see such things though in the wrappers as well as the templates, so it's on my mind.

Posted by: Crystal Apr 5 2016, 12:22 PM
QUOTE (Miss Amy @ Apr 4 2016, 05:49 PM)
Yay!! So much yay! I'm so glad to hear this is going into effect soon.

I heard you mention previously that you wanted to make a converter that would convert current CFS into the HTML templates for skins. Is this still something you plan to do with the development?


Yes within reason this is still planned on being accomplished but it will take some looking into to determine if it will be able to be done effectively first. If so then that is intended to still be done if there are too many complications then it may not.

Posted by: John Apr 5 2016, 12:27 PM
There might be some variables or elements that won't translate fully. I'm aiming for as much compatibility as possible, if not 100%.

For example:

CODE
 
 $customIndex = array('{{forumMarker}}'  =>'<!-- |img_new_post| -->',
       '{{forumTitle}}'   =>'<!-- |name_url| -->',
       '{{forumViewing}}' =>'<!-- |viewing_forum| -->',
       '{{forumId}}'   =>'<!-- |id| --> ',
       );


Use of those strings will automatically swap it to its JFH version. This is what I have so far. Just so everyone can see how this will work. It's basically simple replacements - as long as the variable is there of course, and if one needs created I will see about doing it.

Posted by: All Perspicacity Apr 7 2016, 05:59 PM
This is fabulous, you're fabulous, I am ecstatic to see this developed.

Posted by: GMaster479 Apr 9 2016, 11:33 AM
QUOTE (John @ Apr 4 2016, 11:21 PM)
This is mainly really boring work and nothing to write home about; just showing that I'm working on it.


Glad to see the updates

QUOTE (John @ Apr 5 2016, 12:27 PM)
CODE
$customIndex = array('{{forumMarker}}'  =>'<!-- |img_new_post| -->',
      '{{forumTitle}}'   =>'<!-- |name_url| -->',
      '{{forumViewing}}' =>'<!-- |viewing_forum| -->',
      [b]'{{forumId}}'   =>'<!-- |id| --> '[/b],
      );


This makes me think that someone who wanted to could do individual designs for each forum row? Is that the case or is that variable just for creating links to the various forums

Posted by: John Apr 9 2016, 11:43 AM
Those are variable aliases.

{{forumTitle}} is a CFS variable. It will reference our own <!-- |name_url| --> when used. I'll be expanding this list as development continues.

http://jcink.com/main/wiki/jfh-html-templates

If you wanted to, you could have individual designs for each forum row using javascript. There are a couple of clever and clean ways to do this. Though that is a different topic for discussion.

Posted by: GMaster479 Apr 9 2016, 11:49 AM
QUOTE (John @ Apr 9 2016, 11:43 AM)
Those are variable aliases.

{{forumTitle}} is a CFS variable. It will reference our own <!-- |name_url| --> when used. I'll be expanding this list as development continues.

http://jcink.com/main/wiki/jfh-html-templates

If you wanted to, you could have individual designs for each forum row using javascript. There are a couple of clever and clean ways to do this. Though that is a different topic for discussion.


That sounds good. I can finally replace (and by that I mean Gun can finally replace) the current forum template thing in Shift UI. Just one thing with the variables though:

Can you change <!-- |posts| --> to <!-- |replies| --> and turn <!-- |posts| --> Into something that adds Topics and Replies together?

Posted by: John Apr 9 2016, 11:55 AM
Sure why not. The variable listing won't be finalized until after beta testing is over, so I am planning on having to change and add variables anyway. Whatever you see me do is not necessarily set in stone. Those variables were largely pulled from the system itself.

Posted by: GMaster479 Apr 9 2016, 12:14 PM
QUOTE (John @ Apr 9 2016, 11:55 AM)
Sure why not. The variable listing won't be finalized until after beta testing is over, so I am planning on having to change and add variables anyway. Whatever you see me do is not necessarily set in stone. Those variables were largely pulled from the system itself.


Thanks. Currently I have to do it where it is {topics - - replies} for Shift's system to get topics and posts to add together and even then I can't use a comma to separate big numbers. This will hopefully fix that.

Posted by: SnugglyDuckling Apr 13 2016, 03:24 PM
I've mentioned that I cannot wait for this ... I really can't! I've struggled with trying to understand how Black's CFS works, so I'm really hoping this isn't as big of a struggle for me.

Posted by: John Apr 13 2016, 03:39 PM
I don't know if it's going to be easier to understand per say -- you're still going to need to learn how to work with variables (not hard). But by not having to deal with the javascript and with clearly defined sections in the Admin CP for each template, it obviously helps a lot. And you'll be able to use line breaks to make the code look cleaner, and won't have to do any escaping, which is always a plus.

It's always smoother and easier to use when something like this is just integrated. Just understand how variables work and you're good to go.

Posted by: multiplicity! Apr 15 2016, 06:49 PM
    Would you consider making separate variables for topics and posts the way they are now, and adding one like replies? Because I like the variables we have more than simply adding them together. Having separate counts is handy for me.

Posted by: John Apr 15 2016, 07:11 PM
Sorry I thought I explained it that I wouldn't get rid of the topics and replies counts. If I removed topics and replies variables and just made a total count it wouldn't make much sense. The total account will be a third variable. The naming will change is all. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: GMaster479 Apr 19 2016, 09:20 PM
Yeah that's what I am looking for. A third variable. Any status updates on this?

Posted by: John Apr 19 2016, 09:24 PM
That feature specifically or HTML templates in general?

I am still working on everything and will post status updates from time to time, but I have nothing new to share at this time.

Posted by: GMaster479 Apr 20 2016, 05:36 PM
Both and okay. Finals need to get over with faster

Posted by: John Apr 20 2016, 11:15 PM
Ok, I've edited the variable list for the wiki and made changes to it:

http://jcink.com/main/wiki/jfh-html-templates#forum_rows_index_sub-forums

Additonally, I have mapped the variables from the wiki to these CFS variables:

CODE
 $customIndex = array('{{forumMarker}}'   =>'<!-- |img_new_post| -->',
       '{{forumTitle}}'    =>'<!-- |name| -->',
       '{{forumViewing}}'  =>'<!-- |viewing_forum| -->',
       '{{forumId}}'    =>'<!-- |forum_id| -->',
       '{{forumDescription}}' =>'<!-- |description| -->',
       '{{subforums}}'   =>'<!-- |subforums| -->',
       '{{moderators}}'   =>'<!-- |moderators| -->',
       '{{topicCount}}'   =>'<!-- |topics| -->',
       '{{replyCount}}'   =>'<!-- |replies| -->',
       '{{redirectHits}}'  =>'<!-- |redirect_hits| -->',
       '{{lastPostDate}}'  =>'<!-- |last_post| -->',
       '{{lastPostTitle}}'  =>'<!-- |last_topic| -->',
       '{{lastPostURL}}'   =>'<!-- |last_topic_url| -->',
       '{{lastPostAuthor}}'  =>'<!-- |last_poster| -->',
       
       '{%marker}' => '<!-- |img_new_post| -->',
       '{%link}'   => '<!-- |name| -->',
       '{%id}'   => '<!-- |forum_id| -->',
       '{%description}' => '<!-- |description| -->',
       '{%moderators}' => '<!-- |moderators| -->',
       '{%subforums}' => '<!-- |subforums| -->',
       '{%topics}' => '<!-- |topics| -->',
       '{%replies}' => '<!-- |replies| -->',
       '{%lp-date}' => '<!-- |last_post| -->',
       '{%lp-title}' => '<!-- |last_topic| -->',
       '{%lp-title#link}' => '<!-- |last_topic_url| -->',
       '{%lp-author}' => '<!-- |last_poster| -->',
       );


This should make porting CFS stuff to JFH templates very simple. I'm supporting both the old AND new version's variables because I realize a lot of people are using them. The variables will be converted upon editing via Admin CP; we want users to learn the new stuff and not have to add these aliases on the front-end http://files.b1.jcink.com/html/emoticons/smile.gif

My next goals are the topic rows and board stats. The board index stuff is actually done now.

Posted by: wallflower Apr 21 2016, 01:43 PM
i have one question. it says this in your first post
QUOTE
While we are not allowing the ENTIRE board template scheme to be edited, we are focusing on certain areas of interest that will be possible to reshape.


what is it that you're not including in this? so far it seems to be that you're planning to give us the exact same powers the CFS currently gives us, only in board rather than a third-party coding. maybe i'm missing something?

Posted by: John Apr 21 2016, 02:31 PM
"Entire board template" in this context would mean giving complete and total access to templates across the whole board.

UserCP, ModCP, PM system to name a few. These are areas that we COULD provide template options for, but we're not -- at least not right now. We aren't unlocking total template editing for every single area in the system is what I'm saying -- just the core areas that CFS has provided to everyone thus far. That's basically what CFS does; gives you a few major sections that you can edit.

These are the most important and highly sought after locations to modify, so we think most users will be happy with that.

I hope that makes sense.

Posted by: wallflower Apr 21 2016, 02:34 PM
yes it does! thank you for elaborating!!

Posted by: John Apr 23 2016, 12:58 AM
Board statistics variables are up, but I have not completed the CFS aliases yet. All of these variables work though.

http://jcink.com/main/wiki/jfh-html-templates#board_statistics

I primarily worked on the Admin CP. I'd like to get the Admin CP module "complete" enough to move this to start pushing my updates to the actual system. I'd like to accomplish this by the end of Monday, you might see "HTML templates" as a section in the ACP that isn't available yet http://files.b1.jcink.com/html/emoticons/tongue.gif (Yes, this means we're getting close to having a beta here, BUT the next 2-3 weeks will also be busy for me so we'll see about that.)

Posted by: Bugsy Apr 24 2016, 12:52 PM
I'm so excited to see progress on this!! I'm looking forward to being able to put this to use, so please keep up the hard work! Remember to break for food and sleep, though! I know how it can get when you're really on a roll coding.

Posted by: Delphi Apr 25 2016, 07:09 PM
Is it possible to add custom fields as wrapper elements while doing this? Or is this an entirely separate issue?

Also: What Bugsy said!!! http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: John Apr 25 2016, 07:23 PM
QUOTE
Is it possible to add custom fields as wrapper elements while doing this? Or is this an entirely separate issue?

Separate issue, sorry.

Posted by: BeyondJaded Apr 25 2016, 07:52 PM
Probably a shot in the dark, but... would it be possible to eventually make it so that you can have two (or more) different forum styles able to be used at the same time on a single page/layout?

Like, Oh Forum A & B have one html template.
The next Row of C & D has a completely different and separate div ids & css from that one.

Not sure how it could be implemented at this stage of the game, but that's something I've always wanted to do so I could have less chaos in my css stylesheets.




Posted by: Delphi Apr 25 2016, 07:55 PM
QUOTE (John @ Apr 25 2016, 07:23 PM)
QUOTE
Is it possible to add custom fields as wrapper elements while doing this? Or is this an entirely separate issue?

Separate issue, sorry.


Thank you for the amazingly prompt response as always regardless, <3

Posted by: John Apr 25 2016, 08:00 PM
QUOTE (BeyondJaded @ Apr 25 2016, 07:52 PM)
Probably a shot in the dark, but...  would it be possible to eventually make it so that you can have two (or more) different forum styles able to be used at the same time on a single page/layout?

Like, Oh Forum A & B  have one html template.
The next Row of C & D has a completely different and separate div ids & css from that one.

Not sure how it could be implemented at this stage of the game, but that's something I've always wanted to do so I could have less chaos in my css stylesheets.


You're talking about giving each forum row itself its own HTML templayte?

What you're asking is doable, I think, with this system and some javascript mixed in, but it depends on exactly what you mean.

If you wanted all forums to have their own unique identifier, that would be accomplished by wrapping them in a div like:

CODE
<div id='forum-row-<!-- |forum_id| -->'> (contents) </div>


Now every forum is identifiable by its ID. If you want forum "A" with an ID of 32, and "B" with an ID of 33 to use a certain style, then you'd simply use a little js magic to make it work. A conditional will help you as well.

Let me know if this answers your question BeyondJaded

Posted by: BeyondJaded Apr 25 2016, 08:17 PM
Yep!

That could work. Or even just doing it based on the category it falls under, really.

Basically, for RP, I love having Out of Character sections on the main page look completely different than say in character sections. You can already do it to a point, I just found it a bit tedious when I was trying to mess with it using Black's CFS.

But also doing it per forum or forum row would also allow for even more ways to make a board look different. And if that's the way it works, that would be really cool and easy peasy.

Posted by: John Apr 25 2016, 08:37 PM
Oh, so basically you have entire categories of forums / sections using a different HTML template. I have a good idea to help you handle this. I'll try to throw in the cat_id variable if possible. This way, you will be able to do some conditionals for your categories directly in the template.

Something like, for example, if your OOC forum is in category ID #2:

CODE
<script>if('<!-- |cat_id| -->' == 2) {
document.write("forum template for OOC category");
} else {
document.write("standard template");
} </script>


Add elseif { } conditionals for additional custom category ID based forum row HTML templates. Is it using javascript, which I bashed a bit in the first post? Yes, but it's minimal and will be very quick and efficient.

BeyondJaded makes sense/simple?

Posted by: BeyondJaded Apr 25 2016, 08:40 PM
Yessum!

I will definitely be trying this out.

Thanks John!

Posted by: John Apr 25 2016, 08:49 PM
BeyondJaded, I am working on the system right now and just added cat_id.

http://jcink.com/main/wiki/jfh-html-templates#jcink_forum_hostinghtml_template_variables

CODE
<script>if('<!-- |cat_id| -->' == '11') {
document.write("<div class='row2'>( <!-- |name| --> ) using forum template for jfh support category only</div>");
} else {
document.write("<div class='row2'>( <!-- |name| --> ) - using standard template</div>");
} </script>


Produced the following image on my dev board.

Posted by: BeyondJaded Apr 25 2016, 10:25 PM
Bah, that's awesome!!!

Where is the like button when I need it?

Posted by: John Apr 25 2016, 10:40 PM
QUOTE (BeyondJaded @ Apr 25 2016, 10:25 PM)
Where is the like button when I need it?


http://files.b1.jcink.com/html/emoticons/ph34r.gif

Posted by: John Apr 26 2016, 01:44 AM
user posted image


After lots of testing, I moved a lot of the development code over to the system source. I'll be working on both this board to show things to you all:

http://templates.jcink.net/index.php

Once I get some more sections done, this will allow it to go into beta testing much quicker. No beta sign ups yet! Just showing that this is getting closer.

You'll also notice "html templates" is now available in the Admin CP, but it's not usable w/o me unlocking it.

You're all better at making templates than I am, I'm sure when this is released to beta testers you'll see more impressive things...

Posted by: multiplicity! Apr 26 2016, 04:50 AM
    John

    I look forward to it! Keep up the good work! http://files.b1.jcink.com/html/emoticons/biggrin.gif

Posted by: Bugsy Apr 26 2016, 08:56 AM
user posted image


That about sums it up. This is freaking awesome. Thanks again! I know I say it a lot, but you're doing a pretty awesome job here!

Posted by: GMaster479 Apr 26 2016, 12:12 PM
So thrilled for this. Please tag me when beta testing starts. You should probably design some default templates and have them on the wiki when you release this too.

Posted by: John Apr 26 2016, 12:19 PM
There will be a way to create a populated default template set.

Posted by: CamilleNicole Apr 26 2016, 09:21 PM
I find the custom structure script to be a pain 99.9% of the time so I'd love to help test this out.

Posted by: John Apr 26 2016, 09:31 PM
Noted! And agreed. This is going to be a game changing feature for JFH.

Posted by: John Apr 27 2016, 06:43 PM
The board stats stuff is finished. I'm moving onward to profiles now!

After profiles I will do topic rows, and mini profiles. Then, depending on how I feel, this will go beta.

Posted by: multiplicity! Apr 27 2016, 08:36 PM
    Excellent news John!

    Can't wait. ^^

Posted by: GMaster479 Apr 27 2016, 11:36 PM
QUOTE (multiplicity! @ Apr 27 2016, 08:36 PM)
    Excellent news John!

    Can't wait. ^^

^^^

Posted by: bonbon Apr 28 2016, 06:27 AM
Will we be able to have different profile styles based on membergroup?

Posted by: Crystal Apr 28 2016, 08:11 AM
QUOTE (GMaster479 @ Apr 26 2016, 12:12 PM)
So thrilled for this. Please tag me when beta testing starts. You should probably design some default templates and have them on the wiki when you release this too.


The default templates would be the normal appearance the forums take now with no template system in place.

We do not intend to change the original forum appearance, but will have full documentation in the Wiki when this goes Beta to enable the testers and then all users on final release easy access to explanations and tutorials on this. Because while some people have been using the CFS script we know others have not and will need a bit more guidance on how to structure things.

In addition we will be releasing pre-made structure designs as well as skins in the future when we have more time this Summer to work on the redevelopment of the Resource Forum. As we have many things we wish to do there to assist with these releases and have had very little time to work on those things this year.

Posted by: John Apr 28 2016, 09:51 AM
QUOTE (bonbon @ Apr 28 2016, 06:27 AM)
Will we be able to have different profile styles based on membergroup?

Since you can use conditional statements, yes.

Posted by: John Apr 28 2016, 09:58 AM
QUOTE (Crystal @ Apr 28 2016, 08:11 AM)
QUOTE (GMaster479 @ Apr 26 2016, 12:12 PM)
So thrilled for this. Please tag me when beta testing starts. You should probably design some default templates and have them on the wiki when you release this too.

The default templates would be the normal appearance the forums take now with no templating system in place.


To add to this, it hasn't been said at all yet, but the HTML Template system works like this:

1. You create a new set of HTML templates.

2. Any HTML template left blank automatically defaults to the system's core.

3. So if you edit forum rows for example, then the only template that changes is the forum rows because the rest are left blank. You don't need to edit the rest of the templates and insert the default.

This is convenient for everyone because it means you do not need to fill in all of the blank areas with the "default" template, and it's convenient for for myself as a developer. It means I can add new template options in the future and simply check if they're blank or not as an indicator.

A set of the default HTML Templates will be provided as a base to work on, learn, and understand, but won't be necessary to use at all. Hopefully this makes sense, I think it's super easy to just auto default to our template when left blank.

Posted by: mnikolic Apr 28 2016, 01:19 PM
Agreed and I'd like to sign up for beta testing for this. http://files.b1.jcink.com/html/emoticons/biggrin.gif

I have a new RPG forum coming up and I'm waiting for this to be released.

Posted by: GMaster479 Apr 28 2016, 04:14 PM
QUOTE (John @ Apr 28 2016, 09:58 AM)
QUOTE (Crystal @ Apr 28 2016, 08:11 AM)
QUOTE (GMaster479 @ Apr 26 2016, 12:12 PM)
So thrilled for this. Please tag me when beta testing starts. You should probably design some default templates and have them on the wiki when you release this too.

The default templates would be the normal appearance the forums take now with no templating system in place.


To add to this, it hasn't been said at all yet, but the HTML Template system works like this:

1. You create a new set of HTML templates.

2. Any HTML template left blank automatically defaults to the system's core.

3. So if you edit forum rows for example, then the only template that changes is the forum rows because the rest are left blank. You don't need to edit the rest of the templates and insert the default.

This is convenient for everyone because it means you do not need to fill in all of the blank areas with the "default" template, and it's convenient for for myself as a developer. It means I can add new template options in the future and simply check if they're blank or not as an indicator.

A set of the default HTML Templates will be provided as a base to work on, learn, and understand, but won't be necessary to use at all. Hopefully this makes sense, I think it's super easy to just auto default to our template when left blank.


I like that. It makes sense and makes it a heck of a lot easier. I think what Crystal said is closer to what I was looking for. I wasn't looking for default templates but more like example templates that people can grab from the Wiki. For example for forum rows you could post the template for the RPG site and a template that mimics IPB 4.x or vBulletin. That way people can edit from there instead of editing from scratch.

Posted by: John Apr 28 2016, 05:10 PM
Oh, okay, that makes sense. She understood you better than I did then. http://files.b1.jcink.com/html/emoticons/laugh.gif

Posted by: Crystal Apr 28 2016, 09:12 PM
QUOTE (GMaster479 @ Apr 28 2016, 04:14 PM)


I like that. It makes sense and makes it a heck of a lot easier. I think what Crystal said is closer to what I was looking for. I wasn't looking for default templates but more like example templates that people can grab from the Wiki. For example for forum rows you could post the template for the RPG site and a template that mimics IPB 4.x or vBulletin. That way people can edit from there instead of editing from scratch.


Yes we intend to have default and possibly some sort of importer the way we have the skin importer in the future, but those are all future developments.

We also plan on redoing the Resource Forum and everything and adding more developed codes and examples as well as templates to it. Which pretty much kind of covers what you were looking for. This Summer a lot more development will be occurring than has been for a bit since John and I will both have more time to devote to it than we have recently due to our academics.

Posted by: John Apr 28 2016, 09:26 PM
QUOTE
Yes we intend to have default and possibly some sort of importer the way we have the skin importer in the future, but those are all future developments.


I didn't say anything yet about this but I got this covered! These will be import/exportable into xml files, just like all other skin assets. http://files.b1.jcink.com/html/emoticons/biggrin.gif As for a general template importer like the skin importer, that could be interesting as well.

Posted by: GMaster479 Apr 28 2016, 10:02 PM
All good things. I can't wait to get this in beta so I can take out all the code I use to do this already.

Posted by: CamilleNicole Apr 28 2016, 10:30 PM
I mostly want this so I can hide certain profile fields from being edited since my rpg will have some certain systems that I don't want people to cheat in order to get out of using.

Posted by: John Apr 28 2016, 10:36 PM
It's already possible to do that by hiding the fields from the UserCP, albiet with css and not the most secure method. However, the HTML templates won't really make much difference regarding this unless I'm missing something.

Posted by: multiplicity! Apr 28 2016, 11:06 PM
    John, in response to the importer/exporter, is it possible to have the option to not include certain pieces of a skin (templates, css, etc.) so when we export we don't have to have all of them? That way if we want to export certain pieces to upload, and then don't have to wade through others we can do that?

    If that is a separate feature request totally get it, but just wanted to ask. ^^;;

Posted by: John Apr 28 2016, 11:13 PM
I will probably have to make that an option in the skin sets area. Since I do understand that sometimes you won't want to export all elements. That is probably something I will look into after release.

As it is now though each skin asset can be exported, but you just can't choose to export more than one, but leave some out.

Posted by: John Apr 30 2016, 08:37 PM
Profiles are actually almost done, this is a profile template example on my dev board is by someone named 'hannah' on shine that I just copied and pasted to see how well the conversion would work with a random wild template.

Almost spot on, except for the custom profile fields which will unfortunately need to be manually reassigned. I will tweak it further since some variables need assigned.

http://templates.jcink.net/index.php?showuser=1

Also, finally comments and some other elements will be workable. Note the following: it returns JSON encoded arrays of visitors, comments, etc. I will be adding more variables than this as well.

http://jcink.com/main/wiki/jfh-html-templates#main_profiles

Really excited to finish this up and then move on to topic row templates. Once I do that, I am going to ask for beta testers with what's there. The last part before 'final' release will be the mini profiles, but that is least critical right now.

Posted by: multiplicity! May 1 2016, 04:03 AM
    On the custom profile, could you include a key for the personal photo that doesn't include the img tag? That way people can use the personal photo in CSS or inline styling, or something like that.

    It's looking amazing so far though! I can't wait to see what you come up with for the topic rows, and then yay for beta testing!

Posted by: Gunblaza May 1 2016, 11:01 AM
Will there be uniform time stamps in the comments, topics and post JSON? For example say.. I wanted to make a timeline of all the events into one area, it would be able to sort by time and information would "blend" properly.

Posted by: John May 1 2016, 02:23 PM
There will be both processed time and timestamps included in the json.

QUOTE
On the custom profile, could you include a key for the personal photo that doesn't include the img tag?


Yes. I suspect we will have a lot of variables to 'break down' like that. I'll also provide the avatar as a URL too. They will be photo_url and avatar_url. You can sort of see that I did this for the forum rows; ex instead of just <!-- |name| --> as a complete name + url tag, there's one with just the url, just the forum's name.

If you don't see something that you need broken-down during beta testing or even general development, requesting and adding variables is very easy for me to do the way I have designed this. I expect that I will be adding variables every so often.

Posted by: multiplicity! May 1 2016, 03:41 PM
QUOTE (John @ May 1 2016, 12:23 PM)
There will be both processed time and timestamps included in the json.

QUOTE
On the custom profile, could you include a key for the personal photo that doesn't include the img tag?


Yes. I suspect we will have a lot of variables to 'break down' like that. I'll also provide the avatar as a URL too. They will be photo_url and avatar_url. You can sort of see that I did this for the forum rows; ex instead of just <!-- |name| --> as a complete name + url tag, there's one with just the url, just the forum's name.

If you don't see something that you need broken-down during beta testing or even general development, requesting and adding variables is very easy for me to do the way I have designed this. I expect that I will be adding variables every so often.

    This sounds amazing and I'm sure there are a lot of people who would really enjoy having the variables broken down, even if requested over time. http://files.b1.jcink.com/html/emoticons/biggrin.gif Makes coding things and creating new and exotic templates much much easier.

Posted by: John May 1 2016, 03:45 PM
At the moment I am translating a lot of CFS variables and their results to provide simple and quick backward compatibility for people to port their designs over with minimal effort. I will hopefully be able to help those who are less HTML-savvy move away from CFS with this design decision.

As I've said before I do appreciate everything Black did with CFS but it's become a problem regarding giving support. It does its job too well! But when it breaks I can't fix it, and when the host for it goes down, we get a flood of "What's going on with JCINK." Hopefully users will see how easy it is with the efforts I'm making and switch over. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: GMaster479 May 5 2016, 05:21 PM
Only because I love making your job even more difficult, is there a way to get a variable to have the avatar of whoever made the last post in the forum show up? I know you have to look at server load time and such but if it can work it would be great to throw it in now while you're tearing everything up.

Posted by: John May 5 2016, 05:46 PM
QUOTE (GMaster479 @ May 5 2016, 05:21 PM)
Only because I love making your job even more difficult, is there a way to get a variable to have the avatar of whoever made the last post in the forum show up? I know you have to look at server load time and such but if it can work it would be great to throw it in now while you're tearing everything up.

Not for initial release. The original issue regarding that still stands, so I will not be throwing it in. This would be something to squeeze in later on or at the end of everything.

Posted by: owl May 6 2016, 12:50 PM
Are custom profile fields going to be available to use in wrappers? Even allowing a limited amount of these to be used this way would allow for an exciting amount of customization. I'm already sitting here, daydreaming of condensing my skins into one finely coded skin that allows for members to go within their profile and use their settings to customize their experience - particularly when usability is concerned for some of my members. Double all that if there becomes some way we can have a fall-back if someone leaves a field blank.

Posted by: John May 6 2016, 02:55 PM
That's a separate thing from the HTML templates, but I am looking into it.

Fields will, of course, be accessible in the profile html template for sure.

Posted by: BeyondJaded May 6 2016, 04:58 PM
One variable I would love to see is the variable for the user's awards. That was one that I missed being able to be implemented in CFS.

Posted by: John May 6 2016, 04:59 PM
CFS does not have any award variables AFAIK that aren't mini profile based?

Posted by: BeyondJaded May 6 2016, 05:02 PM
You could implement it on the miniprofile but not on the user's profile page other than a link to the listing.

Posted by: John May 6 2016, 05:02 PM
Gotcha.

The reason for that is because the profiles as they are do not display awards Not their fault. But it would not be hard to make a variable for it.

Posted by: xo Lola May 7 2016, 12:52 AM
I know you touched briefly on customising mini profiles per usergroup, will you add documentation on how to do that into the wiki, when you get to that point?

I just don't want anything too bulky in my codes. I'm a messy coder, and having to look at my messy af codes for too long gives me anxiety lmao

Posted by: John May 7 2016, 07:46 AM
Absolutely.

Posted by: John May 7 2016, 09:08 AM
Alright I have something new today that isn't in CFS

Preseting: category header templates.

Wiki Variables:

http://jcink.com/main/wiki/jfh-html-templates#category_headers_index_single_categories

Example Template:

CODE
<div class="tableborder category" id="cat-<!-- |cat_id| -->">
 <div class='maintitle<!-- |collapsed_class| -->' align='left'>
<span style='float:right;'><a href='#' onclick='catcollapse("<!-- |cat_id| -->");return false;' id='main_<!-- |cat_id| -->'><!-- |collapse_img| --></a>&nbsp;&nbsp;</span>
<{CAT_IMG}><a href="index.php?c=<!-- |cat_id| -->"><!-- |cat_name| --></a></div>
<div id='cat_<!-- |cat_id| -->' style="<!-- |collapsed_style| -->">
     <table width="100%" border="0" cellspacing="1" cellpadding="4">
       <tr class='forum-subheader'>
         <th align="center" width="2%" class='titlemedium'></th>
         <th align="left" width="59%" class='titlemedium'>{$ibforums->lang['cat_name']}</th>
         <th align="center" width="7%" class='titlemedium'>Topics</th>
         <th align="center" width="7%" class='titlemedium'>Replies</th>
         <th align="left" width="25%" class='titlemedium'>Last Post Info</th>
       </tr>
<% FORUM_ROWS %>
<tr>
         <td class='darkrow2' colspan="5">&nbsp;</td>
       </tr>
     </table>
</div>
</div>
<br class='cat-lb' />


So not just the forum rows are customizable, but the per-category headers/containers http://files.b1.jcink.com/html/emoticons/biggrin.gif

Posted by: Delphi May 7 2016, 06:16 PM
Oooo!!! I like this!! I am remodeling my site just in time to coincide (hopefully) with some of this! Literally itching to get started /wiggle wiggle wiggle.

Posted by: Bugsy May 7 2016, 08:19 PM
I am soo excited to see this making constant progress, and as always you are going above and beyond. This is going to open so many opportunities to provide a completely customized skin without having to deal with the glitches of CFS. I mean, I love the customized experience, and I appreciate all of the hard work that Black put into that script, but I'm also chomping at the bit for this to be a Beta release because it just means you're one step closer to completion.

Posted by: FaeNet May 8 2016, 01:54 AM
I am so excited for this. As a newly budding site, I really think that this increase of customization could really help bring new members in! http://files.b1.jcink.com/html/emoticons/biggrin.gif

Do you have a release date estimation?

Posted by: GMaster479 May 8 2016, 08:39 AM
QUOTE (FaeNet @ May 8 2016, 01:54 AM)
I am so excited for this. As a newly budding site, I really think that this increase of customization could really help bring new members in!  http://files.b1.jcink.com/html/emoticons/biggrin.gif

Do you have a release date estimation?

He never gives a release date out but based on his updates and such I think before the end of June

Posted by: John May 8 2016, 10:18 AM
Don't know how much I'll be getting done over the next few days as I'll be traveling but I would like to go beta in 2 weeks from now. There is probably not going to be a whole lot to beta test in a sense that this won't cause instability; bugs will mainly be limited to a variable not lining up correctly or a CFS conversion gone wrong / something like that. So I would expect there to be a swift beta also.

Posted by: poptart May 9 2016, 12:40 PM
Ahh!!! This new feature makes me quite excited, I love CFS but like many have said, it has it little bugs but still use it for all my skinning. Now Black can take a break and I am very much looking forward to test this out. Thanks for adding this John!

Posted by: John May 9 2016, 12:44 PM
Indeed! I believe Black is moving on and no longer has interest in this anyway, so it all works out.

Posted by: RichLord May 9 2016, 04:27 PM
Wating for the beta version.

Posted by: owl May 9 2016, 04:39 PM
QUOTE (John @ May 6 2016, 02:55 PM)
That's a separate thing from the HTML templates, but I am looking into it.

Fields will, of course, be accessible in the profile html template for sure.


I appreciate that - I know that, personally, I'm day dreaming about being able to have one skin, and to use custom profile fields to let people adjust it with some clever coding, so that's probably why they're so married in my mind. Even the ability to pick a limited amount of profile fields that would be used board wide would be phenomenal. Even with like five fields I could: make the font bigger for certain users, move / hide the cbox according to preference, offer different colour schemes, offer dyslexic friendly font options, let people put navigation where they prefer it - all without complicated and sometimes conflicted Javascript.

That being said, I know it's asking a lot but I was wondering if you would ever give us the ability to edit the template for the registration. I know it would be really helpful for less conventional sites, or even just sites where they want to really clearly explain their registration process to cut down on common issues people might have when joining up. This biggest downside I see to this is people potentially messing it up, but I think that's a gamble when letting people have template access in general.

Posted by: John May 9 2016, 05:09 PM
QUOTE
That being said, I know it's asking a lot but I was wondering if you would ever give us the ability to edit the template for the registration.

Possibly! http://files.b1.jcink.com/html/emoticons/smile.gif Not for initial release though.

Posted by: Gunblaza May 9 2016, 05:23 PM
QUOTE (John @ May 7 2016, 10:08 AM)
Alright I have something new today that isn't in CFS

Preseting: category header templates.

Wiki Variables:

http://jcink.com/main/wiki/jfh-html-templates#category_headers_index_single_categories

Example Template:


So not just the forum rows are customizable, but the per-category headers/containers http://files.b1.jcink.com/html/emoticons/biggrin.gif


Includes subforums?

Posted by: John May 9 2016, 05:24 PM
QUOTE (Gunblaza @ May 9 2016, 05:23 PM)
QUOTE (John @ May 7 2016, 10:08 AM)
Alright I have something new today that isn't in CFS

Preseting: category header templates.

Wiki Variables:

http://jcink.com/main/wiki/jfh-html-templates#category_headers_index_single_categories

Example Template:


So not just the forum rows are customizable, but the per-category headers/containers http://files.b1.jcink.com/html/emoticons/biggrin.gif


Includes subforums?


No. Subforums don't really have category headers because they aren't categories. They just have the forums/topics/posts template with a div wrap around.

Posted by: owl May 9 2016, 06:11 PM
QUOTE (John @ May 9 2016, 05:09 PM)

Possibly! http://files.b1.jcink.com/html/emoticons/smile.gif Not for initial release though.


Something else to look forward to, then! Here's something else I was wondering about, though, quickly: When you mention consolidating the mini-profile template, have you considered just moving that all into a post template we can edit? It seems like they would probably interact with one another a lot, as we see in a lot of sites currently using CFS. I don't know if it's part of the most recent version of CFS yet, but a lot of trendy sites I've seen lately have really interestingly designed post pages, and on top of that it would eliminate some complicated custom BBcode people use to decorate their posts on RP sites.

I just feel like it's used enough now that people will use it as an excuse to hang on to CFS.

Posted by: John May 9 2016, 06:26 PM
QUOTE
Something else to look forward to, then! Here's something else I was wondering about, though, quickly: When you mention consolidating the mini-profile template, have you considered just moving that all into a post template we can edit?

No, I think those should be separate entities.

While they do interact with each other there is value in keeping split templates if not simply for drop-in compatibility reasons with old premade templates w/o the need to bring an entire post template along with it alone.

Post row templates and mp templates will be separate editable sections. I'll be going beta without the post template editor and maybe mp template editor, though. I do not want users hanging onto cfs so the post template will be top priority after those are done.

Posted by: poptart May 10 2016, 01:14 PM
I was meaning to ask but forget, regarding the sub-forums, the (,) that separates each and everyone in the main boards, will we be able to customize them? Or change them? I usually like separating my sub-forums with a ( • ) rather than commas and I'm able to easily do this with CFS or will we have to use a script to do this?

Posted by: jam455 May 11 2016, 10:38 AM
quick question!
so for the main user profiles, not the mini profiles, but the one you're directed to when you click someone's username. would we possibly be able to allow individual members to edit the css/html of their OWN profile? it'd be nice to be able to create a default for them that looks good and clean, but it'd also be sweet if they were able to add templates of their own to their profiles to make them look how they'd like. similar to how they use templates for posts.

Posted by: John May 11 2016, 11:41 AM
QUOTE (poptart @ May 10 2016, 01:14 PM)
I was meaning to ask but forget, regarding the sub-forums, the (,) that separates each and everyone in the main boards, will we be able to customize them? Or change them? I usually like separating my sub-forums with a ( • ) rather than commas and I'm able to easily do this with CFS or will we have to use a script to do this?


honestly it should be a macro of sorts. I will probably make it one, thanks for bringing it up.

Posted by: John May 11 2016, 11:43 AM
QUOTE (jam455 @ May 11 2016, 10:38 AM)
quick question!
so for the main user profiles, not the mini profiles, but the one you're directed to when you click someone's username. would we possibly be able to allow individual members to edit the css/html of their OWN profile? it'd be nice to be able to create a default for them that looks good and clean, but it'd also be sweet if they were able to add templates of their own to their profiles to make them look how they'd like. similar to how they use templates for posts.


No. That's an another feature entirely. But, since I'm competing this system, there is potential to tap into it for this purpose if this is something people really want.

Posted by: GMaster479 May 11 2016, 04:01 PM
QUOTE (John @ May 11 2016, 11:43 AM)
QUOTE (jam455 @ May 11 2016, 10:38 AM)
quick question!
so for the main user profiles, not the mini profiles, but the one you're directed to when you click someone's username. would we possibly be able to allow individual members to edit the css/html of their OWN profile? it'd be nice to be able to create a default for them that looks good and clean, but it'd also be sweet if they were able to add templates of their own to their profiles to make them look how they'd like. similar to how they use templates for posts.


No. That's an another feature entirely. But, since I'm competing this system, there is potential to tap into it for this purpose if this is something people really want.


I think this would be possible with a code and what you put in the template. If I'm not mistaken, just how people can currently use if/and statement for mini profiles now, you can now use code statements to make different groups have different templates. Granted it will be a giant coding mess at some point depending on how far you go especially considering this template will probably have a lot more in it. At least this gives you the option for now...I think http://files.b1.jcink.com/html/emoticons/unsure.gif

Posted by: John May 11 2016, 04:46 PM
Yes, you could use conditionals to make per-member profiles. But the admin would need to insert those for the member.

Posted by: deetoxicity May 12 2016, 04:32 PM
Highly excited for this!

Posted by: Bekah May 21 2016, 07:59 PM
So pleased that I found this!

I hit an issue with a skin I'm wanting to use and this would solve my problem entirely!

Any idea on a release date for this?

Posted by: John May 21 2016, 08:21 PM
No release date, but beta soon. If you would like to beta test, watch this thread.

Posted by: Delphi May 22 2016, 01:13 PM
John

I know I'm going to join the brigade of 'pain in your ass' and I am going to pre-apologize for that. I am in the midst of doing a remodel for my site and I'm just about to the point where I would use CFS to design the rest of my forum and I'd rather not waste my time with this beautiful hitting beta soon. I'd rather just use this, can I be that pain in the ass that asks if there is a more explicit definition of 'soon' ?

In other words, my remodel is due in July, is 'beta soon' enough before July to mess with it and get some stuff done for my release or should I just succumb to CFS and not wait. XD.

Of course I take any answer with the idea that you are human and things come up and have a life and etc, I just don't want to waste my time designing a full CFS skin just to transfer it all over again a few days after I finish it.

Posted by: John May 22 2016, 01:20 PM
Sorry, but I can't honestly give any certain due dates. A week or two I think. but I said that two weeks ago, so... :\ I pretty much have barely had any time to work on it has been the problem.

Posted by: Delphi May 22 2016, 01:38 PM
John

Completely understandable, thank you very much for the answer I greatly appreciate it. <3

Posted by: multiplicity! May 22 2016, 06:13 PM
QUOTE (Delphi @ May 22 2016, 11:38 AM)
John

Completely understandable, thank you very much for the answer I greatly appreciate it. <3

    He also made this new system to convert CFS variables, so my recommendation is just not to create a CFS with custom post view, but the rest of the forum, then tweak any mishaps that happen later!

Posted by: John May 22 2016, 06:42 PM
Right. It's 99% backward-compatible with CFS, both the new version's variables AND the old ones. When you paste in a CFS template it just automatically converts it for you to all of the variables we use. There's only going to be maybe a couple variables, not even, that don't translate over.

Posted by: owl May 22 2016, 10:40 PM
For those of us going with CFS to translate later, do you have any idea now what variables might not make it over?

Posted by: John May 22 2016, 10:47 PM
http://jcink.com/main/wiki/jfh-html-templates are current working variables for comparison. If you look, there is very little difference right now. Special cases are where variables don't transfer over.

For example, <!-- |visitors| --> and <!-- |comments| --> on profiles. I made a design decision to return those as an element that is much more flexible than just grabbing them as-is.

Another special case is the Field_# do not transfer over. This is because unlike CFS, the field references are exactly what you see in the Admin CP and have an actual relation to the field_# rather than going by order of appearance.

http://jcink.com/main/wiki/jfh-html-templates?s=variables#custom_fields

I will probably document things like this in the wiki as time progresses.

BTW, when I complete a template, I edit the wiki page. So all of the variables you see there are in the system at this time, as shown. Topic row and post row aren't done at the time of posting, as well as mini-profiles.

Posted by: Delphi May 23 2016, 06:39 PM
QUOTE (multiplicity! @ May 22 2016, 06:13 PM)
QUOTE (Delphi @ May 22 2016, 11:38 AM)
John

Completely understandable, thank you very much for the answer I greatly appreciate it. <3

    He also made this new system to convert CFS variables, so my recommendation is just not to create a CFS with custom post view, but the rest of the forum, then tweak any mishaps that happen later!


Thank you very much, I had completely forgotten about this happening.

Posted by: John May 24 2016, 02:53 PM
Topic rows are done.

Here's an example code to produce the default:

CODE
   <!-- Begin Topic Entry <!-- |tid| --> -->
   <tr class='topic-row'>
  <td align='center' class='row4'><!-- |macro_img| --></td>
     <td align='center' class='row2'><!-- |posticon| --></td>
     <td class='row4' title=''>
      <!-- |go_new_post| --><!-- |prefix| --> <!-- |topic| -->  <!-- |pages| -->
       <br /><span class='desc'><!-- |description| --></span></td>
     <td align='center' class='row2'><!-- |starter| --></td>
     <td align='center' class='row4'><!-- |replies| --></td>
     <td align='center' class='row2'><!-- |views| --></td>
     <td class='row2'><span class='desc'> <!-- |last_post| --><br /><a href='<!-- |last_post_url| -->'>Last Post By:</a> <b><!-- |last_poster| --></b></span></td>
 <td align='center' class='row4'><!-- |mod_checkbox| --></td>
   </tr>
   <!-- End Topic Entry <!-- |tid| --> -->


The list of variables has been posted:

http://jcink.com/main/wiki/jfh-html-templates#topic_row_in-forum

I am going to work on import/export and I will be ready to go beta with this soon. Have worked really hard on this the past 48 hr to get this done.

The post template and mini profile section will be developed during beta.

Posted by: owl May 24 2016, 03:12 PM
QUOTE (John @ May 22 2016, 10:47 PM)
http://jcink.com/main/wiki/jfh-html-templates are current working variables for comparison. If you look, there is very little difference right now. Special cases are where variables don't transfer over.

For example,  <!-- |visitors| -->  and  <!-- |comments| --> on profiles. I made a design decision to return those as an element that is much more flexible than just grabbing them as-is.

Another special case is the Field_# do not transfer over.  This is because unlike CFS, the field references are exactly what you see in the Admin CP and have an actual relation to the field_# rather than going by order of appearance....


Makes sense to me! Frankly, I'm excited about the change in how Field_# is being handled. If I'm following correctly, it should make custom profiles a hell of a lot easier to code, because you'll be referencing the Field_# itself, not whatever element might be shown in that order (which is likely different for different usergroups etc.).

Thanks for the hard work.

Posted by: John May 24 2016, 03:13 PM
QUOTE (owl @ May 24 2016, 03:12 PM)
Makes sense to me! Frankly, I'm excited about the change in how Field_# is being handled. If I'm following correctly, it should make custom profiles a hell of a lot easier to code, because you'll be referencing the Field_# itself, not whatever element might be shown in that order (which is likely different for different usergroups etc.).

Thanks for the hard work.


Exactly. It never made any sense to me why CFS was written this way and it creates a lot of confused users. We have had field_# referenced as IDs for a long time now in the DOM.

Posted by: John May 24 2016, 04:33 PM
So to start out and to prevent getting mobbed on this like the alerts (although this is less-profile than that), I am now taking premium beta testers first since I got what I wanted done much faster than I'd anticipated.

Delphi multiplicity! owl Chazz871 , interested? not sure if I missed anyone else here on premium if I did please post what board you want the templates to be enabled on!

Posted by: Delphi May 24 2016, 05:50 PM
Yes please!!!!

Posted by: Chazz871 May 24 2016, 08:32 PM
QUOTE (John @ May 24 2016, 04:33 PM)
So to start out and to prevent getting mobbed on this like the alerts (although this is less-profile than that), I am now taking premium beta testers first since I got what I wanted done much faster than I'd anticipated.

Delphi multiplicity! owl Chazz871 , interested? not sure if I missed anyone else here on premium if I did please post what board you want the templates to be enabled on!


I've been following this thread as I think what you're doing is an amazing feature which I plan to take advantage of eventually. Unfortunately this a bit over my head . I'm sure I can figure it out from the wiki but right now I just don't have the time to play around with this. I actually haven't given much thought as to how I'd like to change my forum layout. I do very much appreciate your offer to beta test. This forum host is the best. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: multiplicity! May 24 2016, 08:39 PM
    Yes!

    I would like it on http://chime.jcink.net please! http://files.b1.jcink.com/html/emoticons/biggrin.gif

    I have skins I can convert to test with.

Posted by: John May 24 2016, 08:52 PM
Alright. I enabled it multiplicity! and Delphi

No problem Chazz871

A few things off the top of my head:

- some of the board stats variables aren't right at the moment.
- mini profile is not done, post template is not done.
- to use the main profile template, you MUST enable the portal profile.
- to return to JFH default template for any section, simply leave the template blank.
- there are no example templates at the moment to go off of, I'm working on that.
- i forgot to add a macro to change the subforum ,'s

Posted by: bonbon May 24 2016, 09:06 PM
Would I be able to beta test on this forum? http://bonbonskins.jcink.net/

If we can get it activated on multiple forums I'd like it for here too -> http://libertas.jcink.net/ , but the first one is more of a priority c:

Posted by: John May 24 2016, 09:07 PM
bonbon both sites are now active since they are both premium.

Posted by: BeyondJaded May 24 2016, 11:33 PM
May I please get it here?
http://igneoustest.jcink.net/

Posted by: CrunchDrop May 25 2016, 01:23 AM
When will the free users be able to use it?

Posted by: owl May 25 2016, 02:52 AM
John - that would be awesome! If possible, I'd like this site to be added to beta:

http://kalopsia.jcink.net / http://kalopsia.co/

CrunchDrop I am not staff here, but if I understand correctly this feature will be open to all users, but right now is in beta testing. Premium sometimes has little perks like getting to be involved in early testing like this, but the Jcink staff tend to be very transparent about whether a feature is going to be exclusive to paid users and from what I can tell most developed features are intended to be open to everyone.

Posted by: CrunchDrop May 25 2016, 03:00 AM
Kinda of figured that. Thanks for the heads up

Posted by: John May 25 2016, 12:21 PM
We are taking beta testers for premium users only at this time, but this feature will be free for all when it is finally released. This feature has always been intended to be free, but I like to allow premium users the ability to work with some features first as both a token of appreciation for subscribing as well as to have an organized test group.

When the alerts system beta started there were way too many users coming in; so I made it premium-only after some time. While I love it that users want to help test, it becomes hard to manage and respond to so much feedback when hundreds are testing the same thing and can end up being counter-productive to have everyone reporting the same bugs and issues.

owl I have enabled it.

Posted by: John May 25 2016, 12:34 PM
Ok, so HTML Templates / Custom Forum Templates have gone into beta testing. The first round of testing is for premium users only. Later there will either be a full release or I will allow free users to test as well, if we need more. This feature will be free after release.

If you want to beta test this feature, only 2 requirements are needed
  • Your full board url, with an active premium subscription
  • You must be the root admin of the board.

To apply for testing, simply post your premium board link in this thread. You may post more than one board url if you wish.

To use the templates, go to Admin CP >> Skins and Templates >> HTML Templates. The system will now be active. You can create a new template set for your board skins that will be unallocated. Allocate the template under "skins & templates" -> Manage skin sets. You should see your template sets as an option now in the skin assets.

Once you have binded a template, fill them in to start using them. For example, if you want to change the Forum Row only, then edit that in the templates, and just leave the rest blank. Blank template = null/ignored and uses system default. This allows you to just use only the templates you want to.

The wiki has all of the available variables you can use:

http://jcink.com/main/wiki/jfh-html-templates

Please remember to REMOVE CFS, or at least remove the statement of the template you're trying to modify before you begin working with our template system. This is to avoid any conflicts with the script. CFS version 1 and 2 templates should be, for the most part, a quick copy & paste. The variables will be automatically converted over, at least 99% of them anyway.

KNOWN ISSUES:
  • some of the board stats variables aren't right at the moment.
  • mini profile is not done, post template is not done. this is intentional.
  • to use the main profile template, you MUST enable the portal profile. this is not actually an issue, just a note.
  • there are no example templates at the moment to go off of, I'm working on that.
  • we are working to add a macro to change the subforum commas

Posted by: MR. CHRIS EVANS May 25 2016, 01:20 PM
I am the root admin for both of these boards! I would love to beta test the HTML templates!!

http://hogscommonroom.jcink.net/index.php?act=idx

http://nevergrowinguprp.jcink.net/index.php?act=idx

Posted by: John May 25 2016, 01:23 PM
Enabled.

Posted by: lexocity May 25 2016, 01:27 PM
http://tsc.jcink.net/index.php?act=idx

can we be a part of the beta test?

Posted by: John May 25 2016, 01:32 PM
Yes, you are premium. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: lexocity May 25 2016, 01:35 PM
Then we'd love to be a part of it http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: katherine May 25 2016, 04:07 PM
I'm co owner for this site
http://hogscommonroom.jcink.net/index.php?act=idx

Posted by: John May 25 2016, 04:08 PM
Already enabled.

Posted by: multiplicity! May 25 2016, 05:53 PM
    John

    One of the features people really enjoy for the CFS custom profiles was the ability to use HTML in the profile fields. This is not a feature common to Jcink as it is now, except for in the interests field.

    Would it be possible to allow HTML to parse in the custom fields, instead of preventing it from doing so? Because this is one feature I know a lot of people really do use, and it would be a bummer to not be able to use it.

    I assume you can use the function the interests field uses to give it to the custom profile fields.

Posted by: John May 25 2016, 07:29 PM
If it will get users off from using CFS, I will make it an option in the Admin CP settings to allow HTML in custom profile fields. Thanks for pointing that out as it could end up being a deal breaker for switchers.

Posted by: multiplicity! May 25 2016, 07:50 PM
    QUOTE (John @ May 25 2016, 05:29 PM)
    If it will get users off from using CFS, I will make it an option in the Admin CP settings to allow HTML in custom profile fields. Thanks for pointing that out as it could end up being a deal breaker for switchers.


    I know right now as of testing it, you can use the CFS with the custom templates you have. I managed to use the custom post thing for the CFS still and it doesn't mess with anything. I just figured people would be more willing to stop using the CFS if you had the HTML enabled, since they'd probably still use it instead of the custom profile templates until they could find a work-around.

    But everything is working awesome so far! http://files.b1.jcink.com/html/emoticons/biggrin.gif

Posted by: John May 25 2016, 08:33 PM
Ah OK that makes sense. I requested to remove cfs just in case, but in reality if you only remove the relevant sections you're using in the html template system, it should be fine.

Posted by: pocketvixen May 25 2016, 09:42 PM
I'd love to sign up for beta testing!

http://allofme.jcink.net/index.php?act=idx This is my main forum, but this: http://meltingpot.jcink.net/ is my testing forum; I'd love to have both involved if possible!

Posted by: multiplicity! May 26 2016, 06:38 AM
    QUOTE (John @ May 25 2016, 06:33 PM)
    Ah OK that makes sense. I requested to remove cfs just in case, but in reality if you only remove the relevant sections you're using in the html template system, it should be fine.


    I let a few people know it was a work around to use the CFS profile when the template system comes out in case you don't get to the HTML enabling thing by then. I still think it's a good idea, even if the CFS will still function, because I doubt Black will keep up with it after the template system is released. Hell, Black may even take down the script, who knows.

Posted by: lexocity May 26 2016, 08:25 AM
Is anyone else having an issue with the side by side forum structure with this new html? I can't seem to get my forums back the way they were before.

http://tsc.jcink.net/index.php

HTML:
CODE
<center><div class='cf1'><div class='cf2'><div class='cf3'> <div class='cflink'> <!-- |img_new_post| --><!-- |name| --> <!-- |img_new_post| --> </div></div><div class='cf4'><!-- |description| --></div><div class='cf5'> <!-- |last_topic| -->  by  <!-- |last_poster| --> </div></div></div></center>


CSS:
CODE

@font-face {
   font-family: 'harry_pregular';
src: url(http://tsc.b1.jcink.com/uploads/tsc/HARRYP___TTF.ttf);
}

/*=============================================== *
* TSCXX fira and lex
* ==============================================
* #Version: 1.0.0
*=============================================== */

html { overflow-x: auto; }
form { display:inline; }

/****************************************
Add Ons
*****************************************/
.newstext span {display:none}

/* Shimmer's Affiliation Table */

.affies2 { padding: 0px; }
.affies-title { background: url(http://tsc.b1.jcink.com/uploads/tsc/wood_texture_by_xsweetsmile_d47lgxn.png);
background-color: #2c1219;
padding: 25px;
color: #A4B9D4;
font-family: 'harry_pregular';
font-size: 30px;
text-transform: uppercase;
text-align: center;
border-bottom: 7px solid #A4B9D4; }
.affies-title2 { text-transform: uppercase; background-color: #000; padding: 3px; color: #A4B9D4; text-align: center; width: 386px; margin-top: 3px; margin-bottom: 5px; }
.affies-title3 { text-transform: uppercase; background-color: #000; padding: 3px; color: #A4B9D4; text-align: center; width: 598px; margin-top: 3px; margin-bottom: 5px; }
.affies-rtd { width: 386px; height: 80px; margin-left: 5px; }
.affies-rtd2 { width: 598px; height: 80px; margin-left: 5px; }

/****************************************
Header Slide Show
*****************************************/
.newstext span {display:none}
.sp-slideshow { position: relative; margin: 0px; width: 1000px; height: 400px;}
.sp-content {  position: relative; width: 100%; height: 100%; overflow: hidden;}
.sp-parallax-bg { background-size: cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden;}
.sp-slideshow input { position: absolute; bottom: 15px; left: 50%; width: 9px; height: 9px; z-index: 1001; cursor: pointer; opacity: 0;}
.sp-slideshow input + label { position: absolute;bottom: 15px;left: 50%;width: 10px;height: 10px;display: block;z-index: 1000;border: 2px solid #fff; -webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;-webkit-transition: background-color linear 0.1s;-moz-transition: background-color linear 0.1s;-o-transition: background-color linear 0.1s;-ms-transition: background-color linear 0.1s;transition: background-color linear 0.1s;}
.sp-slideshow input:checked + label {background-color: #fff;}
.sp-selector-1, .button-label-1 {margin-left: -36px;}
.sp-selector-2, .button-label-2 { margin-left: -18px;}
.sp-selector-4, .button-label-4 {margin-left: 18px;}
.sp-selector-5, .button-label-5 {margin-left: 36px;}
.sp-arrow { position: absolute; top: 50%; width: 28px; height: 38px; margin-top: -19px; display: none; opacity: 0.8; cursor: pointer; z-index: 1000; background: transparent url(http://tympanus.net/Tutorials/CSS3FluidParallaxSlideshow/images/arrows.png) no-repeat; transition: opacity linear 0.3s; }
.sp-arrow:hover{ opacity: 1;}
.sp-arrow:active{ margin-top: -18px; }
.sp-selector-1:checked ~ .sp-arrow.sp-a2, .sp-selector-2:checked ~ .sp-arrow.sp-a3, .sp-selector-3:checked ~ .sp-arrow.sp-a4, .sp-selector-4:checked ~ .sp-arrow.sp-a5 { right: 15px; display: block; background-position: top right; }
.sp-selector-2:checked ~ .sp-arrow.sp-a1, .sp-selector-3:checked ~ .sp-arrow.sp-a2, .sp-selector-4:checked ~ .sp-arrow.sp-a3, .sp-selector-5:checked ~ .sp-arrow.sp-a4 { left: 15px; display: block; background-position: top left;}
.sp-slideshow input:checked ~ .sp-content { transition: background-position linear 0.6s, background-color linear 0.8s;}
.sp-slideshow input:checked ~ .sp-content .sp-parallax-bg { transition: background-position linear 0.7s;}
input.sp-selector-1:checked ~ .sp-content { background-position: 0 0; }
input.sp-selector-2:checked ~ .sp-content { background-position: -100px 0; }
input.sp-selector-3:checked ~ .sp-content { background-position: -200px 0; }
input.sp-selector-4:checked ~ .sp-content { background-position: -300px 0; }
input.sp-selector-5:checked ~ .sp-content { background-position: -400px 0; }
input.sp-selector-1:checked ~ .sp-content .sp-parallax-bg {  background-position: 0 0;}
input.sp-selector-2:checked ~ .sp-content .sp-parallax-bg { background-position: -200px 0;}
input.sp-selector-3:checked ~ .sp-content .sp-parallax-bg { background-position: -400px 0;}
input.sp-selector-4:checked ~ .sp-content .sp-parallax-bg { background-position: -600px 0;}
input.sp-selector-5:checked ~ .sp-content .sp-parallax-bg { background-position: -800px 0;}
.sp-slider { position: relative; left: 0; width: 500%; height: 100%; list-style: none; margin: 0; padding: 0; transition: left ease-in 0.8s; }
.sp-slider > li { color: #fff; width: 20%; box-sizing: border-box; height: 100%; padding: 0 60px; float: left; text-align: center; opacity: 0.4; transition: opacity ease-in 0.4s 0.8s; }
.sp-slider > li img{ box-sizing: border-box; display: block; margin: 0 auto; padding: 40px 0 50px 0; max-height: 100%; max-width: 100%;}
input.sp-selector-1:checked ~ .sp-content .sp-slider {left: 0;}
input.sp-selector-2:checked ~ .sp-content .sp-slider {left: -100%;}
input.sp-selector-3:checked ~ .sp-content .sp-slider {left: -200%;}
input.sp-selector-4:checked ~ .sp-content .sp-slider {left: -300%;}
input.sp-selector-5:checked ~ .sp-content .sp-slider {left: -400%;}
input.sp-selector-1:checked ~ .sp-content .sp-slider > li:first-child, input.sp-selector-2:checked ~ .sp-content .sp-slider > li:nth-child(2), input.sp-selector-3:checked ~ .sp-content .sp-slider > li:nth-child(3), input.sp-selector-4:checked ~ .sp-content .sp-slider > li:nth-child(4), input.sp-selector-5:checked ~ .sp-content .sp-slider > li:nth-child(5){  opacity: 1;}

.tscwelcome {
width: 340px;
height: 50px;
padding: 10px;
position: absolute;
top: 20px;
left: 1050px;
background: #000000;
opacity: 0.6;
font: normal normal 22px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tscplot {
width: 340px;
height: 260px;
padding: 10px;
position: absolute;
top: 105px;
left: 1050px;
background: #000000;
opacity: 0.8;
overflow: auto;
text-align: justify;
font: normal normal 12px 'Oswald', sans-serif;

}

.tsclink1 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 25px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink2 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 60px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink3 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 100px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink4 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 140px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink5 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 180px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink6 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 220px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink7 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 260px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink8 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 300px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.tsclink9 {
width: 150px;
height: 20px;
padding: 5px;
position: absolute;
top: 337px;
left: 1415px;
background: #000000;
opacity: 0.7;
font: normal normal 12px 'Oswald', sans-serif;
text-transform: uppercase;
}

.staff1 {
width: 150px;
height: 100px;
border: #000000 solid 1px;
position: absolute;
top: 10px;
left: 2060px;
}

.staff1info {
width: 140px;
height: 240px;
border: #000000 solid 1px;
position: absolute;
top: 110px;
left: 2060px;
font: normal normal 8px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
opacity: 0.9;
padding: 5px;
overflow: auto;
}

.staff1info b {
font: normal normal 24px 'Oswald', sans-serif;
text-transform: uppercase;
color: #2DF7C2;
}

.staff2 {
width: 150px;
height: 100px;
border: #000000 solid 1px;
position: absolute;
top: 10px;
left: 2242px;
}

.staff2info {
width: 140px;
height: 240px;
border: #000000 solid 1px;
position: absolute;
top: 110px;
left: 2242px;
font: normal normal 10px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
opacity: 0.9;
padding: 5px;
overflow: auto;
}

.staff2info b {
font: normal normal 30px 'Oswald', sans-serif;
text-transform: uppercase;
color: #2DF7C2;
}

.staff3 {
width: 150px;
height: 100px;
border: #000000 solid 1px;
position: absolute;
top: 10px;
left: 2424px;
}

.staff3info {
width: 140px;
height: 240px;
border: #000000 solid 1px;
position: absolute;
top: 110px;
left: 2424px;
font: normal normal 10px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
opacity: 0.9;
padding: 5px;
overflow: auto;
}

.staff3info b {
font: normal normal 30px 'Oswald', sans-serif;
text-transform: uppercase;
color: #2DF7C2;
}

.staff4 {
width: 150px;
height: 100px;
border: #000000 solid 1px;
position: absolute;
top: 10px;
left: 2606px;
}

.staff4info {
width: 140px;
height: 240px;
border: #000000 solid 1px;
position: absolute;
top: 110px;
left: 2606px;
font: normal normal 10px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
opacity: 0.9;
padding: 5px;
overflow: auto;
}

.staff4info b {
font: normal normal 30px 'Oswald', sans-serif;
text-transform: uppercase;
color: #2DF7C2;
}

.staff5 {
width: 150px;
height: 100px;
border: #000000 solid 1px;
position: absolute;
top: 10px;
left: 2788px
}

.staff5info {
width: 140px;
height: 240px;
border: #000000 solid 1px;
position: absolute;
top: 110px;
left: 2788px;
font: normal normal 10px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
opacity: 0.9;
padding: 5px;
overflow: auto;
}

.staff5info b {
font: normal normal 30px 'Oswald', sans-serif;
text-transform: uppercase;
color: #2DF7C2;
}

.member {
width: 200px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 3060px;
}

.memberinfo {
width: 190px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 3060px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.female {
width: 200px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 3285px;
}

.femaleinfo {
width: 190px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 3285px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.male {
width: 200px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 3510px;
}

.maleinfo {
width: 190px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 3510px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.newchar {
width: 200px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 3735px;
}
.newcharinfo {
width: 190px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 3735px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.quote {
width: 250px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 4060px;
}

.quoteinfo {
width: 240px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 4060px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.threadotm {
width: 250px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 4373px;
}

.threadotminfo {
width: 240px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 4373px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}

.relation {
width: 250px;
height: 250px;
border: #000000 solid 2px;
position: absolute;
top: 10px;
left: 4686px;
}

.relationotminfo {
width: 240px;
height: 72px;
border: #000000 solid 2px;
position: absolute;
top: 264px;
left: 4686px;
font: normal normal 20px 'Oswald', sans-serif;
letter-spacing: .5px;
text-transform: uppercase;
background: #000000;
color: #A4B9D4;
opacity: 0.7;
padding: 5px;
overflow: auto;
}
/****************************************
Body Background & Text Style
*****************************************/

body {
font-family: trebuchet ms;
letter-spacing: .5px;
font-size: 14px;
color: #fff; margin:0px;
padding:0px;
       background-image: url('http://gdj.gdj.netdna-cdn.com/wp-content/uploads/2013/03/wood+pattern+texture+33.jpg');
text-align:center;
}

/****************************************
  Table Styles
*****************************************/

table, tr, td {
font-family: oswald, sans-serif;
font-size: 12px;
color: #fff;
}

/****************************************
  Board Width
*****************************************/

#wrapper {
text-align:left;
       width:1000px;
       margin: 20px auto 30px;
       background: #131313;
       box-shadow: 0 5px 10px rgba(0,0,0,0.5);
       padding-bottom: 5px;
margin-left:242px;
}

#innerwrapper {
padding: 0 10px;
}

/****************************************
  Link colors
*****************************************/


a:link, a:visited, a:active {
text-decoration: none;
color: #A4B9D4;
}
a:hover {
color: #eeeeee;
text-decoration: none;
}
/****************************************
  Profile styles
*****************************************/

#profilename {
font-size:28px;
font-weight:bold;
}

#photowrap {
padding:6px;
}

#phototitle {
font-size:24px;
border-bottom:1px solid black;
}

#photoimg   {
text-align:center; margin-top:15px;
}



/****************************************
  UserCP/My Controls styles
*****************************************/

#ucpmenu {
line-height:150%;
width:22%;
border:1px solid #A4B9D4;
background-color: #37393B;
}

#ucpmenu p  {
padding:12px 15px 16px 19px;
margin:0px;
}

#ucpcontent {
background-color: #37393B;
border:1px solid #A4B9D4;
line-height:100%; width:auto;
}

#ucpcontent p  {
padding:10px;
margin:0px;
}
/****************************************
 Logo Strip
*****************************************/

#logostrip {
display: none;
}

#logo {
min-height: 60px;
text-align: left;
margin-top: 5px;
padding: 20px 20px 5px;
}


#logo a, #logo a:hover {
font-size: 36px;
text-decoration: none;
font-weight: bold;
color: #800000;
}
/****************************************
 Search Bar
*****************************************/

#searchbar {
display: block;
float: right;
position: relative;
right: 10px;
top: 8px;
}

#searchbar .search-container {
   background-color: #FFFFFF;
   box-shadow: 0 1px 3px rgba(0,0,0,0.4) inset;
   border: 1px solid #D8D8D8;
   display: block;
   height: 26px;
   position: relative;
   width: 200px;
}

#searchbar .search-input {
background: none repeat scroll 0 0 transparent;
border: 0;
color: #808080;
font-size: 12px;
width: 192px;
height: 26px;
font-family: trebuchet ms;
padding: 1px 0 0 8px;
}

#searchbar .search-input:focus {
   color: #000000;
}

#searchbar .search-button {
background: #800000 url(http://files.b1.jcink.com/themes/default/magnifying-glass.png) no-repeat 50% 50%;
border: 0;
bottom: 0;
margin: 0;
border-radius: 0;
display: block;
height: 26px;
padding: 0;
position: absolute;
right: 0;
text-indent: -3000em;
top: 0;
width: 26px;
cursor: pointer;
box-shadow: none;
}
/****************************************
 Navigation Bar / Submenu
*****************************************/

#submenu  {
display:none;
}

#submenu img {
display: none;
}

#submenu a:link, #submenu a:visited, #submenu a:active {
text-decoration: none;
color: #fff !important;
       padding: 7px 7px;
       font-weight: bold;
}

#submenu a:hover {
color: #fff !important;
text-decoration: underline;
}

#navi br {
display: none;
}

#navstrip  {
padding:6px 0px 16px 0px;
font-family: 'harry_pregular';
color: #F1F1F1;
font-size:20px;

}

/****************************************
  Calendar styling
*****************************************/

.caldate   {
text-align:right;
font-weight:bold;
font-size:11px;
color:#555;
background-color:#2c2c2c;
padding:4px; margin:0px;
}

#calendarname {
font-size:22px;
font-weight:bold;
}

#padandcenter {
margin-left:auto;
margin-right:auto;
text-align:center;
padding:14px 0px 14px 0px;
}


/**************************************************
User Links Menu (Messages / View new posts / etc )
***************************************************/


#userlinks {
border: 1px solid #A4B9D4;
background-color: #131313;
list-style: none;
width: 100%;
position:fixed;
top:0px;
left:0px;
padding:0px;
margin: 0 auto;
z-index:3000;

}

#userlinks br { display: none; }

#userlinks td {
color: #A4B9D4;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
}

#userlinks a {
text-decoration: none; padding: 1px;
color: #A4B9D4;
text-transform: uppercase;
font-family: 'Oswald', sans-serif;
}

#userlinks a:hover {
text-decoration: none;
color: #fff;
}
/****************************************
  Topic View styles
*****************************************/

.activeuserstrip {
background-color: #484C52;padding:6px
}

.normalname {
font-size: 12px;
font-weight: bold;
color: #003;
}

.normalname a {
font-size: 12px;
}

.unreg {
font-size: 11px;
font-weight: bold;
color: #900;
}

.post1 {
background-color: #2c2c2c;
}

.post2 {
background-color: #2c2c2c;
}

.postdetails {
font-size: 10px;
}

.postcolor   {
font-size: 12px; line-height: 160%;
}

.postlinksbar {
       padding: 1px 5px;
background-color:#484C52;
padding:1px;
margin-top:1px;
font-size:10px;

}

.signature   {
font-size: 10px;
color: #339;
line-height:150%;
}


/*******************************
Pagination e.g. [1],2,3 ...
*******************************/

.pagination .pagination_current, .pagination a {
    padding: 2px 5px;
}

.pagination a:link, .pagination a:visited, .pagination a:active {
    border: 1px solid #fff;
    border-radius:0px;
    background-color:#A4B9D4;
    padding-left:6px;
    padding-right:6px;
    color:#ffffff;
    text-decoration:none;
    box-shadow: 0pt 2px 3px rgba(0, 0, 0, 0.4);
}

.pagination a:hover {
background: #A4B9D4;
text-decoration: none;
color:#fff;
box-shadow: 0pt 2px 3px rgba(0, 0, 0, 0.4);
}

.pagination .pagination_current {
    background: none repeat scroll 0% 0% #FFFFFF;
    border: 1px solid #545454;
    border-radius:0px;
    padding-left:6px;
    padding-right:6px;
    background-image:url(http://files.b1.jcink.com/themes/default/gray-gradient.png);
}

.pagination_first, .pagination_last, .pagination_page {
    background: none repeat scroll 0% 0% #740300;
    border: 1px solid #800000;
}

.pagination_pagetxt {
   display:none;
}
/****************************************
  Global general table/div row styles
*****************************************/

.row1,.row3,.row4,.row2 {
background-color: #353535;
padding: 5px;
       color: #aaaaaa;

}

#boardstats .row2 {
text-align: center;
}

.darkrow1 {
background-color: #484C52; color:black;
}

.darkrow2 {
background-color: #484C52; color:black;
}

td.darkrow2 {
display: none;
}

.darkrow3 {
background-color: #484C52;
color: #000;
padding: 3px;
}

.hlight { background-color: #42474B; }
.dlight { background-color: #42474B; }

/****************************************
  Top table bars / gradient holders
*****************************************/

.maintitle {
background-color: #2c2c2c;
font-weight: bold;
padding: 8px;
color: #A4B9D4;
font-family: 'oswald', sans-serif;
text-transform: uppercase;
border: .5px solid #a4b9d4;
}

.maintitle a:link, .maintitle  a:visited, .maintitle  a:active {
text-decoration: none; color: #FFF !important;
}

.maintitle a:hover {
text-decoration: underline;
}
/****************************************
 Bar directly below the maintitles
*****************************************/
.titlemedium { visibility: hidden; line-height: 0; font-size: 0; padding: 0; }

/****************************************
 Table & Div Borders
*****************************************/

.tableborder {
background-color: #131313;
padding:0px; margin:0;
}

.tablefill {
background-color: #2c2c2c;
border:1px solid #555;
padding:6px;
}

.tablepad {
background-color: #2c2c2c;
padding:6px;
}

.tablebasic {
width:100%; padding:0; margin:0px; border:0px;
}

.plainborder {
border:1px solid #555;
background-color: #2c2c2c;
}

/****************************************
 QUOTE and   BBCode boxes
*****************************************/

#QUOTE {
white-space:normal;
font-family: trebuchet ms;
font-size: 11px;
color: #333;
background-color: #2c2c2c;
border: 0px;
padding:2px;
border:1px solid #555;
margin-top:2px;
}

#CODE  {
white-space:normal;
font-family: trebuchet ms;
font-size: 11px;
color: #ffffff;
background-color: #2c2c2c;
border: 0px;
padding:2px;
border:1px solid #A4B9D4;
margin-top:2px;
}
/****************************************
CODE AREA CSS
*****************************************/

#CODE  {
white-space:normal;
font-family: Courier, Courier New, Verdana, Arial;
font-size: 11px;
color: #333;
background-color: #fff;
padding: 30px;
border:1px solid #eee;
margin-top:2px;
    word-break: break-word;
}

.code-scroll {
max-height: 250px;
max-width:350px;
overflow: auto;
padding-right: 5px;
}

.code-scroll::-webkit-scrollbar { background-color: #f1f1f1; }
.code-scroll::-webkit-scrollbar-thumb { background-color: #ddd; }

.code-top {
max-width:350px;
background-color: #131313;
margin: 0;
padding: 0;
text-align: center;
overflow: hidden;
color: #f1f1f1;
}
.code-highlight {
max-width:350px;
font: normal normal normal 8px/100% 'Arial', sans-serif; color:#111;
padding: 4px 6px 2px; margin:0px;
background-color:#484C52;
text-align: center;
text-transform: uppercase;
color: #fff;
letter-spacing: 1px;
cursor: crosshair;
}

.code-top .code-title {
max-width:300px;
margin: 20px;
font: italic normal 300 20px/100% 'Oswald', sans-serif;
text-transform: lowercase;
}

.code-toggle {
max-width:350px;
cursor: crosshair;
}

.code-scroll.auto-code {
max-width:350px;
height: auto;
max-height: none;
}

#CODE-WRAP.nicole-code { border-collapse: collapse; max-width:300px;}
/**********************************************
 Input buttons, e.g. submit, text input, etc
***********************************************/

.button-large {
background: #A4B9D4;
border-radius: 0px;
       padding: 5px 12px;
text-align:center;
margin:0px 1px 0px 1px;
       color: #2c2c2c;
font-weight: bold;
       min-width: 50px;
       display: inline-block;
font-family: oswald, sans-serif;
text-transform: uppercase;
}


.button-small {
background: #A4B9D4;
border-radius:0px;
color: #2c2c2c;
font-weight: bold;
font-size: 11px;
margin: 3px;
padding: 4px 7px;
text-decoration: none;
       min-width: 50px;
       max-width: 80px;
font-family: oswald, sans-serif;
text-transform: uppercase;
}

.post-buttons-top { margin-top: 3px; }

.button-large.closed {
background: #A4B9D4;
       padding: 7px 12px;
text-align:center;
margin:0px 5px 0px 5px;
       border: 1px solid #A4B9D4;
       color: #2c2c2c;
font-weight: bold;
font-family: oswald, sans-serif;
text-transform: uppercase;
}

.forminput, .codebuttons, .textinput, .radiobutton, .checkbox {
border-radius: 0px;
background: #FFF; border: 1px solid #545454;
color: #000;
font-size: 12px;
padding: 2px;
vertical-align: middle;
box-shadow: 0 1px 3px rgba(0,0,0,0.4) inset;
font-family: oswald, sans-serif;

}


input[type=submit], input[type=button], input[type=reset] {
background: #A4B9D4;
border-radius:0px;
box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
color: #2c2c2c;
font-size: 11px;
font-weight: bold;
margin: 3px;
padding: 2px 6px;
text-decoration: none;
border: none;
}

.codebuttons  {
font-size: 10px;
}


/****************************************
 Form table cell styles, left/right/top
*****************************************/

.pformstrip {
background-color: #585F69;
color:#A4B9D4; font-weight:bold;
padding: 2px 5px;
margin-top:1px
font-family: oswald, sans-serif;
text-transform: uppercase;

}

.pformleft  {
background-color: #2c2c2c;
padding:6px;
margin-top:1px;width:25%;
border-top:1px solid #A4B9D;
border-right:1px solid #A4B9D;
}

.pformleftw {
background-color: #42464B; padding:6px;
margin-top:1px;width:40%;
border-top:1px solid #232323;
border-right:1px solid #232323;
}

.pformright {
background-color: #2c2c2c;
padding:6px; margin-top:1px;
border-top:1px solid #232323;
}


/****************************************
Tabs on the portal profiles + sections
*****************************************/

.opentab {
color: #FFF;
padding:8px;float: left; width: auto;
background-color: #37393B;
margin-top:3px;
margin-right:2px;
font-size:11px;
border: #545454 1px solid;
}

.closedtab {
color: #FFF;
padding:7px;float: left;width: auto;
background-color: #37393B;
margin-top:6px;
margin-right:2px;
font-size:11px;
border-top:   #545454 1px solid;
border-right: #545454 1px solid;
border-left:  #545454 1px solid;
}

.positiontab {
height: 34px; margin-left: 2px;
}

/****************************************
  Delete all cookies / mark read
*****************************************/

#delcookiesrow, #mark-as-read-subto {
background-color: #37393B;
border: 1px solid #545454;
font-size: 10px;
padding: 5px;
       width: 280px;
       float: right;
       margin-top:-3px;
       padding-left:1px;
}

#mark-as-read-subto {
float: none;
padding-top: 3px;
}


/*******************************
    Board Statistics Links
*******************************/

.toplinks a {
color: #ffffff;
font-size: 11px;
text-decoration: none;
}

.toplinks {
margin: 0 11px -37px 0;
text-align: right;
color: transparent;
}

/****************************************
custom stats
*****************************************/
#pstats { height: 250px;  margin: 0 auto; background: #271F2A; border: 1px solid #0c0510; position: relative; overflow: hidden; margin-top: 10px; margin-bottom: 10px;}
.p1 { width: 200px; height: 226px; background: rgba(228, 225, 218, 0.05); border: 1px solid rgba(184, 184, 184, 0.1); position: absolute; left: 690px; top: 13px; }
.p1 h1 { width: 200px; height: 50px; background: #1D171F; color: #E4E1DA; font: normal bold 30px/50px megrim, sans-serif; text-align: center; margin-top: 0px; }
.p1w { font: normal normal 12px/14px monda, sans-serif; width: 180px; margin: 0 auto; text-align: justify; color: #B8B8B8; }
.p1w a { text-decoration: none; font-weight: bold; color: #736572; }
.p2 { width: 650px; height: 140px; background: rgba(228, 225, 218, 0.05); border: 1px solid rgba(184, 184, 184, 0.1); position: absolute; left: 15px; top: 13px; }
.p2 h1 { width: 650px; height: 50px; background: #1D171F; color: #E4E1DA; font: normal bold 30px/50px megrim, sans-serif; text-align: center; margin-top: 0px; }
.p2w { width: 620px; height: 50px; margin: 0 auto; text-align: justify;  margin-top: -10px; padding-right: 10px; overflow-y: auto; color: #B8B8B8; }
.p2w a { font: normal bold 20px/14px monda, sans-serif; text-decoration: none; }
.p2b { width: 650px; height: 20px; background: #1D171F; color: #B8B8B8; margin-top: 10px; text-align: center;}
.p2b a { font: normal normal 10px/20px monda, sans-serif; color: #B8B8B8; text-decoration: none; }

.p3 { width: 650px; height: 80px; background: rgba(228, 225, 218, 0.05); border: 1px solid rgba(184, 184, 184, 0.1); position: absolute; left: 15px; top: 160px; }
.p3 h1 { width: 650px; height: 50px; background: #1D171F; color: #E4E1DA; font: normal bold 30px/50px megrim, sans-serif; text-align: center; margin-top: 0px; }
.p3w { width: 620px; height: 25px; margin: 0 auto;  text-align: justify; padding-right: 10px; overflow-y: auto; color: #B8B8B8; margin-top: -18px; }
.p3w a { font: normal bold 10px/11px monda, sans-serif; text-decoration: none;
}

/****************************************
MINI PROFILE STUFF
*****************************************/
#bkgrnd {
 background-color:#2C2C2C;
}
#awardshide{
width:230px;
height:100px;
text-align:center;

}

.awardtitle {
font-family:oswald;
text-align:center;
letter-spacing:36px;
text-align:center;
color:#fff;
opacity:.1;
padding-bottom:5px;
}

#awardsshow {
  padding-top:5px;
  overflow-y:auto;
  opacity:0;  
  -webkit-transition:.5s;
  -moz-transition:.5s;
  -o-transition:.5s;
  -ms-transition:.5s;
  transition:.5s;
}

#awardshide:hover #awardsshow {
  opacity:1;
 
}

.mini1 {
position: relative;
width: 250px;
height: 400px;
overflow: hidden;
}

.mini2 {
width: 250px;
background-color:;
text-align: center;
line-height: 100%;
border-bottom: 5px solid #000;

}
.mininame {
color: #fff;
font-family: 'harry_pregular';
font-size: 40px;  
font-style: normal;
text-align: center;  
line-height: 100%;
padding-top:50px;
}

.mini3 {
position: absolute;
top: 350px;
left: -50px;
width: 250px;
height: 50px;
padding: 50px;
background-color: rgba(255,255,255, 0.7);
z-index: 1001;
-webkit-transition: .4s ease-in-out;
-moz-transition: .4s ease-in-out;
-ms-transition: .4s ease-in-out;
-o-transition: .4s ease-in-out;
transition: .4s ease-in-out;
}

.mini1:hover .mini3 {
top: -30px;
}

.mini4 {
width: 250px;
height: 400px;
}

.mini5 {
width: 250px;
height: 400px;
background-color: #1c1c1c;

 
}
.mini6 img {
width: 100px;
height: 100px;
position:relative;
top: 10px;
left:15px;
padding-top: 0px;
padding-bottom:-20px;
background-color: #fff;
float:left;

}

.infobox {
width:100px;
height:20px;
position:relative;
float:left;
left:25;
right:10;
margin-top:10px;
margin-left:10px;
margin-right:10px;
padding-top:5px;
padding-bottom:-10px;
border:1px groove #6F6F6F;
text-align:center;
font-family:oswald;
font-size:10px;
text-transform: uppercase;
color:#fff;
background-color: #1c1c1c;
}

.infobox2 {
width:100px;
height:20px;
position:relative;
float:right;
left:7;
margin-top:8px;
margin-left:8px;
margin-right:10px;
padding-top:9px;
padding-bottom:-5px;
border:1px groove #6F6F6F;
text-align:center;
float:left;
font-family:oswald;
font-size:8px;
text-transform: uppercase;
color:#fff;
line-height:100%;
background-color: #1c1c1c;
}

.infobox3 {
width:220px;
height:20px;
position:relative;
left:7;
margin-top:5px;
margin-left:8px;
margin-right:8px;
padding-top:8px;
border:1px groove #6F6F6F;
float:left;
font-family:oswald;
font-size:10px;
text-transform: uppercase;
color:#fff;
line-height:100%;
background-color: #1c1c1c;
}

.tinybox {
width:16px;
height:16px;
position:relative;
left:15;
margin-top:10px;
margin-left:8px;
margin-right:10px;
padding:10px;
border:1px groove #6F6F6F;
float:left;
}

.tinybox a {
 color:#fff;
 
}


.mini7 {
position: absolute;
top: 0px;
left: 0px;
width: 250px;
height: 400px;
z-index: 1;
-webkit-transition: .6s ease-in-out;
-moz-transition: .6s ease-in-out;
-ms-transition: .6s ease-in-out;
-o-transition: .6s ease-in-out;
transition: .6s ease-in-out; }

/* CHANGE MEMBERGROUPNUMBER TO MATCH THE ID # OF THE MEMBER GROUP */

#g-3 .mini3  { background-color: rgba(115, 101, 114, 0.7) }
#g-4 .mini3  { background-color: rgba(45, 233, 177, 0.7) }
#g-6 .mini3  { background-color: rgba(223, 1, 1, 0.7) }
#g-7 .mini3 { background-color: rgba(255, 255, 0, 0.7) }
#g-8 .mini3  { background-color: rgba(46, 100, 254, 0.7) }
#g-9 .mini3 { background-color: rgba(4, 180, 4, 0.7) }
#g-10 .mini3  { background-color: rgba(254, 154, 46, 0.7) }
#g-11 .mini3  { background-color: rgba(169, 1, 219, 0.7) }
#g-12 .mini3 { background-color: rgba(247, 129, 190, 0.7) }
#g-13 .mini3  { background-color: rgba(129, 218, 245, 0.7) }
#g-15 .mini3  { background-color: rgba(169, 245, 169, 0.7)}
#g-16 .mini3  { background-color: rgba(242, 245, 169, 0.7) }
#g-17 .mini3  { background-color: rgba(115, 101, 114, 0.7) }
#g-3 .mininame  { color: rgba(115, 101, 114, 1) }
#g-4 .mininame  { color: rgba(45, 233, 177, 1) }
#g-6 .mininame  { color: rgba(223, 1, 1, 1) }
#g-7 .mininame { color: rgba(255, 255, 0, 1) }
#g-8 .mininame  { color: rgba(46, 100, 254, 1) }
#g-9 .mininame { color: rgba(4, 180, 4, 1) }
#g-10 .mininame  { color: rgba(254, 154, 46, 1) }
#g-11 .mininame  { color: rgba(169, 1, 219, 1) }
#g-12 .mininame { color: rgba(247, 129, 190, 1) }
#g-13 .mininame  { color: rgba(129, 218, 245, 1) }
#g-15 .mininame  { color: rgba(169, 245, 169, 1)}
#g-16 .mininame  { color: rgba(242, 245, 169, 1) }
#g-17 .mininame  { color: rgba(115, 101, 114, 1) }


.normalname, .unreg {display:none}

/********************************
Miscellaneous
********************************/

/* image tag styles */
img        { vertical-align:middle; border:0px }
img.attach { border:2px outset #555;padding:2px }

/* Forum Descriptions */
.desc { font-size:11px; color: #000; }

/* Edited by text */
.edit { font-size: 9px }

/* Topic Macros */

.wrapmini { float: left; }

/* Warning CSS */
.warngood { color:green }
.warnbad  { color:red }

/* Skin selector dropdown */
#skin_selector {
margin: 10px 0;
}


/* Online users list row */
.thin {
padding:6px 0px 6px 0px;
line-height:140%;
margin:2px 0px 2px 0px;
border-top:1px solid #545454;
border-bottom:1px solid #545454;
}


/* Highlighted text in search */
.searchlite {
color:#F00;
font-weight:bold;
background-color:#FF0;
}

/****************************************
Mobile-specific Styles
*****************************************/

#mobile {
background-color: #FBFBFB;
}

/***********************************
Copyright: Removal is against Terms
************************************/

.copyright {
font-size: 10px; line-height: 12px;
}


/***********************************
INDEX PAGE
************************************/
.new-row {
display: inline-block;
}
.cf1 {width:450px; height:220px; background:#393939; padding-top:10px; margin-left: -50%; margin-top:10px; }
.cf1.last-child:nth-child(odd) {float: none;}
.cf1 a {color:#fff}
.cf2 {width:390px; height:170px; padding:20px; background:#262626;margin:auto; }
.cf3 {text-align:center; text-transform:uppercase; letter-spacing:2px; color:white; display:block; margin-top:-10px;}
.cf3 a{text-decoration:none; color: #fff !important; text-transform:uppercase; font: 15px oswald; }
.cf4 {width:390px; height:100px; padding:0px; background:#1c1b1b;margin:auto; color:white; font:8px oswald; margin-top:3px; display:block}
.cf5 {width:385px; height:40px; background: #1c1b1b; margin-top:5px; padding:3px; text-align:center; font:12px oswald; line-height:300%; color:white;}
.cf5 a:first-child{color:#fff; text-transform:uppercase;text-decoration:none;letter-spacing:1px}
.cf5 a{color:#fff; text-transform:uppercase;text-decoration:none;letter-spacing:1px}
.cflink {text-decoration:none; color:#fff; text-transform:uppercase; font: 15px oswald; }
.dc1 {width:390px; height:100px; padding-top:0.1px;}
.dc2 {width:360px; height:95px;padding: 10px; padding-top:10px; overflow:hidden;text-align:justify; opacity:0; background:#262626; margin:auto; margin-top:5px; margin-bottom:5px;transition: all 0.5s ease-in-out; font:10px arial;overflow:hidden; border: 3px double #4B4B4B}
.dc3 {width 360px; padding:2px; background:#1C1B1B; font: 12px oswald; text-align:center; margin-top:15px}
.dc3 a {color:white !important; text-decoration:none; text-transform:uppercase; font:11px arial}
.dc1:hover .dc2 {opacity:0.9}

/***********************************
custom profile by black/lauz/lex
************************************/

/* CUSTOM PROFILE CODE ORIGINALLY BY BLACK CUSTOMIZATION BY LAUZ */
#profile-container {width: 588px;}
.topname {padding: 30px; background-color: #2c2c2c; font-family: 'harry_pregular'; font-style: italic; color: #fff; font-size: 50px; text-align: center; text-transform: uppercase; text-shadow: 1px 1px 0px #A4B9CA, 2px 2px 0px black, 3px 3px 0px #636C78;}
.profile-avatar {padding: 5px; background-color: #fff; border: 20px solid #2c2c2c; width: 250px;}
.profile-info {border: 20px solid #2c2c2c; height: 370px; width: 200px; background-color: #fff; padding: 20px; text-align: center; color: #2c2c2c; font-family: oswald; letter-spacing: 2px; text-transform: uppercase; font-size: 10px; line-height: 100%;}
.profile-info img {padding: 2px; border: 1px solid #2c2c2c; width: 150px; height: 150px; margin-top: 5px; margin-bottom: 5px;}
.profile-bar1 {background-color: #A4B9CA; margin-top: 10px; margin-bottom: 10px; padding: 3px; color: #fff; font-family: oswald; letter-spacing: 1px; text-transform: uppercase; font-size: 10px;}
.profile-bar2 {background-color: #636C78; margin-top: 10px; margin-bottom: 10px; padding: 3px; color: #2c2c2c; font-family: oswald; letter-spacing: 1px; text-transform: uppercase; font-size: 10px;}
.profile-bar1 a {color: #fff;}
.profile-bar2 a {color: #fff;}

/***********************************
CUSTOM STATS
************************************/

#custom-stats table { background-color: #A4B9D4; border-spacing: 1px; }
.online-list {
width: 420px; height: 90px; padding: 20px; background-color: #2c2c2c; font-family: trebuchet ms; line-height: 120%;
}

.new-member {
width: 154px; height: 50px; padding: 10px; background-color: #2c2c2c; font-family: oswald; font-size: 14px; }

.new-member a { display: block; font-height: 200%; text-align: center; }

.new-member a:hover { font-style: italic; }

.restassured {
font-size: 20px;
padding: 10px;
color: #A4B9D4;
}

.member-stats {
background-color: #2c2c2c;
width: 73px;
font-family: oswald;
font-size: 9px;
padding: 5px;
text-align: center;
font-weight: normal;
}

.today-online {
width: 296px; padding: 20px; height: 70px; background-color: #2c2c2c; font-family: trebuchet ms;
}

.today-online-space {
height: 90px; overflow: auto;
}


/****************************************
TOGGLE BY NICOLE'S TOGGLE GENERATOR
nicolescodes.tumblr.com/togglegenerator
*****************************************/

#n-toggle {
   word-break: break-word;
   display: inline-block;
   cursor: crosshair;
   text-align: center;
   box-sizing: border-box;
   position: fixed;
   z-index: 800;
   text-transform: uppercase;
   font-family: inherit;
   font-size: inherit;
   width: 220px;
   height: auto;
   background: #2c2c2c;
   color: #A4B9D4;
   padding: 5px;
   top: auto;
   left: 10px;
   right: auto;
   bottom: 10px;
}

#n-cbox {
   position: fixed;
   display: none;
   z-index: 999;
   background: #2c2c2c;
   top: auto;
   left: 10px;
   right: auto;
   bottom: 43px;
   width: 200px;
   padding: 10px;
}

Posted by: John May 26 2016, 08:27 AM
What was the original custom index.init JavaScript and HTML?

Posted by: lexocity May 26 2016, 08:49 AM
this is the original custom code

CODE
<script>
customIndex.init({
page: "<!-- |input_act| -->",
html: "<center><div class='cf1'><div class='cf2'><div class='cf3'> <div class='cflink'>{%marker}{%link}{%marker}</div></div><div class='cf4'>{%description}</div><div class='cf5'>{%lp-title} by {%lp-author}</div></div></div></center>"
});
</script>

Posted by: John May 26 2016, 09:49 AM
Can you re-enable cfs for the index? I want to see if it's injecting anything special that you need.

Posted by: lexocity May 26 2016, 10:08 AM
I put everything back to the originals, and now its not working at all...

Posted by: John May 26 2016, 10:20 AM
Ok, the problem there is that you need to go back the old version of cfs. You installed the newest one, but you're using the old one. The two aren't directly compatible.

Insert this for the script instead of what you have now:

CODE
<script src="http://elegantexpressions.us/black/cfs.min.js"></script>

Posted by: lexocity May 26 2016, 10:23 AM
Ok, now its back to the originals. How do i change it over to the HTML without it being weird?

Posted by: John May 26 2016, 10:27 AM
I am checking to see why that's happening.

Posted by: John May 26 2016, 10:31 AM
I'm going to need a complete copy of your skin to pick at. Please export the XML file and send it to admin@jcink.com so I may import it into my development board. I think I know what's happening but I'm going to have to play with the HTML on my own to best advise this type of usage case.

Posted by: lexocity May 26 2016, 10:46 AM
Sent!

Posted by: John May 26 2016, 11:01 AM
OK thanks for that. I added the missing piece to your template that was being automatically inserted by CFS. This should work, paste it for the forum row template and tell me what happens.

CODE
<div id="row-<!-- |forum_id| -->" alt="" class="new-row">
<center>
<div class='cf1'>
 <div class='cf2'>
  <div class='cf3'>
   <div class='cflink'><!-- |img_new_post| --><!-- |name| --><!-- |img_new_post| --></div>
 </div>
 <div class='cf4'><!-- |description| --></div>
 <div class='cf5'><!-- |last_topic| --> by <!-- |last_poster| --></div>
 </div>
</div>
</center>
</div>

Posted by: lexocity May 26 2016, 11:05 AM
its perfect now! Thanks!

Posted by: Chlocelot May 26 2016, 11:09 AM
I would LOVE to play with this!

http://rdd.b1.jcink.com/ is my premium test board.

Posted by: John May 26 2016, 11:10 AM
QUOTE (pocketvixen @ May 25 2016, 09:42 PM)
I'd love to sign up for beta testing!

http://allofme.jcink.net/index.php?act=idx This is my main forum, but this: http://meltingpot.jcink.net/ is my testing forum; I'd love to have both involved if possible!

Both of these have been enabled.,

EDIT: and the above.

Posted by: John May 26 2016, 11:12 AM
One last thing.

While all of our betas have always been very safe, it's still a testing period. New issues, or the unknown will be found and discovered. Please use a test board if you are afraid of breaking your main/primary site so you can try to conduct a smooth transfer later.

Posted by: BeyondJaded May 26 2016, 01:42 PM
Hey John, can I get it here please?

http://igneoustest.jcink.net/

Posted by: John May 26 2016, 02:33 PM
QUOTE (BeyondJaded @ May 26 2016, 01:42 PM)
Hey John, can I get it here please?

http://igneoustest.jcink.net/

Done!

Posted by: owl May 26 2016, 03:10 PM
Since I had work yesterday I'm just getting around to playing around with it now and it's awesome. So far I just have one note, and I was wondering if it were possible to remove some of the line breaks and stuff included in some of the variables, for instance <!-- |online_today_list| -->

Even having the text "The following members have visited today" removed, or having a class thrown around extraneous text / line breaks / other formatting so it can be lifted out would be awesome.

I mean, granted, I can use CSS to sort of work around them, but in terms of the most possible customization I think it would be beneficial for the variables to be as straight forward as possible. Were they left in to support the way CFS handles it?

Edit: <!-- |online_legend| --> shows up as null while <!-- |online_list| --> has the online list and the legend.

Posted by: lexocity May 26 2016, 06:21 PM
Hi, me again Sorry i've been such a pain...


My sub boards are missing, and only went missing after we fixed the boards... Can't figure out why.

They're still in existence, but aren't visible.

Posted by: multiplicity! May 26 2016, 06:47 PM
    I noticed something while installing the topic rows formatting.

    One thing CFS did for us was inject different classes based on the different type of thread it was.

    The HTML looked like this per topic itself:

    user posted image

    while the html template output looks like this:

    user posted image

    I had to add the #new-topics div itself, but it did not translate well the way you see in the CFS version.

    I'm unsure of what the differences are, but this is the outcome of CFS:

    user posted image

    and this is the outcome of the HTML templates:

    user posted image

    Also, the following class would be amazing as well to add if possible:

    QUOTE
    <div class="topic-title-row">Important Topics</div>


    And I think the code is broken when it comes to the HTML template output? It seems the code breaks after the section of pinned topics ends. I don't know if that's intentional, but it doesn't allow me to style the pinned topics, etc. appropriately.

Posted by: John May 26 2016, 08:27 PM
I'm gonna have to check into all of these issues one by one, thanks for reporting them!

Posted by: RichLord May 27 2016, 02:49 AM
John, may my forum taste beta? ( http://sunchat.jcink.com )

Posted by: multiplicity! May 27 2016, 04:42 AM
    John

    I have two skins I would like to convert as they have differences in coding. Could you add http://brontiderp.jcink.net/index.php for beta testing? It is a premium forum.

Posted by: John May 27 2016, 09:25 AM
QUOTE (RichLord @ May 27 2016, 02:49 AM)
John, may my forum taste beta? ( http://sunchat.jcink.com )

Sorry, it is not premium, so you cannot beta test at this time.

Posted by: John May 27 2016, 09:27 AM
QUOTE (multiplicity! @ May 27 2016, 04:42 AM)
    John

    I have two skins I would like to convert as they have differences in coding. Could you add http://brontiderp.jcink.net/index.php for beta testing? It is a premium forum.

Will add these no problem.

As a note to everyone I don't think I'm going to get anything done on this today. I went to bed last night feeling ill and today's not much better. I'll prob be fine by weekend but just wanted to give a heads up --not ignoring the bugs/issues and the feedback so far has been greatly appreciated.

Posted by: multiplicity! May 27 2016, 09:50 AM
    QUOTE (John @ May 27 2016, 07:27 AM)

    Will add these no problem.

    As a note to everyone I don't think I'm going to get anything done on this today. I went to bed last night feeling ill and today's not much better. I'll prob be fine by weekend but just wanted to give a heads up --not ignoring the bugs/issues and the feedback so far has been greatly appreciated.


    First, thank you for doing so!

    And your health outside of any work is more important. Anyone who thinks otherwise has their priorities wrong. xD You feel better!

Posted by: bonbon May 27 2016, 10:03 AM
I hope you feel better soon John!

Just thought I'd post this anyway - is there a variable for the "online today" that is JUST the usernames and links? This is what I'm getting for <!-- |online_today_list| -->

https://gyazo.com/c70cd1c5cc5ab7666a1722902aa9e59d

Posted by: John May 27 2016, 10:13 AM
Yes I will be fixing that and many other bugs reported with the stats. It was an error that the text was included.

Posted by: owl May 27 2016, 02:45 PM
Sorry you're feeling poorly. My allergies have been kicking my ass lately, so I empathize.

Would you prefer we report any issues coming up with the performance of variables (for instance, I found a few that seemed off in the profile) or are you aware of them already, and are just waiting for time to tackle it?

Posted by: John May 28 2016, 08:45 AM
Just report everything you've noticed to be weird regarding the variables. I'm interested in the profile ones actually. Stats I have found to be messed up.

Posted by: Delphi May 28 2016, 09:09 AM
QUOTE (multiplicity! @ May 27 2016, 09:50 AM)

First, thank you for doing so!

And your health outside of any work is more important. Anyone who thinks otherwise has their priorities wrong. xD You feel better!


This. I had surgery myself but I can tell you I have been dreaming about working with this. DREAMING. I'm praying the next couple days will find me more focused and I can actually do stuff with it!

Posted by: John May 28 2016, 01:33 PM
Bugs corrected in board stats:
  • Online legend variable not null anymore
  • Members online returned blank
  • Online list returning the legend text along with it
  • Members online today list "The following members have visited today:" removed
  • Newest registered member was not linked
Default template example produced:

CODE
<div class="tableborder" id="boardstats">
 <div class="maintitle"><span class='bstats-text'>Board Statistics</span></div>
 <table cellpadding='4' cellspacing='1' border='0' width='100%'>        <tr>
          <td class='pformstrip' colspan='2'> <!-- |total_users| --> user(s) active in the past 60 minutes</td>
    </tr>
    <tr>
         <td width="5%" class='row2'><{F_ACTIVE}></td>
         <td class='row4' width='95%'>
  <span id='activeusers-stats'><b><!-- |total_guests| --></b> guests, <b><!-- |total_mems| --></b> members, <b><!-- |total_anons| --></b> anonymous members</span>
    <div class='thin'> <!-- |online_list| --></div>
           <span id='activeusers-links'>Show detailed by: <a href='http://forum.jcink.com/index.php?act=Online&amp;CODE=listall&amp;sort_key=click'>Last Click</a>, <a href='http://forum.jcink.com/index.php?act=Online&amp;CODE=listall&amp;sort_key=name&amp;sort_order=asc&amp;show_mem=reg'>Member Name</a></span>
         </td>
       </tr>
         <tr>
          <td class='pformstrip' colspan='2'>Today's Birthdays</td>
    </tr>
    <tr>
         <td class='row2' width='5%' valign='middle'><{F_ACTIVE}></div></td>
         <td class='row4' width='95%'><b> <!-- |birthdays| --></b> members are celebrating their birthday today<br /> <!-- |birthdays_list| --></td>
       </tr>     <tr>
      <td class='pformstrip' colspan='2'>Board Statistics</td>
    </tr>
    <tr>
   <td class='row2' width='5%' valign='middle'><{F_STATS}></td>
   <td class='row4' width="95%" align='left'>Our members have made a total of <b><!-- |total_posts| --></b> posts<br />We have <b><!-- |total_mem_reg| --></b> registered members<br />The newest member is <b><!-- |newest_member| --></b><br />Most users ever online was <b> <!-- |most_online| --></b> on <b> <!-- |most_online_date| --></b></td>
    </tr> <tr>
 <td class='pformstrip' colspan='2'>Members Online Today:  <!-- |online_today| --> <span id='mot_explink' style='display:none'>[<a href='javascript:expand_mot()'>Expand</a>]</span><span id='mot_collink' style='display:inline'>[<a href='javascript:collapse_mot()'>Collapse</a>]</span></td>
</tr>
<tr id='mot' style='display:inline-compact'>
 <td class='row2' width='5%' valign='middle'><{F_STATS}></td>
 <td class='row4' width='95%'><span id='activeusers-mostevertxt'>Most members ever online in one day was <b><!-- |most_online_oneday| --></b>, last accomplished on <b><!-- |most_online_oneday_date| --></b></span><br /><br /><span id='activeusers-followingtxt'>The following members have visited today:</span><br />
<!-- |online_today_list| -->
</td>
</tr>         </table>
 </div>
   <!-- Board Stats -->

Posted by: John May 28 2016, 01:35 PM
QUOTE (multiplicity! @ May 26 2016, 06:47 PM)
    I noticed something while installing the topic rows formatting.

    One thing CFS did for us was inject different classes based on the different type of thread it was.

    The HTML looked like this per topic itself:

    user posted image

    while the html template output looks like this:

    user posted image

    I had to add the #new-topics div itself, but it did not translate well the way you see in the CFS version.

    I'm unsure of what the differences are, but this is the outcome of CFS:

    user posted image

    and this is the outcome of the HTML templates:

    user posted image

    Also, the following class would be amazing as well to add if possible:

    QUOTE
    <div class="topic-title-row">Important Topics</div>


    And I think the code is broken when it comes to the HTML template output? It seems the code breaks after the section of pinned topics ends. I don't know if that's intentional, but it doesn't allow me to style the pinned topics, etc. appropriately.


Would you be able to provide a complete xml file of your skin to me at admin@jcink.com to look at?

Posted by: John May 28 2016, 02:12 PM
I think I see what's going on with the topics, cfs appears to rebuild them entirely rather than do what I originally thought it did and simply insert a template between the table tags. This explains why it's not translating so well. I'll figure something out. What I may need to do is create a topic row header wrapper like I did for the forums.

Posted by: John May 28 2016, 02:54 PM
Crystal found a bug, the iframe shoutbox was *not* showing up at all if you had HTML Templates activated. This has been fixed.

Posted by: owl May 28 2016, 02:54 PM
The following main profile variables seem to just show up blank to me:

<!-- |id| -->
<!-- |group| -->
<!-- |title| -->
<!-- |status| -->
<!-- |activity| -->

The custom fields work beautifully, though, I'm so excited.

Edit: Oh! I wanted to ask. Is there going to be a variable that gets that 'options' button that pops out with links to a persons threads / posts etc.? Also, it would be helpful to get a variable for the drop-down you can put in the profile to show all sub-accounts.

Also for forum row there's the <!-- |cat_id| --> variable. Should that just be in category headers, or have I gotten myself confused about how the former section should work?

Hope you feel better soon, Delphi.

Posted by: John May 28 2016, 02:57 PM
owl <!-- |cat_id| --> is a variable for both the individual forum rows as well as the category header template, just for convenience.

<!-- |id| -->
<!-- |group| -->
<!-- |title| -->
<!-- |status| -->
<!-- |activity| -->

shouldn't be showing up blank but i'll check them.

Posted by: John May 28 2016, 03:03 PM
owl try now, I made a stupid small mistake that caused those not to work in some conditions. It should be fine now.

QUOTE
Edit: Oh! I wanted to ask. Is there going to be a variable that gets that 'options' button that pops out with links to a persons threads / posts etc.? Also, it would be helpful to get a variable for the drop-down you can put in the profile to show all sub-accounts.


Yes I'll make variables for them both.

Posted by: owl May 28 2016, 03:25 PM
Yeah, I just came by to say that they are now working! That's so awesome, I can't wait to get more work done on the templates. Is there any way to take the parenthesis from around <!-- |status| -->? Sorry if I'm being a bother, I'm just trying to think of any little thing. And thank you for considering adding those variables.

Also, while I'm here, I wanted to ask: Are we going to have access to the default templates (the ones that are used when we haven't added our own)? I might be in the minority here, but I don't want to stray too far off the beaten path with my first few skins so my users have time to adjust - just want to tweak some things in some of these templates I usually end up forcing with CSS, here and there.

Posted by: John May 28 2016, 04:11 PM
status variable: will look into it

second question, the default system templates can be reconstructed, but you cannot edit the system template. for example if you wanted the system template for board stats, you could use the code above. i'm generating a set of "default" template skeletons as an example for learning as well and for those who only want to change a few things.

Posted by: owl May 28 2016, 04:47 PM
Sounds good to me, thanks for the response!

Posted by: Crystal May 28 2016, 07:49 PM
QUOTE (John @ May 28 2016, 02:54 PM)
Crystal found a bug, the iframe shoutbox was *not* showing up at all if you had HTML Templates activated. This has been fixed.


'Cause you broke it...

Bad John http://files.b1.jcink.com/html/emoticons/unsure.gif

Posted by: Gunblaza May 28 2016, 08:04 PM
QUOTE
Your full board url, with an active premium subscription


What about developers or development only boards?

Posted by: John May 28 2016, 08:08 PM
I suppose it would be fair to make an exception, in the case of this feature, for development boards.

If you're non-premium, I'll enable it on a test board.

I was planning on making this feature free to beta test quickly, but at this point I've got a lot of open problems right now, especially with the topics module needing to be re-thought out a little bit. So it will be longer before this is finalized and/or open to free boards.

Posted by: multiplicity! May 28 2016, 11:13 PM
    QUOTE (multiplicity! @ May 27 2016, 02:42 AM)
      John

      I have two skins I would like to convert as they have differences in coding. Could you add http://brontiderp.jcink.net/index.php for beta testing? It is a premium forum.


    I don't think this one was activated? Also, I was going to start work on a custom stats/profile so it's great news about those variables. http://files.b1.jcink.com/html/emoticons/biggrin.gif

Posted by: John May 29 2016, 12:33 PM
OK cool, sorry about that I missed it.

Also multiplicity! would you be willing to send me the xml file from that skin you were working on for the topics earlier? I would like to try to get it working on my dev board.

Posted by: Buttons May 29 2016, 02:07 PM
We would love to beta test this if you're still accepting testers.

http://statichogwarts1.jcink.net and http://bum.jcink.net

Posted by: multiplicity! May 29 2016, 02:37 PM
    QUOTE (John @ May 29 2016, 10:33 AM)
    OK cool, sorry about that I missed it.

    Also multiplicity! would you be willing to send me the xml file from that skin you were working on for the topics earlier? I would like to try to get it working on my dev board.


    I totally spaced on this. D:

    I uploaded the XML files for both skins (to show easy comparison, I think) and emailed them. ^^

Posted by: John May 29 2016, 04:43 PM
Thank you, got it.

Posted by: owl May 29 2016, 05:10 PM
So I know you have a lot on your plate right now, but while working on my templates I had an idea. I was wondering if there was a way that there could be a header section with each template that we could put content that we didn't want to repeat on the page but we want included. I'll add a screenshot with the (very) rough idea about what I'm talking about, just because I tend to have a hard time describing myself.

One of the things I was excited about with the template editing system was having a main CSS file, then creating separate files for template-specific CSS, so that if some part of the site is particularly complicated all that code wouldn't have to load on all the pages - this would likely be helpful for Javascript that might otherwise conflict, or complicated Javascript that's really only needed in one place.

I don't know if it's a viable suggestion, really, or even if it's something that concerns anyone outside of myself, but I thought I'd make note of it just in case.

Posted by: John May 29 2016, 05:24 PM
The layout of having the header/wrapper on top and the repeating section below is nice, though it shortens both editors. I don't think I will be adding a new header element for each template though, sorry. It would complicate the system as it is now.

The best practice for CSS is to put it all in a file rather than inline for performance. I haven't gotten around to making what I want for that to be organized/work though as of yet to make it easier to edit.

Posted by: John May 29 2016, 05:26 PM
QUOTE (Buttons @ May 29 2016, 02:07 PM)
We would love to beta test this if you're still accepting testers.

http://statichogwarts1.jcink.net and http://bum.jcink.net

Yes I'll add these.

Posted by: owl May 29 2016, 06:23 PM
QUOTE (John @ May 29 2016, 05:24 PM)
The layout of having the header/wrapper on top and the repeating section below is nice, though it shortens both editors. I don't think I will be adding a new header element for each template though, sorry. It would complicate the system as it is now.

The best practice for CSS is to put it all in a file rather than inline for performance. I haven't gotten around to making what I want for that to be organized/work though as of yet to make it easier to edit.


Yeah, usually I develop it live and then when I'm happy with it I put it in a file. My plan was to use a main file, and then a separate file for certain templates. Templates that don't repeat (board stats, main profile) wouldn't need their own header as such; I know it's not here, but I guess my biggest concern regarding this is the post template, because I suspect I will be using a lot of codes that otherwise don't effect the site.

I understand that it's worthwhile not to over-complicate things. Thanks for considering it.

Posted by: bonbon May 30 2016, 12:40 AM
Not sure if this is related, but the links to the moderating team, today's active topics, etc, seem to have disappeared once I used the board statistics HTML templates. This could be an issue with my own code (which I'm still going through) but I thought I'd mention it just in case.

Posted by: John May 30 2016, 12:47 AM
I actually hadn't noticed that. The board stats template replaces that entire bit, which contains that line. To maintain compatibility I'm probably going to need to adjust that to add those back. Thanks for pointing it out. I also notice it removes the quick-login feature as well.

Posted by: multiplicity! May 30 2016, 05:36 AM
    I may have found something else!

    The forum row variables work, however, I noticed redirect forums don't have individual variables or a way to program them individually based on the kind of forum it is.

    This is how it looks with the HTML/CSS customized via the templates:

    user posted image

    and this is how it looks with CFS, which is how I want redirect forums to look (as opposed to all other forums looking like the previous image:

    user posted image

    I can provide the coding I used for the CFS and the html template, individually, if you need me to.

    EDIT: As a note, the macro variable for redirect forum also doesn't work (it's not displaying the diamond next to the bigger diamond on the left (the little gray square should be the same as the CFS view)).

Posted by: owl May 30 2016, 02:23 PM
QUOTE (John @ May 30 2016, 12:47 AM)
I actually hadn't noticed that. The board stats template replaces that entire bit, which contains that line. To maintain compatibility I'm probably going to need to adjust that to add those back. Thanks for pointing it out. I also notice it removes the quick-login feature as well.


Are these just going to be added as new variables?

bonbon At any rate, here's the code to manually add it in until that's settled:

CODE
<div align="center" class="toplinks">
 <a href="/index.php?act=Stats&amp;CODE=leaders">The moderating team</a> |
 <a href="/index.php?act=Search&amp;CODE=getactive">Today's active topics</a> |
 <a href="/index.php?act=Stats">Today's top 10 posters</a> | <a href="/index.php?act=Members&amp;max_results=10&amp;sort_key=posts&amp;sort_order=desc">Overall top 10 posters</a>
 | <a href="/index.php?act=Members">View Members List</a></div>


I sort of like being able to add stuff that is just links manually because it gives you a lot more control, but this should help at least until there is a variable.

Posted by: John May 30 2016, 04:29 PM
I agree with having more control. I haven't decided how to approach those yet but adding some variables like <!-- |quick_login| --> and <!-- |toplinks| --> might work well and allow more control of course than just leaving them in hard set.

Regarding the redirect forums. I am aware of this actually. I really want to avoid having to add another template called "redirect row." But I spaced on posting the necessary redirect variables though to accomplish this... http://files.b1.jcink.com/html/emoticons/unsure.gif

I am going to focus on dealing with the topics first then look at everything else.

Posted by: GMaster479 May 30 2016, 05:34 PM
QUOTE (John @ May 30 2016, 04:29 PM)
I agree with having more control. I haven't decided how to approach those yet but adding some variables like <!-- |quick_login| --> and <!-- |toplinks| --> might work well and allow more control of course than just leaving them in hard set.


That would be nice. Do that with the delete cookies/mark board as read thing too.

QUOTE (John @ May 30 2016, 04:29 PM)
Regarding the redirect forums. I am aware of this actually. I really want to avoid having to add another template called "redirect row." But I spaced on posting the necessary redirect variables though to accomplish this...  http://files.b1.jcink.com/html/emoticons/unsure.gif


I hear you but it really would help. Redirect rows are tricky but I know that I have one too.


Posted by: lexocity May 31 2016, 11:17 AM
would it be a pain to remove "Subforums:" from the <!-- |subforums| --> variable?

Posted by: John May 31 2016, 11:39 AM
No it wouldn't, and I will, but you can do it with css for now:

.subforums span { display: none; }


Posted by: Delphi May 31 2016, 08:53 PM
Actually came to ask the same question as lexocity, and the

.subforums span { display: none; }

doesn't do anything for me as far as removing the words "subforums:", the only way I've been able to make it disappear actually removes the entire subforums list as well.

Posted by: John May 31 2016, 09:01 PM
It's

.subforums strong { display: none; }

Sorry.

Posted by: Lissi Jun 1 2016, 03:04 PM
Are you still accepting beta testers? I would love to sign up if so (http://lost.jcink.net/), I love this concept and would make things do much easier! I'm super excited about the HTML templates http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: John Jun 1 2016, 03:16 PM
Yep we are. Just be aware of the current issues of course. I will add you to the beta later. http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: Lissi Jun 1 2016, 03:45 PM
Thank you and I will be keeping an eye out for anything ^^

Posted by: John Jun 1 2016, 10:54 PM
Lissi I have enabled it.

By the way, thanks so much for everyone's patience and feedback. I'm hoping to get some time in soon to resolve these issues, and add redirect rows in (despite my reluctance unfortunately it seems necessary).

Posted by: icowolf Jun 2 2016, 01:03 AM
This is an amazing feature you've been working on and I'm excited to see what beautiful skins it brings down the road.

I'd love to be apart of the Beta Testing as well! My site is http://afterall.jcink.net/

Posted by: John Jun 2 2016, 10:44 AM
Thanks icowolf. At this time we are only accepting premium boards into the beta testing, but appreciate your interest.

Posted by: lexocity Jun 2 2016, 11:55 PM
I had a question about the board statistics. When I input my code in, it gets rid of the maintitle and toplinks above them. I wanted to keep them. Is there something I can put in my HTML to keep them above the custom stats?

Posted by: John Jun 3 2016, 01:00 PM
Redirect rows have now been added.

http://jcink.com/main/wiki/jfh-html-templates#redirect_rows_index_sub-forums

lexocity, since you are coming from CFS, try inserting this into your forum row template and copy your contents inside:

CODE
<div id="boardstats" class="tableborder">
   <div class="maintitle">Board Statistics</div>
   <!-- The markup generated by Custom Structure begins here. -->
   <div id="new-statistics">
      (INSERT YOUR FORUM ROW HTML HERE)
   </div>
   <!-- The markup generated by Custom Structure ends here. -->
</div>


Regarding the toplinks -- I am working on a solution to that, but here's the HTML owl provided that you can copy:

http://forum.jcink.com/index.php?showtopic=25520&view=findpost&p=189464

Posted by: John Jun 3 2016, 01:35 PM
And the solution is in. Just use the toplinks variable.

http://jcink.com/main/wiki/jfh-html-templates#board_statistics

New variables added: <!-- |quick_login| -->, <!-- |toplinks| -->

Example usage default template:

CODE
<!-- Board Stats -->
<div id='quick-login'>
 <!-- |quick_login| -->
</div>
   <br />
<!-- |toplinks| -->
   <br />
<div class="tableborder" id="boardstats">
 <div class="maintitle"><span class='bstats-text'>Board Statistics</span></div>
 <table cellpadding='4' cellspacing='1' border='0' width='100%'>        <tr>
          <td class='pformstrip' colspan='2'> <!-- |total_users| --> user(s) active in the past 60 minutes</td>
    </tr>
    <tr>
         <td width="5%" class='row2'><{F_ACTIVE}></td>
         <td class='row4' width='95%'>
  <span id='activeusers-stats'><b><!-- |total_guests| --></b> guests, <b><!-- |total_mems| --></b> members, <b><!-- |total_anons| --></b> anonymous members</span>
    <div class='thin'> <!-- |online_list| --></div>
           <span id='activeusers-links'>Show detailed by: <a href='http://forum.jcink.com/index.php?act=Online&amp;CODE=listall&amp;sort_key=click'>Last Click</a>, <a href='http://forum.jcink.com/index.php?act=Online&amp;CODE=listall&amp;sort_key=name&amp;sort_order=asc&amp;show_mem=reg'>Member Name</a></span>
         </td>
       </tr>
         <tr>
          <td class='pformstrip' colspan='2'>Today's Birthdays</td>
    </tr>
    <tr>
         <td class='row2' width='5%' valign='middle'><{F_ACTIVE}></div></td>
         <td class='row4' width='95%'><b> <!-- |birthdays| --></b> members are celebrating their birthday today<br /> <!-- |birthdays_list| --></td>
       </tr>     <tr>
      <td class='pformstrip' colspan='2'>Board Statistics</td>
    </tr>
    <tr>
   <td class='row2' width='5%' valign='middle'><{F_STATS}></td>
   <td class='row4' width="95%" align='left'>Our members have made a total of <b><!-- |total_posts| --></b> posts<br />We have <b><!-- |total_mem_reg| --></b> registered members<br />The newest member is <b><!-- |newest_member| --></b><br />Most users ever online was <b> <!-- |most_online| --></b> on <b> <!-- |most_online_date| --></b></td>
    </tr> <tr>
 <td class='pformstrip' colspan='2'>Members Online Today:  <!-- |online_today| --> <span id='mot_explink' style='display:none'>[<a href='javascript:expand_mot()'>Expand</a>]</span><span id='mot_collink' style='display:inline'>[<a href='javascript:collapse_mot()'>Collapse</a>]</span></td>
</tr>
<tr id='mot' style='display:inline-compact'>
 <td class='row2' width='5%' valign='middle'><{F_STATS}></td>
 <td class='row4' width='95%'><span id='activeusers-mostevertxt'>Most members ever online in one day was <b><!-- |most_online_oneday| --></b>, last accomplished on <b><!-- |most_online_oneday_date| --></b></span><br /><br /><span id='activeusers-followingtxt'>The following members have visited today:</span><br />
<!-- |online_today_list| -->
</td>
</tr>         </table>
 </div>
   <!-- Board Stats -->

Posted by: Buttons Jun 3 2016, 06:25 PM
QUOTE (John @ May 29 2016, 05:26 PM)
QUOTE (Buttons @ May 29 2016, 02:07 PM)
We would love to beta test this if you're still accepting testers.

http://statichogwarts1.jcink.net and http://bum.jcink.net

Yes I'll add these.


Were these enabled? They aren't showing up as usable yet on either forum. I just keep getting the "HTML Templates are currently under development! Please watch this section and check back later." message.

Just curious http://files.b1.jcink.com/html/emoticons/smile.gif No worries if you haven't had time yet!

Posted by: John Jun 3 2016, 06:32 PM
Buttons no I missed it, sorry. It should be good to go now.

Posted by: John Jun 4 2016, 10:30 AM
With the recent updates so far, besides the topics template which I'm still working on, how is everyone doing with their templates?

Posted by: Delphi Jun 4 2016, 10:53 AM
John

As you know I had surgery and I've been out of this testing-race which I'm super excited to see people making progress (and believe me I've been stalking it).

I have played with the category head and forum row to completion of what I want -- both of which seem to operate exactly how I've wanted them. Very easy to customize once you see the differences between CFS and these HTML templates. At first it was jarring because the method of editing was very different, but now it's easy to see/recognize (I blame Percocet).

My favorite thing so far is when CFS is installed on my site, when you refresh it briefly blinks with the old structure before it writes over it. This doesn't do that, I really think you did something awesome here John.

I was moving on to Topic Row editing today, but I may need to hold off until the Announcement/Pinned/etc are added/fixed just so I don't have to edit/re-edit. So instead, I think I'm going to tackle Board Stats.

I haven't run into any other issues.

Question though, what is Redirect Row used for? I tried look at the examples provided here for why it was necessary, but I'm having difficult understanding I guess.

Posted by: John Jun 4 2016, 11:07 AM
It's cool, and I'm glad to hear you're doing better enough to have played with it so far. I'm actually really happy that the least problems thus far have been with the forum rows - that was a major reason for doing this all along.

QUOTE (Delphi)
My favorite thing so far is when CFS is installed on my site, when you refresh it briefly blinks with the old structure before it writes over it. This doesn't do that, I really think you did something awesome here John.

I would love to take credit for this one as doing something amazing but I can't. What you and everyone else sees when this happens is just how Javascript works and is the difference between processing server-side and client side. What do I mean?

Well, in the case of CFS, the following need to occur:

1. The browser has to download the library and parse it.
2. The page needs to finish loading the elements to be changed.
3. When the elements load, the script runs, and does the template replacements.
4. While the script runs and iterates through each forum, variables are replaced
5. Finally it's done and the templates are finished being overwritten

All of this happens extremely quickly, but sometimes it doesn't. And when that happens, you'll experience a "flicker" effect. Refreshing is one understandable instance because of it having to download CFS again and the entire page contents, which depending on your internet connection can take time.

In the case of HTML templates, all of the steps above are eliminated, at the very least externally. Our server processes the variables instead and then prints that back to the user's browser. You and your member's browsers never do any work to replace any template - you simply download what the server gives you pre-processed and ready to go.

Anyway, when you do the board stats conversion coming from CFS I;d recommend you copy this into your template first:

CODE
<!-- The default markup generated by IPB 1.3.1 begins here. -->
<div id="boardstats" class="tableborder">
   <div class="maintitle">Board Statistics</div>
   <!-- The markup generated by Custom Structure begins here. -->
   <div id="new-statistics">
       <!--
           The user-defined value passed to 'html' will be used for
           key replacement to determine what is inserted here.
        -->
   </div>
   <!-- The markup generated by Custom Structure ends here. -->
</div>


This is because for the stats, I have chosen to remove the header element entirely to allow users to just create whatever they want. CFS did not do this, they left it in. So basically paste that above, and then paste your CFS code where this:

CODE
       <!--
           The user-defined value passed to 'html' will be used for
           key replacement to determine what is inserted here.
        -->


I will do a complete write-up in the wiki on migration from CFS and all of the little "gotchas" to help people out at some point.

Posted by: John Jun 4 2016, 11:09 AM
Ok in addition to the above:

QUOTE (Delphi @ Jun 4 2016, 10:53 AM)
Question though, what is Redirect Row used for? I tried look at the examples provided here for why it was necessary, but I'm having difficult understanding I guess.


JFH lets you create a forum that serves as a redirect to any URL. CFS and Invision Board itself use a separate template for those. multiplicity! brought it up here because she likes to have separate templates: http://forum.jcink.com/index.php?showtopic=25520&view=findpost&p=189449

If you are not using any redirect-forums, then you can just ignore this template.

EDIT: I started a simple migration guide

http://jcink.com/main/wiki/jfh-converting-cfs-html-templates

Posted by: owl Jun 4 2016, 01:49 PM
Things are going really well so far, to be honest. I've found editing the index in particular to work really smoothly, and all the fixed applied to the board stats has my index page looking pretty slick. My current concern regards these variables:

QUOTE (owl @ May 28 2016, 02:54 PM)
T...Oh! I wanted to ask. Is there going to be a variable that gets that 'options' button that pops out with links to a persons threads / posts etc.? Also, it would be helpful to get a variable for the drop-down you can put in the profile to show all sub-accounts...


Personally the last one is a priority more than the first one. I can likely figure out all the relevant links for he first one, but the absence of the second is keeping me back from continuing to edit the profiles, because it is an important feature for one of my usergroups.

Also, since it was brought up, are there any plans to handle the announcements / topic rows?

Posted by: John Jun 4 2016, 01:52 PM
QUOTE
Also, since it was brought up, are there any plans to handle the announcements / topic rows?

Yes, but I haven't figured out how to deal with it yet. CFS does something very different for those areas compared to the others and I did not realize it when the template was written. So I'm having to rethink that a little bit for compatibility.

I will look into the subaccounts dropdown variable, absolutely, the options as well.

Posted by: Delphi Jun 4 2016, 02:00 PM
John

Take credit, the fact that you're giving us this feature is what takes that lag spike out. It's an indirect credit, but a credit that is due.

Thank you for explaining redirect row, and I'm actually completely rebuilding everything since I'm doing a remodel of my site--I'm not actually converting full existing CFS. I figured it might be easier to start understanding it than converting it.

Posted by: Crystal Jun 5 2016, 10:49 AM
QUOTE (John @ Jun 4 2016, 01:52 PM)
QUOTE
Also, since it was brought up, are there any plans to handle the announcements / topic rows?

Yes, but I haven't figured out how to deal with it yet. CFS does something very different for those areas compared to the others and I did not realize it when the template was written. So I'm having to rethink that a little bit for compatibility.

I will look into the subaccounts dropdown variable, absolutely, the options as well.


We've had one rethinking yes, but what about second re-thinks?

Bug fixes?

Breakies...?

Afternoon crashes!

Has he heard about those!

http://files.b1.jcink.com/html/emoticons/laugh.gif

Posted by: John Jun 5 2016, 10:53 AM
QUOTE (Crystal @ Jun 5 2016, 10:49 AM)
QUOTE (John @ Jun 4 2016, 01:52 PM)
QUOTE
Also, since it was brought up, are there any plans to handle the announcements / topic rows?

Yes, but I haven't figured out how to deal with it yet. CFS does something very different for those areas compared to the others and I did not realize it when the template was written. So I'm having to rethink that a little bit for compatibility.

I will look into the subaccounts dropdown variable, absolutely, the options as well.


We've had one rethinking yes, but what about second re-thinks?

Bug fixes?

Breakies...?

Afternoon crashes!

Has he heard about those!

http://files.b1.jcink.com/html/emoticons/laugh.gif


You're supposed to be making me look good not bad!

Posted by: Crystal Jun 5 2016, 12:31 PM
QUOTE (John @ Jun 5 2016, 10:53 AM)
QUOTE (Crystal @ Jun 5 2016, 10:49 AM)
QUOTE (John @ Jun 4 2016, 01:52 PM)
QUOTE
Also, since it was brought up, are there any plans to handle the announcements / topic rows?

Yes, but I haven't figured out how to deal with it yet. CFS does something very different for those areas compared to the others and I did not realize it when the template was written. So I'm having to rethink that a little bit for compatibility.

I will look into the subaccounts dropdown variable, absolutely, the options as well.


We've had one rethinking yes, but what about second re-thinks?

Bug fixes?

Breakies...?

Afternoon crashes!

Has he heard about those!

http://files.b1.jcink.com/html/emoticons/laugh.gif


You're supposed to be making me look good not bad!


Not sure I agreed to this, when is it alleged I agreed to this "making you look good"...getting concerned here.

Posted by: Delphi Jun 5 2016, 01:39 PM
Best conversation ever. +1 for the lord of the rings references

Posted by: KR!S Jun 5 2016, 06:23 PM
If you're still accepting sites to participate I'd love to play with this!

My site is http://likeaheartbeat.b1.jcink.com.

Posted by: John Jun 6 2016, 09:58 AM
KR!S I have activated it for you.

Posted by: andhewaszeus Jun 6 2016, 01:14 PM
Wow I saw this in my admin panel on my site and was like "What's this? lol" Had to come find out! It looks really cool! Could you activate it for me too ?

Posted by: John Jun 6 2016, 03:58 PM
We are only accepting premium forums at the moment for the testing period, thanks for your interest though. Soon it will be available for all.

Posted by: GMaster479 Jun 7 2016, 07:11 PM
Currently in the title of the link to a topic, there is something that says:

This topic was started: (date)

Anyway that can be a topic variable? I don't see it currently in the documentation

Posted by: John Jun 7 2016, 07:16 PM
Are you testing the topic row templates? Those need to be fixed, so there are a lot of issues there. I'd recommend avoiding them entirely for now. The template HTML is going to drastically change.

Posted by: GMaster479 Jun 7 2016, 07:47 PM
QUOTE (John @ Jun 7 2016, 07:16 PM)
Are you testing the topic row templates? Those need to be fixed, so there are a lot of issues there. I'd recommend avoiding them entirely for now. The template HTML is going to drastically change.


Gotcha...

*GMaster479 erases 20 minutes of work

Posted by: lexocity Jun 8 2016, 12:49 AM
Hi there,

I noticed something weird while playing with custom profiles, how do I get the <!-- |pm| --> to show up?

There's a big space in my profile that its missing something. please help, i've been ripping my hair out.

http://lexietest1.jcink.net/index.php?showuser=1

Posted by: admirenothing Jun 9 2016, 11:07 AM
Been watching this for a while and I finally have some time to fiddle with some skin stuff. If you're still taking beta testers, I'd love to test it out at http://admirenothing.jcink.net (it's premium).

Posted by: John Jun 9 2016, 02:29 PM
admirenothing, enabled.

lexocity I will look into the PM variable issue, it may be a bug.

Posted by: Crystal Jun 9 2016, 03:17 PM
QUOTE (John @ Jun 9 2016, 02:29 PM)
admirenothing, enabled.

lexocity I will look into the PM variable issue, it may be a bug.


There's second bug...

Now we need crashies, servers down, and afternoon timeouts...

...then we'll have to toss the One Server to Rule Them All into the acidy caves of Lechuguilla, and then we'll all be safe.

FYI: John has never seen LoTR, yet I am working tirelessly to remedy this!

Posted by: John Jun 9 2016, 03:46 PM
>.> ............

Anyway

GMaster479 reported that name_url had an extra ? mark. This has been fixed. In addition, the forum_row variable <!-- |total_posts| --> has been fixed, there was an issue where the adding would be incorrect if number formatting was enabled.

Posted by: deetoxicity Jun 11 2016, 01:18 PM
Could I have this enabled on my test site, though it isn't premium? I don't want to enable and test it on my premium rp board and I never had reason to have my test site as premium, if so, it's: deetoxicitytests.jcink.net

Posted by: John Jun 11 2016, 01:22 PM
QUOTE (deetoxicity @ Jun 11 2016, 01:18 PM)
Could I have this enabled on my test site, though it isn't premium? I don't want to enable and test it on my premium rp board and I never had reason to have my test site as premium, if so, it's: deetoxicitytests.jcink.net


In this instance, yes, I'll enable it for you.

Posted by: deetoxicity Jun 11 2016, 01:28 PM
Thank you very much!

Posted by: poptart Jun 11 2016, 03:16 PM
I forgot to ask this but with CFS we are able to add different things to the boards/view profile and all that such as

insertBefore: " ",
subforumSeparator: " ",
subforumsNone: " ",
insertAfter: " "

or

htmlEnabled: 'true',
avatarDefault: ' ',
onlineActivityDefault: ' Offline '


which we can modify it to our liking. Are we going to be able to do this or is it not going to be possible? I know I asked about the sub-forum and you said it would more than likely be a macro but now I'm wondering about the rest.

Posted by: John Jun 11 2016, 03:31 PM
poptart

We're going to break down options like that by either adding them as Admin CP settings or adding necessary template as needed.

QUOTE
insertBefore: " ",
insertAfter: " "


If you want to insert anything before and after the forum row within the category headers. you have access to the entire category header template now to do this. This is why we made the "Category Header" template.

QUOTE
subforumSeparator: " ",


This will be a macro.

QUOTE
htmlEnabled: 'true',
avatarDefault: ' ',
onlineActivityDefault: ' Offline '


Regarding htmlEnabled: this was some trickery stuff that CFS did to enable html in the "interests" column. To supplement this, we will add an option that enables HTML for this area as well as the.custom profile fields, which is something users have wanted for some time now anyway.

We are also going to have to make a "Default Avatar" macro.

The last option I'm sure can be dealt with too.

Posted by: John Jun 11 2016, 03:48 PM
QUOTE
...It would be helpful to get a variable for the drop-down you can put in the profile to show all sub-accounts...


owl I have added <!-- |subaccounts| --> please try it.

I have also changed the behavior of two variables.

<!-- |pm| --> will now return the full URL instead of a link
<!-- |email| --> will now return the full URL instead of a link

This is because I believe returning the default "click here" links is pointless and provides less customization. <!-- |pm| --> also wasn't returning anything at all in certain instances as pointed out by lexocity, so thanks for the info.

Posted by: Slip Jun 11 2016, 05:12 PM
If you're still accepting testers, I'd love to be able to test this out as well. I have a testing board at http://symbolismskins.jcink.net/ - if you need the master Premium board, however, that'd be http://soulbound.jcink.net/

(If not, no worries - very excited to see this feature!)

Posted by: John Jun 11 2016, 05:14 PM
We are, I'll add you tonight.

Posted by: GMaster479 Jun 11 2016, 06:30 PM
Does the <!-- |folder_img| --> macro work right now for Topic row?

Posted by: John Jun 11 2016, 06:34 PM
It's supposed to, but it is not thoroughly tested at all. The topic row template remains to be dealt with at this time.

Posted by: GMaster479 Jun 11 2016, 06:41 PM
QUOTE (John @ Jun 11 2016, 06:34 PM)
It's supposed to, but it is not thoroughly tested at all. The topic row template remains to be dealt with at this time.


Well it isn't working at this time. Hopefully you don't change too much I'm so close to it looking nice.

Posted by: John Jun 11 2016, 06:43 PM
I'll be changing quite a bit nothing that probably cannot be adapted to. I still do not recommend anyone using it at this time.

Posted by: GMaster479 Jun 11 2016, 06:48 PM
QUOTE (John @ Jun 11 2016, 06:43 PM)
I'll be changing quite a bit nothing that probably cannot be adapted to. I still do not recommend anyone using it at this time.


It's on a test skin right now. Everyone loves the updates on the forum row that is the only thing that is live right now. Everything else is hidden.

Also before I do anything more, is there going to be another problem if I put in Members Online Today in the Board Stats HTML when I have certain groups not allowed to see it in their group settings?

Posted by: John Jun 11 2016, 06:54 PM
QUOTE (GMaster479 @ Jun 11 2016, 06:48 PM)
Also before I do anything more, is there going to be another problem if I put in Members Online Today in the Board Stats HTML when I have certain groups not allowed to see it in their group settings?

Yes and no. The members online variable will be blank -- it'll print nothing if the user group doesn't have permission to view it. So the integrity of the setting will be fine in that sense.

But, unless you do a conditional to check to see if that value is blank, they will still see your "Members online today" text itself, wherever that may be. So those users will see a section that doesn't ever print anything for them, potentially. It is up to the designer how they want to handle events like that.

Posted by: Delphi Jun 11 2016, 06:55 PM
Will there be a "Posts" template as well?

Alternatively, am I too tired and missing it?

Posted by: GMaster479 Jun 11 2016, 06:58 PM
QUOTE (John @ Jun 11 2016, 06:54 PM)

But, unless you do a conditional to check to see if that value is blank, they will still see your "Members online today" text itself, wherever that may be. So those users will see a section that doesn't ever print anything for them, potentially. It is up to the designer how they want to handle events like that.


Cool. Good to know. I'll probably throw in that conditional then. It's easy enough to do. Now the question is can I throw in Javascript in these templates to hide birthdays and such?
QUOTE (Delphi @ Jun 11 2016, 06:55 PM)

Alternatively, am I too tired and missing it?


You're not. I was going to work on that too.

Posted by: John Jun 11 2016, 07:04 PM
You are not tired. There is no option because it doesn't exist, but it will come when all of the base options are stable. So far from the feedback I'm getting, the forum rows are doing excellent and the board stats and profiles are fine as well. I just need to add some Admin CP settings to compensate missing parameters for those sections, as well as some macros and perhaps a variable or two that gets suggested, but that is all I'm seeing. I think I can then put my efforts into fixing up the topic rows.

After that, there are two final templates I will be doing before this feature is out of beta testing. Mini Profile and Post Row templates. I am saving these two tasks for last, as everything else we are working on now is much more critical to help users get off of CFS.

And some might think "we already have mini profiles, why are you doing that", and well, we do, but it is no longer logical to have the MP template section where it is anymore. An entire template system baked into JFH, so we are going to use it and encourage its usage instead, deprecating the old section. We will obviously be leaving the current section alone for a very long time but we hope users will switch everything over.

Mini profiles will have the same variables and everything, pretty much fully transferable, but we hope to foster mini profile code this easier to manage this way.

Posted by: John Jun 11 2016, 07:05 PM
QUOTE
Cool. Good to know. I'll probably throw in that conditional then. It's easy enough to do. Now the question is can I throw in Javascript in these templates to hide birthdays and such.


Yes, you can.

Posted by: Delphi Jun 11 2016, 07:10 PM
John

I'll fully admit, I'm using this to design my remodel (with the understanding that things may change/get shuffled, etc). Everything has gone smoothly, I haven't played with the member profile as of yet, but that's coming.

Posted by: GMaster479 Jun 11 2016, 07:25 PM
QUOTE (John @ Jun 11 2016, 07:05 PM)
QUOTE
Cool. Good to know. I'll probably throw in that conditional then. It's easy enough to do. Now the question is can I throw in Javascript in these templates to hide birthdays and such.


Yes, you can.


Great. Thank you. I figured out the code.

Posted by: John Jun 11 2016, 07:27 PM
QUOTE (GMaster479 @ Jun 11 2016, 07:25 PM)
QUOTE (John @ Jun 11 2016, 07:05 PM)
QUOTE
Cool. Good to know. I'll probably throw in that conditional then. It's easy enough to do. Now the question is can I throw in Javascript in these templates to hide birthdays and such.


Yes, you can.


Great...does jQuery work? Because right now it isn't http://files.b1.jcink.com/html/emoticons/sad.gif

jquery should have nothing to do at all with the templates. (by that, I mean, it should work. check your syntax).

Posted by: GMaster479 Jun 11 2016, 07:55 PM
QUOTE (John @ Jun 11 2016, 07:27 PM)
QUOTE (GMaster479 @ Jun 11 2016, 07:25 PM)
QUOTE (John @ Jun 11 2016, 07:05 PM)
QUOTE
Cool. Good to know. I'll probably throw in that conditional then. It's easy enough to do. Now the question is can I throw in Javascript in these templates to hide birthdays and such.


Yes, you can.


Great...does jQuery work? Because right now it isn't http://files.b1.jcink.com/html/emoticons/sad.gif

jquery should have nothing to do at all with the templates. (by that, I mean, it should work. check your syntax).


I fixed it. I just placed it in the wrong spot because I'm old and out of practice.

*GMaster479 goes to tackle the Main Profiles.

Posted by: admirenothing Jun 11 2016, 08:37 PM
Is there a particular way to format the category on the individual category page (as in http://admirenothing.jcink.net/index.php?c=1 as opposed to the index page), or is it supposed to match the index formatting?

I tweaked the sample given when the category formatting was introduced, but I know that has the collapse stuff isn't in the individual category pages so I wasn't sure if there was some additional things I had to do to get those pages to match the index.

Posted by: John Jun 11 2016, 08:45 PM
admirenothing
Looks like you found a bug. Individual category links aren't processing custom category headers. I'll fix that.

Posted by: admirenothing Jun 11 2016, 08:49 PM
QUOTE (John @ Jun 11 2016, 09:45 PM)
admirenothing
Looks like you found a bug. Individual category links aren't processing custom category headers. I'll fix that.


I thought that may have been the case, but I was just checking to make sure I wasn't missing something!

Posted by: GMaster479 Jun 11 2016, 09:23 PM
QUOTE (John @ Jun 11 2016, 07:04 PM)
So far from the feedback I'm getting, the forum rows are doing excellent and the board stats and profiles are fine as well. I just need to add some Admin CP settings to compensate missing parameters for those sections, as well as some macros and perhaps a variable or two that gets suggested, but that is all I'm seeing. I think I can then put my efforts into fixing up the topic rows.

After that, there are two final templates I will be doing before this feature is out of beta testing. Mini Profile and Post Row templates. I am saving these two tasks for last, as everything else we are working on now is much more critical to help users get off of CFS.

And some might think "we already have mini profiles, why are you doing that", and well, we do, but it is no longer logical to have the MP template section where it is anymore. An entire template system baked into JFH, so we are going to use it and encourage its usage instead, deprecating the old section. We will obviously be leaving the current section alone for a very long time but we hope users will switch everything over.

Mini profiles will have the same variables and everything, pretty much fully transferable, but we hope to foster mini profile code this  easier to manage this way.


Forum Rows are brilliant. I want <!-- last_post_avatar --> to be a thing but I know it isn't feasible.

Mini Profiles...as far as I know...are stable and transferable. I already moved them over. Are those not active yet? I thought they were because they were there.

Board Stats are good except for Birthday variables and Members Online today variables and the other ones that I'm sure. For anyone who wants something to hide birthdays, just make the id of anything birthday related #birthday and then throw this in at the end.

CODE
<script>if(<!-- |birthdays| --> == 0) { $("#birthday").remove(); }</script>


I threw in some quick classes for everything else I want hidden for my site and that worked splendidly. I am working on making Members Online Today collapse right now since there is no link or variable for that.

For Main Profiles, Gun and I did a lot of work making them look http://s20.jcink.net/index.php?act=Profile&MID=1 and I'm trying to recreate something similar to that now while taking out all the junk I don't want. If you can make that any easier I would love that.

For Topic Rows, I can't wait to see what you change. First, the <!-- |start_date| --> variable or something for the text that is currently in the HTML title would be wonderful. Also <!-- |folder_icon| --> , aside from not working on my board, is a weird name. Even if you just do <!-- |img_new_post| --> again there it would be consistent. Also the whole Important Topics versus Forum Topics thing is killer. Lastly if you could simply wrap SOME sort of <span> class around the Pinned: words and have that come over in the <!-- |prefix| --> variable so I don't have to add more useless conditional codes I would love that.

Post Row template would be absolutely amazing. So much code will disappear so I can't wait for that to be a thing. I'm curious how you plan on doing the Mini Profile code inside the post row. Would it be a variable inside the post row? Either way that is something I look forward to.

Anyway...I'm so happy this is fun. I haven't been this excited for designing something JFH in a while

Posted by: John Jun 11 2016, 10:57 PM
QUOTE
Mini Profiles...as far as I know...are stable and transferable. I already moved them over. Are those not active yet? I thought they were because they were there.


They aren't. It's just sitting in there, I wanted to do it before this went beta but I said screw it at the very end, so we had beta sooner.

QUOTE
Board Stats are good except for Birthday variables and Members Online today variables and the other ones that I'm sure.


Do you mean the variables are not working or...? Or are you just talking about the whole hiding sections deal.

QUOTE
I am working on making Members Online Today collapse right now since there is no link or variable for that.


I'll make one.

QUOTE
For Main Profiles, Gun and I did a lot of work making them look even better for Shift 2.0 and I'm trying to recreate something similar to that now while taking out all the junk I don't want. If you can make that any easier I would love that.


Indeed.

QUOTE
Post Row template would be absolutely amazing. So much code will disappear so I can't wait for that to be a thing. I'm curious how you plan on doing the Mini Profile code inside the post row. Would it be a variable inside the post row? Either way that is something I look forward to.


Similarly to how Category Header template contains a variable called <% FORUM_ROW %>, the post row template will contain a similar variable called <% MINI_PROFILE %>.

Posted by: GMaster479 Jun 11 2016, 11:13 PM
QUOTE
QUOTE
Mini Profiles...as far as I know...are stable and transferable. I already moved them over. Are those not active yet? I thought they were because they were there.


They aren't. It's just sitting in there, I wanted to do it before this went beta but I said screw it at the very end, so we had beta sooner.


Okay that makes sense. I hope nothing blows up when you make it start to work.

QUOTE
QUOTE
Board Stats are good except for Birthday variables and Members Online today variables and the other ones that I'm sure.


Do you mean the variables are not working or...? Or are you just talking about the whole hiding sections deal.


The whole hiding sections deal. All the variables are working as far as I know.

QUOTE
QUOTE
I am working on making Members Online Today collapse right now since there is no link or variable for that.


I'll make one.


THANK YOU! My version only worked once then it stopped working. Please remove the stupid [ ] around it too http://files.b1.jcink.com/html/emoticons/smile.gif

QUOTE
QUOTE
Post Row template would be absolutely amazing. So much code will disappear so I can't wait for that to be a thing. I'm curious how you plan on doing the Mini Profile code inside the post row. Would it be a variable inside the post row? Either way that is something I look forward to.


Similarly to how Category Header template contains a variable called <% FORUM_ROW %>, the post row template will contain a similar variable called <% MINI_PROFILE %>.


That was my original guess. I really want this to happen after you fix the topic rows. I'm so close to the topic rows being done and that would make me so happy.

Posted by: John Jun 12 2016, 11:12 AM
admirenothing, I have fixed the single category view http://files.b1.jcink.com/html/emoticons/smile.gif

Posted by: admirenothing Jun 12 2016, 11:20 AM
Awesome! Looks good now http://files.b1.jcink.com/html/emoticons/smile.gif

I did find another thing though. The forum-subheader row still shows up under the subforums (for example http://admirenothing.jcink.net/index.php?showforum=1).

I've been using .forum-subheader { display: none; } to hide it until you updated the single category view to see if that took care of it, but alas, it has not.

Posted by: John Jun 12 2016, 11:24 AM
admirenothing, it should have hid it. Please try placing it near the top to be sure that a CSS syntax error is not canceling it out.

Posted by: admirenothing Jun 12 2016, 11:28 AM
I worded that wrong. The css does hide it, but I wasn't sure if it was supposed to still be there because of the HTML template I've created for the forum/category.

Posted by: John Jun 12 2016, 11:34 AM
admirenothing unfortunately the template for the categories, and subforum wrappers are two different entities. The subforum display doesn't include the maintitle header. So that template does not affect this.

Before final release, I will probably add one last template called SubForum Header/Wrapper so that those like you who are redesigning everything do not have to resort to a cheap fix like that.

Posted by: Crystal Jun 12 2016, 12:11 PM
QUOTE (John @ Jun 9 2016, 03:46 PM)
>.> ............


Don't you speak to me in that language.

Posted by: John Jun 12 2016, 12:12 PM
QUOTE (Slip @ Jun 11 2016, 05:12 PM)
If you're still accepting testers, I'd love to be able to test this out as well. I have a testing board at http://symbolismskins.jcink.net/ - if you need the master Premium board, however, that'd be http://soulbound.jcink.net/

(If not, no worries - very excited to see this feature!)

Sorry I missed this, enabled!

Slip

Pages: (4) 1 2 3 ... Last »
'
Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)