-
Search Results
-
Hi,
I’ve searched as long as possible in the forum.
I’ve read the documentation.The ajax form search fields and reset, works well.
But I can’t get infinite scrolls to work.I’ve tryed with shortcode. I’ve put the shortcode in the WP classic editor. I’ve copied results.php in a subfolder of my theme (that is elementor hello theme) and I pasted in, the code of the results-infinite-scroll.php template.
In the settings the result url is filled etc etc.
Nothing. Scrolling nothing happens.Then I’ve tryed with custom setting. I’ve set a custom template in my theme with the code of the results-infinite-scroll.php template customized.
In the settings the result url is filled etc etc.
Ajax container = #main
Pagination Type is set to infinite scroll; show loading icon checkbox is checked, but it’s not loaded.
Post result selector = .search-results-item (but I’ve tryed without it, too)
Infinite Scroll Container: = empty (but I’ve tryed with #search-filter-results-list, too)
I’ve tryed all the other fields of the Ajax Pagination setting section, but nothing.
I’ve deactivated all plugin except ACF Pro, Custom post type UI and S&F Pro of course. Nothing
I’ve changed the theme with a default one. Nothing.The page is on a live web site that I’m developing. I can give the url but not publicly
Thanks in advance for your help
My custom template code:
<?php /* Template Name: Eventi */ get_header(); ?> <style> .content { width:1440px; margin:0 auto; padding:20px; } .search-results-wrapper { display:flex; flex-wrap: wrap; } .search-results-item { /*flex: 1 0 21%;*/ padding: 20px; display: flex; flex-direction: column; flex-basis: 25%; } .content-wrapper { flex: 1; } .post-thumb { height:300px; width:100%; background-position:center; background-size:cover; border-radius: 0 80px 40px 80px; border: 1px solid #15255E; } .post-thumb .term { display:inline-block; padding:5px 20px; background-color:#ccc; color:#FFF; min-width:200px; text-align:center; font-size: 20px; font-weight: 500; } .post-content { display:none; font-size:1rem; color:#010326; padding-top:20px; width:100%; } .post-title { color: #009cd3; font-size: 28px; margin-top:30px; } .post-event-date, .post-event-place { font-size: 16px; font-weight: 400; color: #009cd3; } .search-results-wrapper .btn-wrapper { margin-top:30px; } .search-results-wrapper .toggle_btn { width:100px; } .search-results-wrapper .btn-hover-last { width:75px; } .search-results-wrapper .btn-hover-first { margin-right:40px; } .search-results-wrapper .btn-hover-wrapper { text-align:left; position:relative; padding-right:20px; display:inline-block; } .search-results-wrapper .toggle-wrapper:after { content:"\f067"; font-size: 16px; top: 0px; right: 0px; position: absolute; -webkit-transition: all .5s ease-out; -moz-transition: all .5s ease-out; -o-transition: all .5s ease-out; transition: all .5s ease-out; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-family: 'FontAwesome'; color:#15255e; } .search-results-wrapper .toggle-wrapper.active:after { transform: rotate(-180deg); content:"\f068"; color:#009ad2; } .search-results-wrapper .btn-hover-wrapper a { display:block; position:relative; cursor:pointer; } .search-results-wrapper .btn-hover-wrapper img { transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; } .search-results-wrapper .btn-hover-last { padding:0; } .search-results-wrapper .btn-hover-last a { transform: translateY(-3px); } .search-results-wrapper .btn-hover-wrapper .hover-image { position:absolute; top:0px; left:0px; opacity:0; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; } .search-results-wrapper .btn-hover-wrapper:hover img { opacity:0; } .search-results-wrapper .btn-hover-wrapper:hover .hover-image { opacity:1; } </style> <div class="content"> <div class="inner-content"> <main class="main" role="main" id="main"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(''); ?> role="article" itemscope itemtype="http://schema.org/WebPage"> <header class="article-header"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <h1 class="page-title"><?php the_title(); ?></h1> </header> <!-- end article header --> <section class="entry-content" itemprop="text"> <?php the_content(); ?> </section> <!-- end article section --> </article> <!-- end article --> <?php endwhile; endif; ?> <?php wp_reset_query(); ?> <div> <?php echo do_shortcode('[searchandfilter id="1675"]'); ?> </div> <?php $args = array('post_type' => 'eventi'); $args['search_filter_id'] = 1675; $query = new WP_Query($args); if ( $query->have_posts() ) { ?> Found <?php echo $query->found_posts; ?> Results<br /> <div class="search-results-wrapper" id="search-filter-results-list"> <?php while ($query->have_posts()) { $query->the_post(); $content = get_the_content(); ?> <div class="search-results-item search-filter-result-item"> <div class="content-wrapper"> <?php if ( has_post_thumbnail() ) : $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'medium-large'); ?> <div class="post-thumb" style="background-image:url(<?=$featured_img_url ?>)"> <?php $terms = get_the_terms( $post->ID, 'tipologia' ); foreach($terms as $term) : ?> <span class='term' style="background-color:<?php the_field('tax_tipologia_color', 'tipologia' . '_' . $term->term_id) ?>"> <?php echo $term->name; ?> </span> <?php endforeach; ?> </div> <?php endif; ?> <h2 class="post-title"><?php the_title(); ?></h2> <div class="post-event-date"> <span class="from-date"><?php the_field("start_date"); ?></span> <?php if ( get_field("end_date") ) : ?> <span class="to-date"> - <?php the_field("end_date"); ?></span> <?php endif; ?> </div> <div class="post-event-place"><?php the_field("luogo"); ?></div> </div> <div class="btn-wrapper"> <div class="btn-hover-wrapper toggle-wrapper btn-hover-first"> <a class="toggle_btn" data-id="post-<?php the_ID(); ?>"> <img src="https://supernovae.kreas.it/wp/wp-content/uploads/2019/12/Scopri-di-piu-2.png" alt="Scopri di piu"> <img src="https://supernovae.kreas.it/wp/wp-content/uploads/2019/12/Scopri-di-piu_over.png" class="hover-image" alt="Scopri di piu over"> </a> </div> <div class="btn-hover-wrapper btn-hover-last"> <a href="<?php the_field("event_url"); ?>" target="_blank" title="Scopri di piu"> <img src="https://supernovae.kreas.it/wp/wp-content/uploads/2019/11/vai-al-sito-e1575911625135.png" alt="Vai al sito"> <img src="https://supernovae.kreas.it/wp/wp-content/uploads/2019/11/vai-al-sito-over-e1575911641927.png" class="hover-image" alt="Vai al sito"> </a> </div> <div class="post-content toggle-content" id="post-<?php the_ID(); ?>"> <?=$content ?> </div> </div> </div> <?php } ?> </div> <?php } else { ?> <div class='search-filter-results-list' data-search-filter-action='infinite-scroll-end'> <span>Non sono stati trovati eventi</span> </div> <?php } ?> </main> <!-- end #main --> </div> <!-- end #inner-content --> </div> <!-- end #content --> <script> jQuery(document).on('click', ".toggle_btn", function(event){ var post_id = jQuery(this).attr("data-id"); jQuery(this).parent().toggleClass('active'); jQuery("#" + post_id).toggle(500); event.preventDefault(); }); </script> <?php get_footer(); ?>