We Keep Coding

Search query with filter

Thanks to the help of stack overflow I was able to make my filter work(Ajax filter for wordpress) but now I want to add a search input that search the titles of my posts (a custom post type called 'Contratistas').
So I have a few questions:
My form for my filter has POST, but the search (i've seen examples) always has GET, so, should I have two separete forms? If so, is there a way for submiting my search without a button? this is my code:
<form id="searchform" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<input type="text" class="search-field mb-3" name="s" placeholder="Search" value="<?php echo get_search_query(); ?>">
<input type="submit" value="Search" class="mb-3">
</form>
<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
<div class="titulo mb-3">
<h3>Región</h3>
</div>
<?php
if( $terms = get_terms( array( 'taxonomy' => 'region', 'orderby' => 'name' ) ) ) :
echo '<select name="filtroRegion"><option value="">Seleccione una región</option>';
foreach ( $terms as $term ) :
echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; // ID of the category as the value of an option
endforeach;
echo '</select>';
endif;
?>
<div class="titulo my-3">
<h3>Industrias</h3>
</div>
<?php
if( $terms = get_terms( array( 'taxonomy' => 'industria', 'orderby' => 'name' ) ) ) :
echo '<select name="filtroIndustria"><option value="">Seleccione una industria</option>';
foreach ( $terms as $term ) :
echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; // ID of the category as the value of an option
endforeach;
echo '</select>';
endif;
?>
<button class="my-3 filtrar">Filtrar</button>
<button>Limpiar filtros</button>
<input type="hidden" name="action" value="myfilter">
</form>
As you can see i have two buttons but i only want the last one ('Filtrar')
I have no idea how to implement the search with the filters so that i can put my results in the same fashion as the one i get from the dropdowns.
Here is my filter:
$args = array(
'orderby' => 'date', // we will sort posts by date
'order' => $_POST['date'], // ASC or DESC
'post_per_page' => -1,
'post_type' => 'contratista'
);
if (!empty($_POST['filtroRegion']) || !empty($_POST['filtroIndustria'])) {
$args['tax_query'] = array();
if (!empty($_POST['filtroRegion'])) {
$args['tax_query'][] = array(
'taxonomy' => 'region',
'terms' => $_POST['filtroRegion']
);
}
if (!empty($_POST['filtroIndustria'])) {
$args['tax_query'][] = array(
'taxonomy' => 'industria',
'terms' => $_POST['filtroIndustria']
);
}
if (count($args['tax_query']) > 1) {
$args['tax_query']['relation'] = 'AND';
}
}
$query = new WP_Query($args);
And my JQuery:
jQuery(function($) {
$('#filter').submit(function() {
var filter = $('#filter');
$.ajax({
url: filter.attr('action'),
data: $('#filter :input').filter(function(index, element) { return $(element).val() != ''; }).serialize(), // form data
type: filter.attr('method'), // POST
beforeSend: function(xhr) {
filter.find('.filtrar').text('Procesando...'); // changing the button label
},
success: function(data) {
filter.find('.filtrar').text('Filtrar'); // changing the button label back
$('#response').html(data); // insert data
}
});
return false;
}
}
Any help or guidance will be very appreciated. Thanks

I got it! Here's my working code in case somebody else needs it!
The answer was VERY simple! I only had to add this:
's' => $_POST['s']
Here is my function
function misha_filter_function(){
$args = array(
'orderby' => 'date', // we will sort posts by date
'order' => $_POST['date'], // ASC or DESC
'post_per_page' => -1,
'post_type' => 'contratista',
's' => $_POST['s'],
);
//Same code as before:
if( !empty($_POST['filtroRegion']) || !empty($_POST['filtroIndustria']) ){
$args['tax_query'] = array();
if(!empty($_POST['filtroRegion']) ){
$args['tax_query'][] = array(
'taxonomy' => 'region',
'terms' => $_POST['filtroRegion']
);
}
}
$query = new WP_Query( $args );
//my post
And my form:
<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
<h3>Buscar</h3>
<input type="text" class="search-field mb-3" name="s" placeholder="Busqueda por nombre" value="<?php echo get_search_query(); ?>">
<div class="titulo mb-3">
<h3>Región</h3>
</div>
<?php
if( $terms = get_terms( array( 'taxonomy' => 'region', 'orderby' => 'name' ) ) ) :
echo '<select name="filtroRegion"><option value="">Seleccione una región</option>';
foreach ( $terms as $term ) :
echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; // ID of the category as the value of an option
endforeach;
echo '</select>';
endif;
?>

How can I create a filterable portfolio in PHP (wordpress)?

I am currently working on my own personal portfolio website. I've made a custom post type using Pods to create portfolio items and i want to use the wordpress tags as the filter.
I've successfully received the portfolio items and the filters. But how can i make them clickable/filterable ? Everything I've found includes portfolio plugins etc. But I don't want to use that, is just want to create my own simple filterable portfolio.
Can someone help me out ?
Here is the code:
Filters:
$tags = get_tags();
$html = '<div class="post_tags centered-content"> Alles';
foreach ( $tags as $tag ) {
$tag_link = get_tag_link( $tag->term_id );
$html .= "<a href='#{$tag->slug}' title='{$tag->name} filter' class='button outline {$tag->slug}'>";
$html .= "{$tag->name}</a>";
}
$html .= '</div>';
echo $html;
Portfolio items:
function getPortfolio(){
global $post;
$portfolioargs = array(
'posts_per_page' => 999,
'orderby' => 'date',
'order' => 'DESC',
'post_type' => 'portfolio',
'post_status' => 'publish',
'suppress_filters' => false
);
$portfolioitems = get_posts($portfolioargs);
foreach ($portfolioitems as $portfolioitem) {
$feat_image = wp_get_attachment_image_src( get_post_thumbnail_id($portfolioitem->ID), 'full' );
$tags = wp_get_post_tags($portfolioitem->ID);
echo '<div class="card portfolio">';
echo '<a href="'. get_the_permalink($portfolioitem->ID) .'">';
echo '<figure>';
echo '<img src="'. pods_image_url($feat_image, 'card') .'"/>';
echo '</figure>';
echo '</a>';
echo '<div class="card-title-wrapper">';
echo '<h3>'. $portfolioitem->post_title .'</h3>';
echo '<span class="card-subtitle mdi mdi-tag-outline mdi-15px">';
foreach ( $tags as $tag ) {
echo $tag->name . ', ';
}
echo '</span>';
echo '</div>';
echo '<div class="card-content">';
echo '<p>'. $portfolioitem->post_content .'</p>';
echo '</div>';
echo '<div class="card-actions">';
echo 'Lees meer';
echo 'Bekijk website';
echo '</div>';
echo '</div>';
}
}
Check the screenshot here

In my opinion the best way to make these tags work as a filter is "AJAX".
here i have written your "tags" code to work as a javascript filter . hope it helps.
at first let rewrite your code to show tags , i add a line (created an input to send it with AJAX):
$tags = get_tags();
$html = '<div class="post_tags centered-content">
<input type='hidden' name='tag_filter' value=''>
Alles';
foreach ( $tags as $tag ) {
$tag_link = get_tag_link( $tag->term_id );
$html .= "<a title='{$tag->name} filter' class='button outline filterBtn {$tag->slug}'>";
$html .= "{$tag->name}</a>";
}
$html .= '</div>';
echo $html;
then we will have our javascript (jquery) to send the selected tag values:
$('.filterBtn').click(function(){
var selected_tag = $(this).text();
$('input[name="tag_filter"]').val(selected_tag);
$.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'post',
data: { action: 'data_fetch', filter: $('input[name="tag_filter"]').val()},
success: function (data) {
$('#yourResultDIV').html(data);
}
});
})
the next part is our PHP code to produce result base on our selected filter: (in functions.php)
add_action('wp_ajax_data_fetch' , 'resultsLoad');
add_action('wp_ajax_nopriv_data_fetch','resultsLoad');
function resultsLoad(){
$filter = $_POST['filter'];
global $post;
$portfolioargs = array(
'posts_per_page' => 999,
'orderby' => 'date',
'order' => 'DESC',
'post_type' => 'portfolio',
'post_status' => 'publish',
'tag' => $filter
);
$portfolioitems = get_posts($portfolioargs);
foreach ($portfolioitems as $portfolioitem) {
$feat_image = wp_get_attachment_image_src( get_post_thumbnail_id($portfolioitem->ID), 'full' );
$tags = wp_get_post_tags($portfolioitem->ID);
echo '<div class="card portfolio">';
echo '<a href="'. get_the_permalink($portfolioitem->ID) .'">';
echo '<figure>';
echo '<img src="'. pods_image_url($feat_image, 'card') .'"/>';
echo '</figure>';
echo '</a>';
echo '<div class="card-title-wrapper">';
echo '<h3>'. $portfolioitem->post_title .'</h3>';
echo '<span class="card-subtitle mdi mdi-tag-outline mdi-15px">';
foreach ( $tags as $tag ) {
echo $tag->name . ', ';
}
echo '</span>';
echo '</div>';
echo '<div class="card-content">';
echo '<p>'. $portfolioitem->post_content .'</p>';
echo '</div>';
echo '<div class="card-actions">';
echo 'Lees meer';
echo 'Bekijk website';
echo '</div>';
echo '</div>';
}
die();
}

Display widget from post on front page

In each of my posts I place a shop the post widget in them. The shop the post widget plugin php is provided down below. With this plugin you then only have to place a short short code in your post html. (the shop widget site gives you this code after you generate the widget)
An example short code you would place into post html - [show_shopthepost_widget id="2371382"]
What the widget would look like -
What I want to happen is to have the shop the post widget appear on my front page under the post title and excerpt. I tried to do this by adding in echo do_shortcode(). But that did not work. Does anyone have any solutions? I'm stumped, and would appreciate any help.
*I will have a different widget ID for each post, since each post will have a different shop the post widget.
so my front page post preview would look like this -
here is the plugin code (the site I use for the widget has many other shopping widgets such as boutique and lookbook, which is why you'll see a few other widgets besides the shop the post widget, which is what I'm working with)
<?php
/*
Plugin Name: rewardStyle Widget
Plugin URI: http://www.rewardstyle.com
Description: The rewardStyle plugin allows bloggers to use rewardStyle widgets on their WordPress blog
Author: rewardStyle
Author URI: http://www.rewardstyle.com
Version: 1.53
*/
require 'plugin-updates/plugin-update-checker.php';
$ExampleUpdateChecker = new PluginUpdateChecker_1_5(
'http://www.rewardstyle.com/assets/info.json',
__FILE__,
'rewardstyle-widgets',
1
);
/**
* Add these to the KSES 'Allowed Post Tags' global
* var. Keeps these tags from being removed in the
* save/update process.
*/
$GLOBALS['allowedposttags']['iframe'] = array(
'id' => TRUE,
'class' => TRUE,
'title' => TRUE,
'style' => TRUE,
'align' => TRUE,
'frameborder' => TRUE,
'height' => TRUE,
'longdesc' => TRUE,
'marginheight' => TRUE,
'marginwidth' => TRUE,
'name' => TRUE,
'scrolling' => TRUE,
'src' => TRUE,
'width' => TRUE
);
$GLOBALS['allowedposttags']['script'] = array(
'id' => TRUE,
'class' => TRUE,
'src' => TRUE,
'type' => TRUE,
'name' => TRUE
);
/**
* Add these to the Tiny MCE whitelist of acceptable Tags.
* This keeps the values available when loading the page,
* and when switching from Visual/Text Tabs
*/
function unfilter_iframe($initArray) {
if (isset($initArray['extended_valid_elements'])) {
$initArray['extended_valid_elements'] .= ",+iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]";
}
else {
$initArray['extended_valid_elements'] = "+iframe[id|class|title|style|align|frameborder|height|longdesc|marginheight|marginwidth|name|scrolling|src|width]";
}
return $initArray;
}
function unfilter_script($initArray) {
if (isset($initArray['extended_valid_elements'])) {
$initArray['extended_valid_elements'] .= ",+script[id|class|src|type|name]";
}
else {
$initArray['extended_valid_elements'] = "+script[id|class|src|type|name]";
}
return $initArray;
}
add_filter('tiny_mce_before_init', 'unfilter_iframe');
add_filter('tiny_mce_before_init', 'unfilter_script');
// Add shortcode support to completely bypass the iframe filter
add_shortcode( 'show_rs_widget', 'rs_show_widget');
function rs_show_widget($atts, $content = null) {
extract(shortcode_atts(array(
'wid' => '',
'blog' => '',
'product_ids' => '',
'rows' => '',
'cols' => '',
'brand' => '',
'price' => '',
'hover' => ''
), $atts));
$h = $rows * 120;
$w = ($cols * 110) + 50;
$magic_num = 0;
$how_tall = '120';
$prod_box = 'show';
if ($brand == 1) {
$magic_num++;
}
if ($price == 1) {
$magic_num++;
}
if ($hover == 1) {
$magic_num = 0;
$prod_box = 'hover-info';
}
if ($magic_num == 1) {
$how_tall = '162';
} else if ($magic_num == 2) {
$how_tall = '195';
}
$out = "<div style='width: ".$w."px; height: ".$how_tall."px; margin: 0px auto; background:white;'>
<iframe frameborder='0' width='".$w."px' height='".$how_tall."px' scrolling='no' src='http://currentlyobsessed.me/api/v1/get_widget?wid=".$wid."&blog=".$blog."&product_ids=".$product_ids."&rows=".$rows."&cols=".$cols."&brand=".$brand."&price=".$price."&hover=".$hover."'></iframe>
</div>";
return $out;
}
function ms_show_widget($atts) {
extract(shortcode_atts(array(
'id' => '0',
'image_id' => '0',
'width' => '0',
'height' => '0',
'adblock' => 'Disable your ad blocking software to view this content.',
'enableJs' => 'JavaScript is currently disabled in this browser. Reactivate it to view this content.'
), $atts));
$out = '<div class="moneyspot-widget" data-widget-id="'.$id.'">
<script type="text/javascript" language="javascript">
!function(d,s,id){
var e, p = /^http:/.test(d.location) ? \'http\' : \'https\';
if(!d.getElementById(id)) {
e = d.createElement(s);
e.id = id;
e.src = p + \'://widgets.rewardstyle.com/js/widget.js\';
d.body.appendChild(e);
}
if(typeof(window.__moneyspot) === \'object\') {
if(document.readyState === \'complete\') {
window.__moneyspot.init();
}
}
}(document, \'script\', \'moneyspot-script\');
</script>
<div class="rs-adblock">
<img src="//images.rewardstyle.com/img?v=2.11&ms='.$id.'&aspect" onerror="this.parentNode.innerHTML=\'Turn off your ad blocker to view content\'" />
<noscript>'.$enableJs.'</noscript>
</div>
</div>';
return $out;
}
add_shortcode('show_ms_widget', 'ms_show_widget');
function ltk_show_widget($atts) {
extract(shortcode_atts(array(
'user_id' => '0',
'rows' => '1',
'cols' => '6',
'show_frame' => 'true',
'padding' => '0'
), $atts));
$out = '<div class="ltkwidget-widget" data-rows="'.$rows.'" data-cols="'.$cols.'" data-show-frame="'.$show_frame.'" data-user-id="'.$user_id.'" data-padding="'.$padding.'">
<script type="text/javascript" language="javascript">
!function(d,s,id){
var e, p = /^http:/.test(d.location) ? \'http\' : \'https\';
if(!d.getElementById(id)) {
e = d.createElement(s);
e.id = id;
e.src = p + \'://widgets.rewardstyle.com/js/ltkwidget.js\';
d.body.appendChild(e);
}
}(document, \'script\', \'ltkwidget-script\');
if(typeof(window.__ltkwidget) === \'object\'){
if (document.readyState === \'complete\') {
__ltkwidget.init();
}
}
</script>
<div class="rs-adblock">
<img src="//assets.rewardstyle.com/images/search/350.gif" onerror="this.parentNode.innerHTML=\''.$adblock.'\'" />
<noscript>'.$enableJs.'</noscript>
</div>
</div>';
return $out;
}
add_shortcode('show_ltk_widget', 'ltk_show_widget');
function ltk_widget_version_two($atts) {
extract(shortcode_atts(array(
'app_id' => '0',
'user_id' => '0',
'rows' => '1',
'cols' => '6',
'show_frame' => 'true',
'padding' => '0'
), $atts));
$out = '<div id="ltkwidget-version-two'.$app_id.'" data-appid="'.$app_id.'" class="ltkwidget-version-two">
<script>var rsLTKLoadApp="0",rsLTKPassedAppID="'.$app_id.'";</script>
<script type="text/javascript" src="//widgets-static.rewardstyle.com/widgets2_0/client/pub/ltkwidget/ltkwidget.js"></script>
<div widget-dashboard-settings="" data-appid="'.$app_id.'" data-userid="'.$user_id.'" data-rows="'.$rows.'" data-cols="'.$cols.'" data-showframe="'.$show_frame.'" data-padding="'.$padding.'">
<div class="rs-ltkwidget-container">
<div ui-view=""></div>
</div>
</div>
</div>';
return $out;
}
add_shortcode('show_ltk_widget_version_two', 'ltk_widget_version_two');
function lookbook_show_widget($atts) {
extract(shortcode_atts(array(
'id' => '0',
'adblock' => 'Turn off your ad blocker to view content',
'enableJs' => 'Turn on your JavaScript to view content'
), $atts));
$out = '<div class="lookbook-widget" data-widget-id="'.$id.'">
<script type="text/javascript" language="javascript">
!function(d,s,id){
var e, p = /^http:/.test(d.location) ? \'http\' : \'https\';
if(!d.getElementById(id)) {
e = d.createElement(s);
e.id = id;
e.src = p + \'://widgets.rewardstyle.com/js/lookbook.js\';
d.body.appendChild(e);
}
if(typeof(window.__lookbook) === \'object\') if(d.readyState === \'complete\') {
window.__lookbook.init();
}
}(document, \'script\', \'lookbook-script\');
</script>
<div class="rs-adblock">
<img src="//assets.rewardstyle.com/images/search/350.gif" style="width:15px;height:15px;" onerror="this.parentNode.innerHTML=\''.$adblock.'\'" />
<noscript>'.$enableJs.'</noscript>
</div>
</div>';
return $out;
}
add_shortcode('show_lookbook_widget', 'lookbook_show_widget');
function shopthepost_show_widget($atts) {
extract(shortcode_atts(array(
'id' => '0',
'adblock' => 'Turn off your ad blocker to view content',
'enableJs' => 'Turn on your JavaScript to view content'
), $atts));
$out = '<div class="shopthepost-widget" data-widget-id="'.$id.'">
<script type="text/javascript" language="javascript">
!function(d,s,id){
var e, p = /^http:/.test(d.location) ? \'http\' : \'https\';
if(!d.getElementById(id)) {
e = d.createElement(s);
e.id = id;
e.src = p + \'://widgets.rewardstyle.com/js/shopthepost.js\';
d.body.appendChild(e);
}
if(typeof window.__stp === \'object\') if(d.readyState === \'complete\') {
window.__stp.init();
}
}(document, \'script\', \'shopthepost-script\');
</script>
<div class="rs-adblock">
<img src="//assets.rewardstyle.com/images/search/350.gif" style="width:15px;height:15px;" onerror="this.parentNode.innerHTML=\''.$adblock.'\'" />
<noscript>'.$enableJs.'</noscript>
</div>
</div>';
return $out;
}
add_shortcode('show_shopthepost_widget', 'shopthepost_show_widget');
function boutique_show_widget($atts) {
extract(shortcode_atts(array(
'id' => '0',
'adblock' => 'Turn off your ad blocker to view content',
'enableJs' => 'Turn on your JavaScript to view content'
), $atts));
$out = '<div class="boutique-widget" data-widget-id="'.$id.'">
<script type="text/javascript" language="javascript">
!function(d,s,id){
var e, p = /^http:/.test(d.location) ? \'http\' : \'https\';
if(!d.getElementById(id)) {
e = d.createElement(s);
e.id = id;
e.src = p + \'://widgets.rewardstyle.com/js/boutique.js\';
d.body.appendChild(e);
}
if(typeof window.__boutique === \'object\') if(d.readyState === \'complete\') {
window.__boutique.init();
}
}(document, \'script\', \'boutique-script\');
</script>
<div class="rs-adblock">
<img src="//assets.rewardstyle.com/images/search/350.gif" style="width:15px;height:15px;" onerror="this.parentNode.innerHTML=\''.$adblock.'\'" />
<noscript>'.$enableJs.'</noscript>
</div>
</div>';
return $out;
}
add_shortcode('show_boutique_widget', 'boutique_show_widget');
add_filter('widget_text', 'do_shortcode');
add_filter('the_excerpt', 'do_shortcode');
?>
and then my front-page.php
<?php
/*
* Template Name:
*/
get_header();
get_template_part ('inc/carousel');
$the_query = new WP_Query( [
'posts_per_page' => 14,
'paged' => get_query_var('paged', 1)
] );
if ( $the_query->have_posts() ) { ?>
<div id="ajax">
<?php
$i = 0;
while ( $the_query->have_posts() ) { $the_query->the_post();
if ( $i % 7 === 0 ) { // Large post: on the first iteration and every 7th post after... ?>
<article <?php post_class( 'col-sm-12 col-md-12' ); ?>>
<div class="large-front-container">
<?php the_post_thumbnail('full', array('class' => 'large-front-thumbnail')); ?>
</div>
<h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p class="front-page-post-excerpt"><?php echo get_the_excerpt(); ?></p>
<div class="front-post-info">
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
<?php get_template_part ('front-page-shop'); ?>
<?php get_template_part( 'share-buttons' ); ?>
<div class="front-comments"><?php comments_popup_link ('0', '1', '%', 'comment-count', 'none'); ?></div>
<?php echo do_shortcode("show_shopthepost_widget"); ?>
</article><?php
} else { // Small posts ?>
<article <?php post_class( 'col-sm-6 col-md-4' ); ?>>
<div class="front-thumbnail-image"><?php the_post_thumbnail('full', array('class' => 'medium-front-thumbnail')); ?></div>
<a class="front-page-post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<p class="front-page-post-excerpt"><?php echo get_the_excerpt(); ?></p>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
<?php get_template_part ('front-page-shop'); ?>
<?php get_template_part( 'share-buttons' ); ?>
<div class="front-comments"><?php comments_popup_link ('0', '1', '%', 'comment-count', 'none'); ?></div>
<?php echo do_shortcode("show_shopthepost_widget"); ?>
</article>
<?php
}
$i++;
}?>
</div>
<?php if(get_query_var('paged') < $the_query->max_num_pages) {
load_more_button();
}
}
elseif (!get_query_var('paged') || get_query_var('paged') == '1') {
echo '<p>Sorry, no posts matched your criteria.</p>';
}
wp_reset_postdata();
get_footer();
updated front-page.php
<?php
/*
* Template Name:
*/
get_header();
get_template_part ('inc/carousel');
$the_query = new WP_Query( [
'posts_per_page' => 14,
'paged' => get_query_var('paged', 1)
] );
if ( $the_query->have_posts() ) { ?>
<div id="ajax">
<?php
$i = 0;
while ( $the_query->have_posts() ) { $the_query->the_post();
if ( $i % 7 === 0 ) { // Large post: on the first iteration and every 7th post after... ?>
<article <?php post_class( 'col-sm-12 col-md-12' ); ?>>
<div class="large-front-container">
<?php the_post_thumbnail('full', array('class' => 'large-front-thumbnail')); ?>
</div>
<h2><a class="post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p class="front-page-post-excerpt"><?php echo get_the_excerpt(); ?></p>
<div class="front-post-info">
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
<?php get_template_part ('front-page-shop'); ?>
<?php get_template_part( 'share-buttons' ); ?>
<div class="front-comments"><?php comments_popup_link ('0', '1', '%', 'comment-count', 'none'); ?></div>
<?php echo do_shortcode("show_shopthepost_widget"); ?>
<?php if (shortcode_exists('show_shopthepost_widget')) {
// Get the value of the custom field defined in the editor
$widgetId = get_post_meta(get_the_ID(), 'shortcode_id', true);
// Check if a value is set
if (!empty($widgetId)) {
$shortcode = '[show_shopthepost_widget id="'.$widgetId.'"]';
} else {
// or use a default widget
$shortcode = '[show_shopthepost_widget id="12345_some_id"]';
}
do_shortcode($shortcode);
} ?>
</article><?php
} else { // Small posts ?>
<article <?php post_class( 'col-sm-6 col-md-4' ); ?>>
<div class="front-thumbnail-image"><?php the_post_thumbnail('full', array('class' => 'medium-front-thumbnail')); ?></div>
<a class="front-page-post-title" href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<p class="front-page-post-excerpt"><?php echo get_the_excerpt(); ?></p>
<a class="moretext" href="<?php the_permalink(); ?>">Read more</a>
<?php get_template_part ('front-page-shop'); ?>
<?php get_template_part( 'share-buttons' ); ?>
<div class="front-comments"><?php comments_popup_link ('0', '1', '%', 'comment-count', 'none'); ?></div>
<?php if (shortcode_exists('show_shopthepost_widget')) {
// Get the value of the custom field defined in the editor
$widgetId = get_post_meta(get_the_ID(), 'shortcode_id', true);
// Check if a value is set
if (!empty($widgetId)) {
$shortcode = '[show_shopthepost_widget id="'.$widgetId.'"]';
} else {
// or use a default widget
$shortcode = '[show_shopthepost_widget id="12345_some_id"]';
}
do_shortcode($shortcode);
} ?>
</article>
<?php
}
$i++;
}?>
</div>
<?php if(get_query_var('paged') < $the_query->max_num_pages) {
load_more_button();
}
}
elseif (!get_query_var('paged') || get_query_var('paged') == '1') {
echo '<p>Sorry, no posts matched your criteria.</p>';
}
wp_reset_postdata();
get_footer();

Actually, do_shortcode() is exactly what you need, except you need to input the entire shortcode as is, without altering it (ie removing the [])
This should display the widget above just fine:
echo do_shortcode('[show_shopthepost_widget id="2371382"]');
Also, I would suggest wrapping it in a shortcode_exists() check, otherwise it will spit out the shortcode on the page if the plugin is disabled or unavailable for any reason. Note that this function requires the shortcode to be passed without the [].
if (shortcode_exists('show_shopthepost_widget')) {
echo do_shortcode('[show_shopthepost_widget id="2371382"]');
}
The Wordpress Stack Exchange site might have more answers for you if you're ever stuck with WP. Hope this helps!
edit
Dynamic solution
If you need to display a different shortcode on each page, you can modify the above code to use custom fields to display any widget you associate with a page, or display a default widget if you didn't set any.
In the content editor
To do so, you need to edit your pages in your site's wp-admin and add a custom field to them with the ID of the widget you want to appear on the page, and name it something sensible like shortcode_id.
In your theme
You need to modify the logic to get the post meta with the shortcode_id key associated with your current page, and create the shortcode to display accordingly. Also, you can set a default widget that will appear if you don't set any for a page.
if (shortcode_exists('show_shopthepost_widget')) {
// Get the value of the custom field defined in the editor
$widgetId = get_post_meta(get_the_ID(), 'shortcode_id', true);
// Check if a value is set
if (!empty($widgetId)) {
$shortcode = '[show_shopthepost_widget id="'.$widgetId.'"]';
} else {
// or use a default widget
$shortcode = '[show_shopthepost_widget id="12345_some_id"]';
}
echo do_shortcode($shortcode);
}

A do_shortcode must be similar to
<?php do_shortcode("[show_shopthepost_widget]"); ?> - your code doesn't have []

Can you remove wordpress post tags with js/php after certain date (ACF date time picker)?

So my website lists upcoming film screenings in my area.
I'm using the ACF date time picker to only show posts/film screenings that are in the future in the wordpress loop.
I have tags filtering the results dynamically using ajax (thanks to https://www.bobz.co/ajax-filter-posts-tag/) except there are tags that aren't relevant to the results because they belong to posts that are older than the current date (past screenings).
*For example on the website, the 'animated film festival' is still coming up with the other tags.
I don't know if it's possible to delete a posts tags with PHP (within the post template while it loops through other posts) - and to delete the posts tags if the ACF date time field for that post is older than the current date.
I haven't found much luck googling this and I am a bit of a noob so...
This is my site: http://pigcine.pamrosel.com/
This is what I'm doing in my functions.php file at the moment:
// Get all tags and display
function tags_filter() {
$tax = 'post_tag';
$terms = get_terms( $tax );
$count = count( $terms );
if ( $count > 0 ): ?>
<div class="post-tags">
<?php
foreach ( $terms as $term ) {
$term_link = get_term_link( $term, $tax );
echo '' . $term->name . ' ';
} ?>
</div>
<?php endif; }
// Script for getting posts
function ajax_filter_get_posts( $taxonomy ) {
// Verify nonce
if( !isset( $_POST['afp_nonce'] ) || !wp_verify_nonce($_POST['afp_nonce'], 'afp_nonce' ) )
die('Permission denied');
$taxonomy = $_POST['taxonomy'];
// WP Query
$args = array(
'tag' => $taxonomy,
'post_type' => 'post',
'posts_per_page' => -1,
'meta_key' => 'datetime',
'orderby' => array(
'datetime' => 'ASC'
),
);
// If taxonomy is not set, remove key from array and get all posts
if( !$taxonomy ) {
unset( $args['tag'] );
}
$query = new WP_Query( $args );
if ( $query->have_posts() ) : while($query->have_posts()) : $query>the_post();
$today = date('Y-m-d H:i:s', strtotime('+9 hours'));
$event_date = get_field('datetime');
if (strtotime($today) <= strtotime($event_date)) {
?>
<div class="sl">
<div class="sl_closed">
<div class="col-2-8"><div class="modulepad">
<p><?php the_field('datetime'); ?></p>
</div></div>
<div class="col-3-8"><div class="modulepad">
<p><?php the_title(); ?><br>
<?php $wpmovieinput = get_field('movie_title'); $movie = imdb_connector_get_movie($wpmovieinput); echo implode(", ", $movie["directors"]); ?>
</p>
</div></div>
<div class="col-3-8"><div class="modulepad">
<p><?php the_field('location_name'); ?><br>
<?php $wpmovieinput = get_field('movie_title'); $movie = imdb_connector_get_movie($wpmovieinput); echo implode(", ", $movie["countries"]) . " "; echo $movie["released"] . " "; echo implode(", ", $movie["runtime"]); ?>
</p>
</div></div>
</div><!--SL_CLOSED-->
<?php } endwhile; ?>
<?php else: ?>
<h2>No posts found</h2>
<?php endif;
die();
}
add_action('wp_ajax_filter_posts', 'ajax_filter_get_posts');
add_action('wp_ajax_nopriv_filter_posts', 'ajax_filter_get_posts');

Change date format advanced custom fields wordpress

Hi I am working with advanced custom fields with wordpress and im trying to fix the date to show : 24/01/201 instead of 01/24/2013
I have been looking at the ACF site but I can't seem to find why it is doing this.
please find attached my code :)
<?php
// start query
$query_args = array(
// number of featured items to show
'posts_per_page' => '-1',
'post_type' => 'product',
);
$args = array(
'meta_key' => 'time_&_date',
'orderby' => 'meta_value_num',
'order' => 'DESC'
);
$the_query = new WP_Query( $args );
while ( $the_query->have_posts() ) : $the_query->the_post();
$date = DateTime::createFromFormat('Ymd', get_field('time_&_date'));
echo $date->format('M d, Y');
endwhile;
// start loop
$wp_query = new WP_Query($query_args);
if ($wp_query->have_posts()) {
echo '<ul class="eventslist">';
echo '</br>';
echo '</br>';
// start while
while($wp_query->have_posts()) : $wp_query->the_post();
$_product = new jigoshop_product(get_the_ID());
echo '<li>';
// Event container
echo '<a href="'.get_permalink().'">';
// Event title
echo '<div class="loop_title lightlinksnounderline"> <span>•</span>' . the_title('','',false);
echo '</a>';
echo '</div>';
echo '<h3 class="field_title_loop">Date &amp Time: '; the_field('time_&_date');
echo '</h3>';
echo '<div class="cart_button">' ; do_action('jigoshop_after_shop_loop_item', $post, $_product );
echo '</div>';
echo '</li>';
echo '<div class="price_cart">' ; do_action('jigoshop_after_shop_loop_item_title', $post, $_product);
echo '</div>';
echo '</br>';
echo '<div class="cart_line">';
echo '</div>';
// end while
endwhile;
echo '</ul>';
// end loop
// reset query
wp_reset_query();
}
?>

shouldn't your $date->format be (d M Y) for this?