Forums Forums Search & Filter Pro Getting started with styling the results template

Viewing 7 posts - 1 through 7 (of 7 total)
  • Anonymous
    #55814

    Hi

    Just purchased Search-Filter Pro, created my first form which is fine.

    I’ve copied the results.php into a Search-Filter folder within my theme as instructed in your guide.

    I now want to style my results similar to your Movie review demo with a 2 column layout and the search form on the left.

    Do you have any guides or the source code that you used to create the demo results to get me started?

    Also, have you ever known anyone using Search-Filter-Pro with Thrive Themes? Just interested to see what type of results other users have achieved.

    Thanks

    DavidT

    Trevor
    #55839

    Welcome David

    If you search for Thrive you will get many results, so yes, it works with it. For example:

    https://support.searchandfilter.com/forums/topic/filter-on-thrive-theme-builder-post-grid/

    But, it is easier for me to show you how over Skype.

    Trevor
    #55840
    This reply has been marked as private.
    Anonymous
    #56192

    Hi Trevor

    Thanks for the reply and offer of support, I’m in Leicester, UK so no problem with the timezone.

    I’m aiming to look at this tomorrow (Thursday 1st Sep) so ill get skype sorted and give you a shout probably around lunchtime when I see your online.

    Thanks

    David

    Trevor
    #56195

    OK. I will wait for you. Make sure that when you contact me you refer to this post by its url.

    Trevor
    #56333

    Here is the ‘starter’ results.php for your Thrive theme:

    <?php
    /**
     * Search & Filter Pro 
     *
     * Sample Results Template
     * 
     * @package   Search_Filter
     * @author    Ross Morsali
     * @link      http://www.designsandcode.com/
     * @copyright 2015 Designs & Code
     * 
     * Note: these templates are not full page templates, rather 
     * just an encaspulation of the your results loop which should
     * be inserted in to other pages by using a shortcode - think 
     * of it as a template part
     * 
     * This template is an absolute base example showing you what
     * you can do, for more customisation see the WordPress docs 
     * and using template tags - 
     * 
     * http://codex.wordpress.org/Template_Tags
     *
     */
    
    if ( $query->have_posts() )
    {
    	?>
    	
    	Found <?php echo $query->found_posts; ?> Results<br />
    	Page <?php echo $query->query['paged']; ?> of <?php echo $query->max_num_pages; ?><br />
    	
    	<div class="pagination">
    		
    		<div class="nav-previous"><?php next_posts_link( 'Older posts', $query->max_num_pages ); ?></div>
    		<div class="nav-next"><?php previous_posts_link( 'Newer posts' ); ?></div>
    		<?php
    			/* example code for using the wp_pagenavi plugin */
    			if (function_exists('wp_pagenavi'))
    			{
    				echo "<br />";
    				wp_pagenavi( array( 'query' => $query ) );
    			}
    		?>
    	</div>
     <div class="scbgi tt-search-results-posts-container" id="tt-search-results-container">	
    	<?php
    	while ($query->have_posts())
    	{
    		$query->the_post();
    		
    		?>
    		<div class="scc left">
    			<?php
    				if ( has_post_thumbnail() ) { ?>
    					<a class="rmich" href="<?php the_permalink(); ?>">
    						 <div class="rimc" style="background-image: url('
    						<?php the_post_thumbnail_url("small");?>
    							')"></div>
    			  </a>
    			<?php	} ?>
    
    			<div class="scbt">
    				 <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    			
    		 	 <p><br /><?php the_excerpt(); ?></p>
    			  <p><?php the_category(); ?></p>
    			  <p><?php the_tags(); ?></p>
    			  <p><small><?php the_date(); ?></small></p>
    			</div>
    			
    		</div>
    
    		<?php
    	}
    	?>
     </div>
    	Page <?php echo $query->query['paged']; ?> of <?php echo $query->max_num_pages; ?><br />
    	
    	<div class="pagination">
    		
    		<div class="nav-previous"><?php next_posts_link( 'Older posts', $query->max_num_pages ); ?></div>
    		<div class="nav-next"><?php previous_posts_link( 'Newer posts' ); ?></div>
    		<?php
    			/* example code for using the wp_pagenavi plugin */
    			if (function_exists('wp_pagenavi'))
    			{
    				echo "<br />";
    				wp_pagenavi( array( 'query' => $query ) );
    			}
    		?>
    	</div>
    	<?php
    }
    else
    {
    	echo "No Results Found";
    }
    ?>

    Let me know how you get on and if I can close the thread?

    Trevor
    #58496

    As I haven’t heard back from you, I will close the thread. If you have any questions, open a new thread, if necessary linking back to this one.

Viewing 7 posts - 1 through 7 (of 7 total)