I am having issues with a template being properly populated.
I have a store locator that lists pharmacies, and shows their correlating data (phone, address, hours of operation) + 3 buttons (view store, view flyer and Order Refill).
The function in the WordPress theme gets the data to be placed in the html template accordingly, for each item.
Order refill button is generated through a dynamic link that gets populated with the phone number and store name.
I am trying to achieve the following:
For stores that do not have the order refill (field id #no-order, value No / Empty), I want to hide the Order Refill button (id #order-refill-locator), and only show it for the stores that have the Refill field value as Yes - The data is being sent to the HTML template as
{{order-refill}}
if ($query->posts) {
foreach ($query->posts as $result) {
// echo "<pre>"; print_r( get_post_meta($result->ID, "wpsl_hours", true) ); die;
$src = wp_get_attachment_image_src( get_post_thumbnail_id($result->ID), 'thumbnail' );
if (!empty($src)) {
$image = $src[0];
} else {
$image = get_site_url() . '/store_default.jpg';
}
$args = array('orderby' => 'name', 'order' => 'ASC', 'fields' => 'all');
$terms = wp_get_post_terms( $result->ID, 'wpsl_store_category', $args );
$term_categories = '';
foreach ($terms as $term) {
$term_categories .= $term->slug . ', ';
}
$rs_categories = substr(trim($term_categories), 0, -1);
$hours = get_post_meta($result->ID, "wpsl_hours", true);
$excerpt = get_the_excerpt($result->ID);
$store_data[] = array(
'id' => $result->ID,
'name' => $result->post_title,
'description' => $result->post_content,
'lng' => get_post_meta($result->ID, "wpsl_lng", true),
'lat' => get_post_meta($result->ID, "wpsl_lat", true),
'address' => get_post_meta($result->ID, "wpsl_address", true),
'address2' => get_post_meta($result->ID, "wpsl_address2", true),
'link' => get_post_meta($result->ID, "wpsl_url", true),
'image' => $image,
'telephone' => get_post_meta($result->ID, "wpsl_phone", true),
'fax' => get_post_meta($result->ID, "wpsl_fax", true),
'email' => get_post_meta($result->ID, "wpsl_email", true),
'order-refill' => get_post_meta($result->ID, "wpsl_refill", true),
'city' => get_post_meta($result->ID, "wpsl_city", true),
'country' => get_post_meta($result->ID, "wpsl_country", true),
'zipcode' => get_post_meta($result->ID, "wpsl_zip", true),
'state' => get_post_meta($result->ID, "wpsl_state", true),
'hours' => day($hours, 'monday'),
'hours1' => day($hours, 'tuesday'),
'hours2' => day($hours, 'wednesday'),
'hours3' => day($hours, 'thursday'),
'hours4' => day($hours, 'friday'),
'hours5' => day($hours, 'saturday'),
'hours6' => day($hours, 'sunday'),
'flyer' => '/weekly-flyer/?store_code=' . get_post_meta($result->ID, "wpsl_address2", true),
'tag' => $rs_categories,
'category' => $rs_categories,
'href' => get_permalink($result->ID),
'color' => trim('#005392'),
'fontClass' => trim('fa-map-marker'),
'lat' => get_post_meta($result->ID, "wpsl_lat", true),
'lng' => get_post_meta($result->ID, "wpsl_lng", true),
);
}
}
How can I make this happen? I have tried making the template as PHP even and adding an IF statement to possibly hide it that way, but without success.
Any help would be greatly appreciated, thank you!
Edit: Template code below:
<ul>
<li data-markerid="{{markerid}}">
<div class="img-store">
<div class="loc-icon">
<svg width="25" height="22" viewBox="0 0 22 28" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(1 1)" stroke="#333" fill="none" fill-rule="evenodd">
<path d="M9.985 26.348S0 15.896 0 9.346C0 2.796 4.824 0 10.36 0c5.537 0 9.85 4.868 9.6 10.287-.25 5.42-9.975 16.06-9.975 16.06z"></path>
<ellipse cx="9.844" cy="9.643" rx="4.594" ry="4.5"></ellipse>
</g>
</svg> {{distance}} {{length}}
</div>
<!--<div class="loc-dist">{{distance}} {{length}}</div>-->
</div>
<div class="list-details">
<div class="list-content">
<div class="loc-name">
<a href="{{href}}" target="_blank">{{name}}</a>
</div>
<div class="loc-addr">{{address}}</div>
<div class="loc-addr3">{{city}}, {{country}} {{zipcode}}</div>
<div class="loc-phone"><i class="fa fa-phone"></i> {{telephone}}</div>
<div class="loc-hours"><span>Mon-Fri:</span> {{hours}}</div>
<div class="loc-hours"><span>Sat:</span> {{hours6}}</div>
<div class="loc-hours"><span>Sun:</span> {{hours5}}</div>
<!--<div> <a href="">{{flyer}}</a></div>-->
<div class="btn-tiny save-store-locator">
<a class="save-as" style="float: none;" onClick="saveStoreHeader(jQuery(this).data('lat'),jQuery(this).data('lng'));" href="javascript:void(0);" data-lat="{{lat}}" data-lng="{{lng}}" class="save-as" role="button">
Save as My Store
</a>
</div>
</div>
</div>
<div class="list-btn">
<div class="btn-tiny location-buttons">
<a href="{{href}}" role="button">
<span class="elementor-button-content-wrapper">
<span class="elementor-button-text">VIEW DETAILS</span>
</span>
</a>
</div>
<div class="btn-tiny location-buttons">
<a href="{{flyer}}" class="elementor-button-link elementor-button elementor-size-md tiny-btn-red tiny-small" role="button">
<span class="elementor-button-content-wrapper">
<span class="elementor-button-text">VIEW FLYER</span>
</span>
</a>
</div>
<div id="order-refill-locator" class="btn-tiny location-buttons" target="_blank">
<a href="{{order-refill}}" class="elementor-button-link elementor-button elementor-size-md tiny-btn-red" role="button">
<span class="elementor-button-content-wrapper">
<span class="elementor-button-text">ORDER REFILL</span>
</span>
</a>
</div>
</div>
</li>
</ul>
