You can copy and paste this into your HTML editor:
[thkBC height="300" width="500" anchortext="My Big Button" title="My Big Button" type="inline" inline_id="my_big_button"]
<div id="my_big_button"><p>[big-button]more[/big-button]</p></div>
Here is the step-by-step process:
- Create a <div id=”unique_id”> layer with a unique ID, and a paragraph <p> inside with the content that should appear in the Thickbox.
- Click on the Thickbox icon in the editor panel
- Enter link anchor text and the ThickBox Title
- Change “Show as” to “Inline”
- Enter the inline ID you assigned to your div & click Insert.
[thkBC height=”275″ width=”650″ anchortext=”More” title=”More” type=”inline” inline_id=”o11″]
<div id=”o11″><p>[big-button color=”blue” link=”http://google.com”%5Dmore%5B/big-button%5D</p></div>
This adds a button on the thickbox window. This isn’t what I want. I want a botton that opens up the thickbox window.
Example: You go to the site. You click the big blue button. The thickbox window opens with the iframe content.
@thumbtak – that’s what I thought, but your initial post said “button open IN thickbox”… anyway, thanks for the clarification. I don’t think you can do that with a shortcode. You would have to use a raw link parameter in shortcode and it will only work if you can add a class “thickbox” to the shortcode as attribute.
There is good information how to create thickbox links manually here http://jquery.com/demo/thickbox/ – scroll to the part where it says “Inline Content”
Your code should look like this:
[big-button color=”blue” class=”thickbox” link=”?height=300&width=300&inlineId=my_thickbox_content”]My Big Button[/big-button]
<div id=”my_thickbox_content”><p>Thickbox content goes here.</p></div>
Actually, you should be able to paste the above code and it should work as is. The only way it won’t work if your butoon shortcode doesn’t support class attribute…
I added the code you said above, and read the inline content at the link you gave.
This is what I got:
http://i44.tinypic.com/1t4tpw.png
Now. The button does nothing, even after adding the link before the question mark. The other part is text that does nothing. What I want is the button to open the thickbox window without showing any text below it. The button will open up a link and show it in the thickbox window.
Can you post a live link to the example above?
Here is the exact code that is used for the example.
[big-button color="blue" class="thickbox" link="http://google.com?height=300&width=300&inlineId=my_thickbox_content"]My Big Button[/big-button]
<div id="my_thickbox_content"><p>Thickbox content goes here.</p></div>
Here is the link to the page it can be found on:
Link
@thumbtak – I hope you’re realizing that we’re talking about not my plugin here, but rather about a very unique case of a very specific shortcode provided by your theme(?) or another plugin. So, this is not a support question.
Now, this is a basic HTML thing. Your button’s shortcode generated the following HTML:
<a href="http://google.com?height=300&width=300&inlineId=my_thickbox_content"class="big-btn blue" target="">My Big Button</a>
So, it looks like it doesn’t support “class” attribute, because the class thickbox was not added.
Anyway, this is the code that you need at the end:
<a class="big-btn blue" href="#TB_inline?height=300&width=500&inlineId=my_big_button_window" title="Big Button Window" class="thickbox">My Big Button</a>
<div id="my_big_button_window">
<p>Thickbox content goes here.</p>
</div>
Copy and paste that into your post as is and forget about the shortcodes.
Thanks for your help.
This is how I fixed the issue.
– I manually setup thickbox, which I found out wasn’t needed, but it worked.
– I made a stand alone wordpress button. Took a screenshoot and cropped out the button. I then edited the button to remove the background.
– I then uploaded the image to a folder on my server.
– I used the following custom code.
<a href="?ajax.PHP?keepThis=true&TB_iframe=true&height=275&width=650" title="More" class="thickbox"><img src="../images/buttons/more.png" border="0"></a>
Have you tried the solution I posted in my last reply? It’s the same button that you initially had and much easier that what you came up with. Whatever works for you the best.
I did try it. It had the same outcome. A button and text below it, with the issue of the button not working.
Sorry, the link had 2 classes, that must’ve broke it. Here it is again:
<a class="big-btn blue thickbox" href="#TB_inline?height=300&width=500&inlineId=my_big_button_window" title="Big Button Window">My Big Button</a>
<div id="my_big_button_window">
<p>Thickbox content goes here.</p>
</div>
This has to work, it works on my site.
Okay, now it is working. I switched it to iframe. Thanks.
