Tabbed Sections in Post

[oxymelon]

Hello!

I am utterly stumped at this point. I've tested a simple tab code on numerous themes and read through both the CSS and forum templates and cannot find what the deciding factor is that either enables the tabbed sections in a post...or breaks it for any particular theme.

I found this thread that mentioned the theme might not be compatible (https://support.proboards.com/thread/660969/tabbed-section-post-plugin-working) but can't find the referenced section of code anywhere in either my CSS or forum templates. Or when I view the page source it's not there either.

[PTabbedContent]

[PTab=Tab 1 stuff] blah blah blah [/PTab]

[PTab=Tab 2 stuff] blah2 blah2 blah2 [/PTab]

[PTab=Tab 3 stuff] blah3 blah3 blah3 [/PTab]

[/PTabbedContent]

This is the test bbccode I've been working with. I cannot seem to find out what makes it compatible with a theme or not. I've also tested to see if some of the css styling options listed in the plugin css settings would work and....nadah. I must be missing some essential script code or CSS but I cannot find it listed anywhere as needed to install with the plugin. As far as I can tell, all I should need is just the plugin but it's not working.

This is the forum: morgaard.boards.net/thread/3/tab-testing

Can anyone help me?

Attachments:

[Chris]

SPOILER: Click to show

Aug 29, 2023 18:08:37 GMT -8 oxymelon said:

Hello!

I am utterly stumped at this point. I've tested a simple tab code on numerous themes and read through both the CSS and forum templates and cannot find what the deciding factor is that either enables the tabbed sections in a post...or breaks it for any particular theme.

I found this thread that mentioned the theme might not be compatible (https://support.proboards.com/thread/660969/tabbed-section-post-plugin-working) but can't find the referenced section of code anywhere in either my CSS or forum templates. Or when I view the page source it's not there either.

[PTabbedContent]

[PTab=Tab 1 stuff] blah blah blah [/PTab]

[PTab=Tab 2 stuff] blah2 blah2 blah2 [/PTab]

[PTab=Tab 3 stuff] blah3 blah3 blah3 [/PTab]

[/PTabbedContent]

This is the test bbccode I've been working with. I cannot seem to find out what makes it compatible with a theme or not. I've also tested to see if some of the css styling options listed in the plugin css settings would work and....nadah. I must be missing some essential script code or CSS but I cannot find it listed anywhere as needed to install with the plugin. As far as I can tell, all I should need is just the plugin but it's not working.

This is the forum: morgaard.boards.net/thread/3/tab-testing

Can anyone help me?

The issue remains.

That theme that is set as the default theme at morgaard.boards.net is incompatible with the plugin because of the reason given in the referenced thread. The plugin is looking for a table-cell with the class of content in order to identify the content part of the post versus the mini-profile part of the post.

That theme does not use table cells but instead opts to use DIVs thus the plugin can never find the post content

SPOILER: Click to show

• A theme that uses table cells to separate mini-profile content from actual post content

  
  

• The theme in question that uses DIVs instead

  
  

As mentioned also, the plugin is not editable so it cannot be edited to work with themes that do not use the traditional table-cell approach to content separation

[oxymelon]

SPOILER: Click to show

Aug 30, 2023 9:20:56 GMT -8 Chris said:

SPOILER: Click to show

Aug 29, 2023 18:08:37 GMT -8 oxymelon said:

Hello!

I am utterly stumped at this point. I've tested a simple tab code on numerous themes and read through both the CSS and forum templates and cannot find what the deciding factor is that either enables the tabbed sections in a post...or breaks it for any particular theme.

I found this thread that mentioned the theme might not be compatible (https://support.proboards.com/thread/660969/tabbed-section-post-plugin-working) but can't find the referenced section of code anywhere in either my CSS or forum templates. Or when I view the page source it's not there either.

[PTabbedContent]

[PTab=Tab 1 stuff] blah blah blah [/PTab]

[PTab=Tab 2 stuff] blah2 blah2 blah2 [/PTab]

[PTab=Tab 3 stuff] blah3 blah3 blah3 [/PTab]

[/PTabbedContent]

This is the test bbccode I've been working with. I cannot seem to find out what makes it compatible with a theme or not. I've also tested to see if some of the css styling options listed in the plugin css settings would work and....nadah. I must be missing some essential script code or CSS but I cannot find it listed anywhere as needed to install with the plugin. As far as I can tell, all I should need is just the plugin but it's not working.

This is the forum: morgaard.boards.net/thread/3/tab-testing

Can anyone help me?

The issue remains.

That theme that is set as the default theme at morgaard.boards.net is incompatible with the plugin because of the reason given in the referenced thread. The plugin is looking for a table-cell with the class of content in order to identify the content part of the post versus the mini-profile part of the post.

That theme does not use table cells but instead opts to use DIVs thus the plugin can never find the post content

SPOILER: Click to show

• A theme that uses table cells to separate mini-profile content from actual post content

  
  

• The theme in question that uses DIVs instead

  
  

As mentioned also, the plugin is not editable so it cannot be edited to work with themes that do not use the traditional table-cell approach to content separation

Thank you so much for the detailed explanation! So I suppose there is no way for me to adjust the theme to fit the plugin?

[Chris]

Aug 30, 2023 13:26:23 GMT -8 oxymelon said:

Thank you so much for the detailed explanation! So I suppose there is no way for me to adjust the theme to fit the plugin?

There might be a chance, given that the plugin defines its functions in the global space thus being vulnerable to having its function signatures overridden...

In the forum wrapper of that theme, find the $[header] variable and try adding the following script below that variable and see if the plugin takes the bait

<script>
(function patchTabbedTable(){

const PostItem = 'div.item.post[id]'; //tr.item.post
const PostContent = '.punishment-post'; //td.content;

window.tabification = function tabification(){
$(PostItem).each(function(){
var uname=$(this).find('div.mini-profile a.user-link').attr('title');
$(this).find(`${PostContent} div.message`).each(function(){
if ($(this).html().replace(/\n/g,'').match(/\[PTabbedContent/i)) {
$(this).html(tabbedTableMaker($(this).html().replace(/\n/g,''),uname));
}
});
});
if (openFirstTabByDefault) {
$('table.PT_table').each(function(){
$(this).find('div.PT_spots').first().show();
$('td#Table'+$(this).attr('id').split(/tablecount/)[1]+'Tab0').addClass('PT_tabs_selected');
});
}
}
})()
</script>

[oxymelon]

SPOILER: Click to show

Aug 30, 2023 23:07:18 GMT -8 Chris said:

Aug 30, 2023 13:26:23 GMT -8 oxymelon said:

Thank you so much for the detailed explanation! So I suppose there is no way for me to adjust the theme to fit the plugin?

There might be a chance, given that the plugin defines its functions in the global space thus being vulnerable to having its function signatures overridden...

In the forum wrapper of that theme, find the $[header] variable and try adding the following script below that variable and see if the plugin takes the bait

<script>
(function patchTabbedTable(){

const PostItem = 'div.item.post[id]'; //tr.item.post
const PostContent = '.punishment-post'; //td.content;

window.tabification = function tabification(){
$(PostItem).each(function(){
var uname=$(this).find('div.mini-profile a.user-link').attr('title');
$(this).find(`${PostContent} div.message`).each(function(){
if ($(this).html().replace(/\n/g,'').match(/\[PTabbedContent/i)) {
$(this).html(tabbedTableMaker($(this).html().replace(/\n/g,''),uname));
}
});
});
if (openFirstTabByDefault) {
$('table.PT_table').each(function(){
$(this).find('div.PT_spots').first().show();
$('td#Table'+$(this).attr('id').split(/tablecount/)[1]+'Tab0').addClass('PT_tabs_selected');
});
}
}
})()
</script>

You're absolutely brilliant!! That worked! Thank you SO much!

[Chris]

Glad to hear!
That particular theme retained the mini-profile class but if we add a mini-profile variable for themes that completely change that as well, then this solution could be used to patch most unconventional themes that find themselves incompatible with that plugin.

---

Edit:

<script>

(function patchTabbedTable(){

const postItem = 'div.item.post[id]'; //tr.item.post
const postContent = '.punishment-post'; //td.content;
const postAuthor =  'div.mini-profile'; //div.mini-profile

window.tabification = function tabification(){
$(postItem).each(function(){
var uname=$(this).find(`${postAuthor} a.user-link`).attr('title');
$(this).find(`${postContent} div.message`).each(function(){
if ($(this).html().replace(/\n/g,'').match(/\[PTabbedContent/i)) {
$(this).html(tabbedTableMaker($(this).html().replace(/\n/g,''),uname));
}
});
});
if (openFirstTabByDefault) {
$('table.PT_table').each(function(){
$(this).find('div.PT_spots').first().show();
$('td#Table'+$(this).attr('id').split(/tablecount/)[1]+'Tab0').addClass('PT_tabs_selected');
});
}
}
})();


</script>