Table of Contents
TabInclude Plugin
Compatible with DokuWiki
- 2024-02-06 "Kaos" yes
- 2023-04-04 "Jack Jackrum" yes
- 2022-07-31 "Igor" yes
- 2020-07-29 "Hogfather" yes
Similar to displaywikipage, include, tabbox
Summary
This DokuWiki plugin creates a tab-control for selected wiki pages. By clicking a tab, a DokuWiki page appears on the site using AJAX.
Demonstration: http://symplus.edu-wiki.org/doku.php?id=tabinclude_plugin
Syntax
You can specify tab pages to show by listing separated by comma. There are three mode to display tabs.
{{tabinclude>page1,page2,page3, ...}} | AJAX mode Selected tab is shown by using AJAX. No page transition. Some of Javascripts triggered by onLoad() doesn't work in tabs. |
{{tabembed>page1,page2,page3, ...}} | Embedded mode All contents for tabs are embedded in the page. No page transition. Loading of the page may take long time. |
{{tablink>page1,page2,page3, ...}} | Link mode Tabs are web links to navigate the page itself showing the selected tab page. This mode follows page transition. |
Alternative syntax
You can also specify tab pages by listing links. This syntax is available in only AJAX mode.
<tabbed> * page1 * page2 * ... </tabbed>
Initial page
Initial page just after loading is the first page of the list as default (page1 in the previous example). Also, the initial page can be defined with a prefix ' * ' (asterisk). The following example will show page2 at first.
{{tabinclude>page1,*page2,page3,..}}
Tab name
As default, a title of each tabs is the first heading of the page. If it is not found, page ID would be shown. You can also set a specific title in the tab by splitting with '|' (pipe). It is like a standard DokuWiki syntax to define a title of link.
{{tabinclude>page1|Top page,page2|Second page,page3,..}}
Appearance
The latest version is independent of jQuery tab UI. Combination of colors of text and background in the tab control are compliant with each template's colors written in lib/tpl/xxxx/style.ini. You can use this tab control in almost templates without destroying look & feel of them.
When you customize the style.ini file for entire style, then tab control follows the colors of it. For example, if you change __text__ color for both contents and the tab control. Further detailed styles are defined in lib/plugins/tabinclude/style.css.
The tab control showed good appearance with the following popular templates. :)
- dokuwiki/default
- monobook
- arctic
- arctic-mbo
- roundbox
- vector
Installation & setting
You can install this plugin with standard method in Admin→Manage Plugins. If you want to install manually, rename extracted zip folder to 'tabinclude' to place in lib/plugins/ directory.
You can configure settings in Admin→configuration to show/hide the followings.
- loading message
- initial page will be loaded by AJAX (only for AJAX mode)
- a link to the shown page at header
- a link to the shown page at footer
History
- (see further history in GitHub)
- 2013-02-05
- Tab control become independent on jQuery UI.
- Rewritten script.js converting from tw-sack to jQuery.
- CSS is compliant to each templates' color.
- localized to Japanese
- 2013-01-27
- Supported only recent version using jQuery UI. (Angua, Adolla Belle)
- 2008-10-13
- Vulnerability for XSS was fixed.
- ODT export has been supported.
Discussion
with Authorlist Plugin problema
Tabinclude does not work correctly with the Authorlist plugin. It does not show the authors at all or shows them from the page on which the Tabinclude plug-in code is.
absolute addresses
Great tool! Hence there are still some possibilities to improve it, as
- only absolute addresses are supported
- “.” or “:” are not recognized
Possible solution: In file “syntax.php” replace…
$pages = explode(',',$match);
with…
$pages = explode(',',$match); for ($i=0;$i<count($pages);$i++) { $pages[$i] = trim($pages[$i]); if (strstr($match,".:")) { resolve_pageid(getNS($ID),$pages[$i],$exists); } }
Description: If you want to use relative addresses, there has to be a (leading) “.:”, so if you have a index.txt and a page1.txt in the same folder, you´d write: {{tabinclude>.:page1}} to load page1 as a tab. “.:..:” or “.:..:..:” should work either.
Notice: Spaces in the page list (e.g. {{tabinclude>.:page1 , .:page2 }} shouldn't be a problem.
Deshi
Thanks for practical suggestion. The latest archive has been patched at function 'render()'. (around line 56, syntax.php) — Ikuo Obataya 2008/07/09 13:58
Thanks for the nice plugin. Suggestion: It would be very handy to show currently selected tab with different background color and removed border-bottom line on tab. Second feature request: add ability to select first connecting page without changing order of tabs, something like this
{{tabinclude>playground:test1,playground:test2,wiki:syntax | S }}
where S is number (for example = 2) and define which page should be start on load.
| S}}
can be optional, then without it (| S) first page in list would start first.
Alex 2008/09/30 02:42
You should add, that it will only work for two languages: Japanese and English. And look out for additional spaces at the bottom of the files.
— Bernd M. Radowicz 2009/04/10 14:13
(Why is the security note still here? In the author's Download and details page it states: “2008-10-13 Vulnerability for XSS was fixed.” | HSD – 1-nov-2008)
security note was removed. — Ikuo Obataya 2008/11/26 14:05
—-
always showing full addresses
my tabs always show full addresses including the complete namespace-path - even when I use relative addressing with .: or without any :
any chance to get rid of this an make tabinclude only show the pagename without any namespace?
I'm running DokuWiki Release rc2009-01-26 with tabinclude 2008-10-13.
Any help appreciated.
Thomas Springer 2009/07/11
How about using the first heading ? This plugin pick up the first heading for each tab name.
Anyway I'll add some options for settings of tab appearance someday.
2009/11/26 I.Obataya
It doesn't show the pages
I'm trying to use the editformhelppage plugin for my DokuWiki installation with monobook template. I also installed this plugin because I want to have several help pages but I realized that this plugin doesn't work for me. I see the tabs but when I click on them I only see “connecting…” for a second.
Any idea?
Maialen Otaegi 2009/09/14
Exporting to ODT doesn't work as expected
Exporting to ODT was claimed in changelog, but when I tried to do it, it failed for the first try (there was some PHP warnings, I haven't saved them and don't see them again), and rendered includes pages out of style for the second try (as “plain text” instead of paragraphs, tables, etc., producing a mess of all text from that page).
Versions: DokuWiki 2009-12-25, ODT 2009-07-02.
How can I make it to render pages properly?
Nikita Kipriyanov 2010/01/08
Appears to have issues with Edit page buttons
It appears that there may be a problem with the ti_initpage variable which causes the buttons above the text area in the Edit page to not appear. Disabling the plugin appeared to fix the problem.
Tony Sutherland 14th February 2010
I can confirm the problem. - By turning off tab-include, buttons are back. Mrma
Can be confirmed here. Turned off all other plugins. As soon as tabinclude is activated, toolbar buttons are gone.
Download
I cannot download it, it seems the domain is no more avaible. Is it avaible somewhere else?
Yes, I found an alternate at http://symplus.edu-wiki.org/en/tabinclude_plugin. — Rik Blok 2011/02/25 07:48
Update http://symplus.edu-wiki.org/doku.php?id=en:tabinclude_plugin 2013-01-29, Joe
Add a cache
Hi I would like to add a cache of the pages.. this makes the load faster on second load: Simply change the code in script.js to
var tabincludeCache = new Array(); var tabincludePage = "null"; function pl_ti_onTabClicked(page){ if(page){ document.getElementById('ti_content').style.visibility='hidden'; document.getElementById('ti_loading').style.display='block'; tabincludePage = page; if(tabincludeCache[page]) { document.getElementById('ti_content').innerHTML = tabincludeCache[page]; document.getElementById('ti_loading').style.display ='none'; document.getElementById('ti_content').style.visibility = 'visible'; }else{ pl_ti.sack.onCompletion = plugin_ti_refreshcontent; pl_ti.sack.URLString = ''; pl_ti.sack.runAJAX('call=content&page='+encodeURI(page)); } } } function plugin_ti_refreshcontent(){ data = this.response; document.getElementById('ti_content').innerHTML = data; document.getElementById('ti_loading').style.display='none'; document.getElementById('ti_content').style.visibility='visible'; tabincludeCache[tabincludePage] = data; }
best Simon-Shlomo Poil
jquery problem
When I include jquery javascript, it causes tabinclude to not load the initial page. Clicking on the tabs works properly, it's just the initial display when the page is first loaded. — serenewaffles 2012/01/20 04:32
This problem is unavoidable under angua because it includes jQuery by default. — serenewaffles 2012/01/28 21:19
Angua: first Tab won't open on load
Since installing Angua I have also a serious problem that the first tab on our primary page is not shown, i.e. remains unopened unless you actively click on it. It either stops me migrating to Angua or I will have to find another concept for the 6-Tab primary page. This behaviour happens not only with Monobook but also Default and Vector templates. I have tried temporarily disabling/re-enabling tabinclude to no avail. I'm not aware that I am using jQuery elsewhere on these pages? I do use the Box plugin on them but have also tried disabling this without any improvement. Pity, great plugin, hope someone posts a fix one day. — grockle 2012/02/09 17:00
It works for me under Angua + Arctic1) template. Demo. The first tab is shown on page load. — Rik Blok 2012/02/11 20:24How is your template “slightly modified”? What modifications were made? Did those modifications affect tabinclude? After modifying my template, I got the plugin to work, but that doesn't make this behavior any less of a bug. — serenewaffles 2012/02/17 21:09
Angua with jQuery
I added new version of tabinclude plugin using jQuery tab UI for Angua (or later) users.
Please choose tabinclude-jquery.zip at the top of this page instead of using 'Download' button.
— iobataya 2012/07/11 13:07
TIPS for tabinclude-jquery version
It will not work well except default template because it can not find html of the page to be shown in tab. A quick solution for other template user, please try to modify your jscript.js of this plugin as follows:
- jscript.js
jQuery(function(){ jQuery('#jquery-tabs').tabs( { ajaxOptions: {dataFilter:function(data){ //prevent call find() before the ajax request receives a response? jQuery(data).append('<br /><p>tabinclude</p>'); var bd = jQuery(data).find('.page'); // for template arctic-mbo and actic if (bd..length == 0){bd = jQuery(data).find('.right_page');} if (bd..length == 0){bd = jQuery(data).find('.left_page');} // for template monobook or vecter if (bd..length == 0){bd = jQuery(data).find('#bodyContent');} // nm replacement likely not work except default template? //var nm = jQuery(data).find(".pagename").html().replace('do=backlink','').replace(/title=".*"/,'title="Open this tab"'); return bd.html();} }, cache: true } ) });
This worked at least my DokuWiki installation. — s.sahara 2012-07-25
Thanks for checking and improving. The problem was that java script couldn't find id of element of page contents for various templates. — iobataya
Works with Weatherwax
Since I upgraded to Weatherwax a few days ago this plugin hasn't been working. It displays the tabs but they're non-functional. Presumably a Javascript error? I've tried updating but it didn't help. Is it just me? Thanks. — Rik Blok 2013/07/03 02:26
Sorry, my mistake. Tabinclude works fine under Weatherwax. The problem was another plugin using deprecated Javascript. (One of edittable, refnotes, or svgedit – I'm not sure which one yet.) — Rik Blok 2013/07/04 23:52
“…or svgedit. I'm not sure which one yet.” The plugin will not work with “Cell Background plugin (cellbg)” too.
NOT WORKING I added this plugin after I upgraded to Weatherwax. It has NEVER worked. It displays the tabs but they're non-functional. I do not have any of the above referenced plugins installed. I am also trying to use this with another plugin for discussions. Is it just me? What am I missing? Thanks. — Jeff K 2013/11/21 16:45
CONFIRMED
For me I just see random links bulleted. Doesn't work. Don't have conflicting plugins installed. Never been able to make this work
CONFIRMED AGAIN**
I test the plugin on the test wiki and I also can't switch the tabs. The default tab is shown correctly.
2014/04/11 09:28