一些非常粗糙的东西需要改进,但如果我了解你的需要,可以给你一个起点:使用[dr]
作为所需的短代码标记
function my_dream_shortcode($atts, $content = null) {
ob_start(); ?>
<ul>
<li class="button" onClick="get_data(\'corporate\')">Corporate</li>
<li class="button" onClick="get_data(\'sales\')">Sales</li>
<li class="button" onClick="get_data(\'support\')">Support</li>
</ul>
<div class="my_plugin_result"></div>
<style>
li.button{
list-style:none;
padding:4px 10px;
background-color:cadetblue;
margin:10px;
float:left;
min-width: 160px;
text-align: center;
cursor:pointer;
}
.my_plugin_result figure{
float:left;
padding:4px;
background:#ccc;
}
</style>
<script>
var myPluginAjaxUrl = \'<?php echo admin_url( \'admin-ajax.php\'); ?>\';
function get_data(term) {
jQuery.ajax({
url: myPluginAjaxUrl,
data: {
action: \'get_data_for_my_shortcode\',
term: term
}
}).done(function (response) {
console.log(response)
jQuery(".my_plugin_result").html(response);
});
}
</script>
<?php
return ob_get_clean();
}
add_shortcode("dr", "my_dream_shortcode");
add_action(\'wp_ajax_nopriv_get_data_for_my_shortcode\', \'get_data_for_my_shortcode\');
//add_action(\'wp_ajax_get_data_for_my_shortcode\', \'get_data_for_my_shortcode\');
function get_data_for_my_shortcode(){
global $wpdb;
$args = array(
\'post_type\' => \'post\',
\'tax_query\' => array(
array(
\'taxonomy\' => \'leadership\',
\'field\' => \'slug\',
\'terms\' => $_REQUEST[\'term\']
)
)
);
$response="";
$query = new WP_Query( $args );
while($query->have_posts() ):
if($query->have_posts() ):
$query->the_post();
$response.=\'<figure><img src="\'.get_the_post_thumbnail_url(get_the_ID(),\'medium\').\'"/></figure>\';
endif;
endwhile;
echo $response;
die();
}
感谢
@bulldog 编辑代码以在前端有效工作