use wordpress thickbox with dynamic content in admin

Viewed 514

I have used wordpress row action for my custom post type which has goal to show some post meta and some other data about that post in a thickbox. I'm searching for a way to do it dynamically for each post. any solution to handle this ? this is the current row action link :

<a href="#TB_inline?width=600&height=550&inlineId=my-content-id&_post_id=' . $post->ID . '" class="thickbox">edit</a>
2 Answers

Use a thickbox require some steps :

Step 1

You need to add thickbox to your WordPress post. You can do this by adding the add_thickbox function to the ‘init’ function of your theme. In particular, add the code below to your theme functions.php file.

add_action('init', 'init_theme_method');
 
function init_theme_method() {
   add_thickbox();
}

Step 2

Now we can just add the button right in our post and link it to thickbox by specifying class="thickbox". Click on the HTML tab in your post editor and paste the HTML code below into your post.

<div style="text-align:center;padding:20px 0;"> 
<input alt="#TB_inline?height=300&amp;width=400&amp;inlineId=examplePopup1" title="add a caption to title attribute / or leave blank" class="thickbox" type="button" value="Show Thickbox Example Pop-up 1" />  
</div>

Step 3

Finally, we specify the content that goes into our pop-up window by creating a div with id="examplePopup1".

<div id="examplePopup1" style="display:none">
<h2>Example Pop-up Window 1</h2>
<div style="float:left;padding:10px;">
<img src="http://shibashake.com/wordpress-theme/wp-content/uploads/2010/03/bio1.jpg"  width="150" height = "168"/>
</div>
I was born at DAZ Studio. They created me with utmost care and that is why I am the hottie that you see today. My interests include posing, trying out cute outfits, and more posing.
 
<select name=""><option>test</option></select>
 
<strong>Just click outside the pop-up to close it.</strong>
</div>

Hope this will work.

You just need to add an element inside the popup with an ID, then you can put any content into it (and you can change it any time):

<div id="examplePopup1" style="display: none;">
  <div id="placeOfDynamicContent">
  </div>
</div>

Load some content dynamically:

$('#placeOfDynamicContent').load('https://example.net')
Related