芝麻web文件管理V1.00

编辑当前文件:/var/www/gruppocestari.com/wp-content/plugins/progetti/sezione-progetti.php

<?php
/**
 * Sezione progetti
 *
 * Plugin Name: Sezione progetti
 * Plugin URI:  https://www.pieromuscari.it/
 * Description: Mostra i progetti e i bandi creati nella sezione progetti - richiede ACF e Custom Post Type UI. Usa lo shortcode [progetti] per mostrare la griglia.
 * Version:     1.0
 * Author:      Piero Muscari
 * Author URI:  https://www.pieromuscari.it/
 *
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( 'Invalid request.' );
}

/* Griglia articoli */
function griglia_progetti() {
  global $post;
  ob_start();
  $default_img = "2444";
  $query_args = array(
    'posts_per_page' => -1,
    'post_type' => 'progetto',
    'post_status' => 'publish',
    );
  $the_query = new WP_Query( $query_args );

if ( $the_query->have_posts() ) {
    ?>
		<script>
			jQuery(function($) {
				$(".cercaprogetto").on("keyup", function() {
				  var value = this.value.toLowerCase().trim();
				  $(".progetto-item").show().filter(function() {
					return $(this).text().toLowerCase().trim().indexOf(value) == -1;
				  }).hide();
				});
				$('.filtro').click(function( event ) {
					event.preventDefault();
					var mes = $(this).attr("target");
					$('.progetto-item').toggle();
					$('.filtro').removeClass("attivo");
					$(this).addClass("attivo");
					$('.'+mes).toggle();
				});
			});
		</script>
		<style>
			.filtri-progetti {position: relative; width: 100%; padding: 1% 0 4%; display: flex; align-items: center;}
			.cercaprogetto {display: block; width: 100%; clear: both;}
			.cerca {margin-right: 20px}
			.filtro {background-color: var(--e-global-color-secondary); color: #fff; padding: 5px; margin-right: 20px; white-space: nowrap;}
			.attivo, .filtro:hover {background-color: var(--e-global-color-text);}
			.griglia-progetti {width: 100%; display: flex; width: 100%; justify-content: flex-start; flex-wrap: wrap; margin: 0 -2%}
			.progetto-item {display: block; width: 33.33%; padding: 2%;}
			.progetto-inner-box {position: relative}
			.progetto-thumbnail {height: 0; padding-bottom: 56.25%; overflow: hidden; position: relative; display: block;}
			.progetto-thumbnail > a {position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0;}
			.progetto-thumbnail img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover}
			.progetto-terms a {font-size: var(--e-global-typography-09ccc20-font-size); line-height: var(--e-global-typography-09ccc20-line-height); font-weight: var(--e-global-typography-09ccc20-font-weight); text-transform: var(--e-global-typography-09ccc20-text-transform); color: var(--e-global-color-secondary)}
			.progetto-categories {background-color: var(--e-global-color-secondary); left: 1%; bottom: 1%; padding: 4px; font-size: 1vh; position: absolute; z-index: 2;}
			.progetto-categories a {color: #fff; text-transform: uppercase; font-weight: bold}
			.progetto-text a {color: var(--e-global-color-text);}
			.progetto-scadenza {background-color: var(--e-global-color-primary); right: 1%; top: 1%; padding: 4px; font-size: 1vh; position: absolute; z-index: 2; color: #fff; font-weight: bold}
			.progetto-scadenza p {display: block; font-size: 70%; clear: both; margin-bottom: 0}
			.ordina {display: block; position: relative; float: right; background-color: var(--e-global-color-text); padding: 4px 8px; color: #fff; margin-bottom: 20px}
			@media (max-width: 1024px) {
				.griglia-progetti {grid-template-columns: repeat(2, 1fr);}
			}
			@media (max-width: 840px) {
				.griglia-progetti {grid-template-columns: repeat(1, 1fr);}
				.filtri-progetti {display: block}
				.cerca {display: block; margin-bottom: 20px;}
				.filtro {margin: 10px;}
				.filtro:first-of-type {margin-left: 0}
				.progetto-scadenza, .progetto-categories, .progetto-terms a {font-size: 2vh}
				.filtri-progetti {max-width: 100%; overflow-x: scroll}
				.progetto-item {width: 50%;}
			}
			@media (max-width: 480px) {
				.progetto-item {width: 100%;}
			}
		</style>
		<input type="text" class="cerca" class="cercaprogetto" placeholder="Digita qui la tua ricerca oppure usa i pulsanti sottostanti per filtrare">

		
		<div class="griglia-progetti">
		
	<?php
    while ( $the_query->have_posts() ) {
      $the_query->the_post();
      global $post;
      $categories = wp_list_pluck( get_the_terms( get_the_ID(), array('tipo', 'beneficiari') ), 'slug' );
      $benef = get_the_term_list( $post, 'beneficiari', '', ' | ', '' );
	  $tipo = get_the_term_list( $post, 'tipo', '', ' | ', '' );
	  $scadenza = get_field('scadenza');	
      ?>
<div class="progetto-item <?php foreach( $categories as $term ) { echo $term.' '; } ?>">
  <div class="progetto-inner-box">
    <div class="progetto-thumbnail"> 
		<a href="<?php echo get_permalink(); ?>" title="<?php the_title(); ?>" class="progetto-link">
			<?php if(has_post_thumbnail()){ the_post_thumbnail(); } else {echo wp_get_attachment_image( $default_img, 'full', "", array( "class" => "alternative-image" ) );} ?>      
		  </a>
	<div class="progetto-categories"><?php echo $tipo; ?></div>
	<?php if ($scadenza): ?><div class="progetto-scadenza"><p>scadenza</p><?php echo '<span class="data">'.$scadenza.'</span>'; ?></div><?php endif; ?>
	  </div>
    <div class="progetto-terms"><?php echo $benef; ?></div>
    <div class="progetto-inner-content">
      <div class="progetto-text">
        <h3 class="entry-title"> <a href="<?php echo get_permalink(); ?>/" title="<?php the_title(); ?>">
          <?php the_title(); ?>
          </a> </h3>
      </div>
    </div>
  </div>
</div>
<?php
}
wp_reset_postdata();
echo '</div>';
}
else {
  echo 'Attualmente non ci sono articoli da visualizzare.';
}
return ob_get_clean();
}
add_shortcode( 'progetti', 'griglia_progetti' );