Spoiler Tag

[King Kovifor]

Title: Spoiler
Tag: spoiler
Replacement:
<div class="fieldset">
<table class="tborder" cellpadding="5" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td class="tcat" colspan="3"><a style="float:right" href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="Show/Hide" /></a>Spoilers!</td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="">
<td class="alt1" align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>

Example: This is Hidden!
Use Option: Yes
Image: Leave Blank

Q. Why do I have to "use option"?
A. This will solve a bug when not using it. In the first coding it wasn't used, but it would only collapse the first usage of "" in the thread. Using option in the code allowed to to specify which usage of the tags to collapse.

Bugs: It's open by default! I'm working on getting it closed by default.

[Shack Networks]

This shows up the hidden text on mouseover of the topic title in showthreads and on forumhome.

[jj]

Nice option code :)

style="display:none;"

will do the hide job :)

[finn snor]

Where do i insert that html ?

[King Kovifor]

When you add the bbcode, there is a section for "Replacement" place it there.

[King Kovifor]

This shows up the hidden text on mouseover of the topic title in showthreads and on forumhome.
Not sure how to do it...

jj:

style="display:none;"

that'll do what?

[InsaneContender]

Not sure how to do it...

jj:

style="display:none;"

that'll do what?

<div class="fieldset">
<table class="tborder" cellpadding="5" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td class="tcat" colspan="3"><a style="float:right" href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="Show/Hide" /></a>Spoilers!</td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td class="alt1" align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>

Change it to that. It will be closed by default.

[SCRIPT3R]

any updates to this one?

[Danny W]

I noticed if you have more than 1 spoiler on a page the buttons only open the first one.

[Mythotical]

King Kovifor is away for the week, I will try to fix that problem.

[King Kovifor]

I noticed if you have more than 1 spoiler on a page the buttons only open the first one.
The spoiler tag should include:

and it'll collapse for all of them

[dartho]

I changed this ever so slight for my own uses - still all the original code.

I've called the code JOKE

<div class="fieldset">
<table class="tborder" cellpadding="5" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td class="tcat" colspan="3"><a style="float:right" href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="Click Me" /></a>{option}</td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td class="alt1" align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>


So bascially it shows the joke, and you click the "Click Me" button to show the punch line :)

Nice Hack - Thanks!!

[King Kovifor]

I changed this ever so slight for my own uses - still all the original code.

I've called the code JOKE

<div class="fieldset">
<table class="tborder" cellpadding="5" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td class="tcat" colspan="3"><a style="float:right" href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="Click Me" /></a>{option}</td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td class="alt1" align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>


So bascially it shows the joke, and you click the "Click Me" button to show the punch line :)

Nice Hack - Thanks!!

It's for your use. And if you want to change it to be used with jokes. Go right a head.

[ArchEnemy]

Thank you for that code (the joke one too). I find it useful to set the title of the hidden field, but would be even nicer when it would use a default name when nothing was specified. :)

When you add class="button", the button comes in the css style. Looks better.
<input type="button" class="button"

Ok, after some testing, ... another variation of the code above. It creates a box with a textlink (option), which opens and closes the box. So this one is without any additional ugly buttons.

<div class="fieldset">
<table class="tborder" cellpadding="5" cellspacing="0" border="0" width="100%" align="center">
<tr>
<td class="tcat" colspan="3"><a style="float:left" href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="hidden" value="{option}" />{option}</a><br></a></td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td class="alt1" align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>

[sbrum]

The spoiler tag should include:

and it'll collapse for all of them

This does not work for me either. Sometimes the first button opens the second spoiler.

[sbrum]

This does not work for me either. Sometimes the first button opens the second spoiler.

Sorry, its working now.

[Disasterpiece]

Hi

I wanted to use the option param, so the user could use this for his own text on the button.

so when he uses xyz then, the Button says "hideMe".

i'm looking for a better way for the unique id. creating a random id would be perfect, but i don't think this is possible in html. any solution?

[King Kovifor]

If you install the multi option hack somewhere here on the forum, you could change this up to be xyz. I'm not sure how you'd do the HTML, since I've never used the hack, but I know it exists.

[Adrian Schneider]

The unique identifier should be generated by PHP (hash, microtime, etc).

Then you could do HE DIES IN THE END! or if you want ... HE DIES IN THE END which would replace the default caption.

Just an idea to simplify the use. :)

[Disasterpiece]

Yeah, im kind of a noob in php, i can only html ^^

so, this is my modified code:
<div class="fieldset">
<table cellpadding="5" cellspacing="0" border="0" align="center">
<tr>
<td colspan="3" align="center"><a href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="{option}" /></a></td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>

i used the option param for the button's value AND the spoiler id. works in 80%; when users use different values for the buttons, but i wanted to use it in the signature. So there would be many buttons with the same id.

is it possible to use php code in the code field? when yes, could you give me the php code for creating a random number? would be great :D

[King Kovifor]

The unique identifier should be generated by PHP (hash, microtime, etc).

Then you could do HE DIES IN THE END! or if you want ... HE DIES IN THE END which would replace the default caption.

Just an idea to simplify the use. :)

How could I do that within the BBCode Manager?

[daboogas94e]

i can't seem to get the spoiler tags working at all

[King Kovifor]

i can't seem to get the spoiler tags working at all

What do you have in the BBCode Manager?

[smokey]

is it possible to use php code in the code field? when yes, could you give me the php code for creating a random number? would be great :D

Here's a quick fix.

Create a plugin, for the hook location choose postbit_display_complete and paste the following php code in the box:

$this->post['message'] = preg_replace('/\{rand_string\}/i',rand(0,32768),$this->post['message']);

The above code will change {rand_string} in a post to a random number (making it unique).

In the spoiler bbcode you created, find both:

spoiler_{option}

Replace both with:

spoiler_{rand_string}

Also I replaced "Spoiler!" in the header to "Spoiler for {option}". Just a suggestion to all.

Thanks for the bbcode btw, it was a great idea!

[TheoMessinis]

Thank you! Great spoiler! :D

[mikkitine]

Yeah, im kind of a noob in php, i can only html ^^

so, this is my modified code:
<div class="fieldset">
<table cellpadding="5" cellspacing="0" border="0" align="center">
<tr>
<td colspan="3" align="center"><a href="#top" onclick="return toggle_collapse('spoiler_{option}')"><input type="button" value="{option}" /></a></td>
</tr>
<tbody id="collapseobj_spoiler_{option}" style="display:none;">
<td align="$stylevar[left]" valign="top">{param}</td>
</tbody>
</table>
</div>i used the option param for the button's value AND the spoiler id. works in 80%; when users use different values for the buttons, but i wanted to use it in the signature. So there would be many buttons with the same id.

is it possible to use php code in the code field? when yes, could you give me the php code for creating a random number? would be great :D

Here's a quick fix.

Create a plugin, for the hook location choose postbit_display_complete and paste the following php code in the box:

$this->post['message'] = preg_replace('/\{rand_string\}/i',rand(0,32768),$this->post['message']);The above code will change {rand_string} in a post to a random number (making it unique).

In the spoiler bbcode you created, find both:

spoiler_{option}Replace both with:

spoiler_{rand_string}Also I replaced "Spoiler!" in the header to "Spoiler for {option}". Just a suggestion to all.

Thanks for the bbcode btw, it was a great idea!I combined both of your suggestions and the result was still unchanged. Spoiler tags with the same option only open the first spoiler. In fact, spoiler tags with a different option still only open the first spoiler.

[scottevtv]

The tag begins as "Spoiler about...", and then if the user clicks and cicks again the "Spoiler about" text is gone. This was a bit confusing.