Two Versions of Tabs for Pages!

[DeletedUser]

I have been using a version of tabs for pages that work only for my paid teacher account, but it doesn't work for my free teacher account.

• I notice the version that works for the free account references "tabs" by using fragments.
• And the version I use that works only for the paid teacher accounts references "tabs" by using "kl_wrapper" classes.

I honestly don't know what any of these means.

• Pasted below are the codes for both versions.
• Anyone know why the "kl_wrapper" version doesn't work for the free teacher account?

"fragments" version

<div class="enhanceable_content tabs">
<ul>
<li><a href="#fragment-1">PUT TITLE FOR TAB HERE</a></li>
<li><a href="#fragment-2">PUT TITLE FOR TAB HERE</a></li>
<li><a href="#fragment-3">PUT TITLE FOR TAB HERE</a></li>
</ul>
<div id="fragment-1">PUT THE CONTENT FOR THE FIRST TAB HERE</div>
<div id="fragment-2">PUT THE CONTENT FOR THE SECOND TAB HERE.</div>
<div id="fragment-3">PUT THE CONTENT FOR THE THIRD TAB HERE</div>
</div>

 

"kl_wrapper" version

<hr style="border: 0; border-top: 5px double #000000;" />
<p>TEXT</p>
<hr style="border: 0; border-top: 5px double #000000;" />
<div id="kl_wrapper_3" class="kl_wrapper">
<div id="kl_panel_block_0">
<div class="kl_panels_wrapper kl_panels_tabs">
<h3 id="kl_panel_0" class="kl_panel_heading kl_panel_0">
<span style="color: #0000ff; font-size: 16pt;"><strong>TAB1</strong></span>
</h3>
<div id="kl_panel_0_content" class="kl_panel_content kl_panel_0" style="text-align: center;">
<p style="text-align: left;">TEXT</p>
</div>
<h3 id="kl_panel_1" class="kl_panel_heading kl_panel_1">
<span style="color: #0000ff; font-size: 16pt;"><strong>TAB2</strong></span>
</h3>
<div id="kl_panel_1_content" class="kl_panel_content kl_panel_1" style="text-align: center;">
<p style="text-align: left;">TEXT</p>
</div>
<h3 id="kl_panel_2" class="kl_panel_heading kl_panel_2">
<span style="color: #0000ff; font-size: 16pt;"><strong>TAB3</strong></span>
</h3>
<div id="kl_panel_2_content" class="kl_panel_content kl_panel_2" style="text-align: center;">
<p style="text-align: left;">TEXT</p>
</div>
<h3 id="kl_panel_3" class="kl_panel_heading kl_panel_3">
<span style="color: #0000ff; font-size: 16pt;"><strong>TAB4</strong></span>
</h3>
<div id="kl_panel_3_content" class="kl_panel_content kl_panel_3" style="text-align: center;">
<p style="text-align: left;">TEXT</p>
</div>
<h3 id="kl_panel_4" class="kl_panel_heading kl_panel_4">
<span style="color: #0000ff; font-size: 16pt;"><strong>TAB5</strong></span>
</h3>
<div id="kl_panel_4_content" class="kl_panel_content kl_panel_4" style="text-align: center;">
<p style="text-align: left;">TEXT</p>
</div>
<hr style="border: 0; border-top: 5px double #000000;" />
</div>
</div>
</div>

[kmeeusen]

Hi @DeletedUser 

I do not know, but I am just as curious as you.

I have used your first code snippet for years, and was not even aware of your second method, I just tested both methods in sandboxes from both FFT and a paid account. You are absolutely correct.

I do know that Canvas was planning to deprecate the the first method, and perhaps they already have, but only in the FFT version at this time.  I really don't know!?!

Let's see if some with an actual brain, and one they are not afraid to use, comes along to explain this for us.

Kelley

[DeletedUser]

Hi Kelley

I don't even remember where I got the kl_wrapper from.  I'm 99% certain I googled the fragment version, and some how Canvas turned it into the kl_wrapper version without me realizing it.  Thank you for confirming that I wasn't imagining this.  Let's hope someone knows about this and they can share with us.