Search Results for 'horizontal'

[Trevor]

If you search this forum for the key word horizontal, there are examples of Custom CSS that can be used to achieve the effect you want.

[Trevor]

Yes. You need to re-make the page without the sidebar. The forms will need some css to make it horizontal, but that is only a matter of making the <li> elements at the top level into display: inline-block.

Then I need to edit the results.php. I think this would be it:

<?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() )
{
	?>
	
	<div class="sixteen columns">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>
	
	<?php
	$column_count = 0;
	$last_class = "";
	while ($query->have_posts())
	{
		$query->the_post();
		if ($column_count == 0) echo '<div class="sixteen columns">';
		?>
		<div class="one_fourth<?php echo $last_class;?>">
			<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
			
			<p><br /><?php the_excerpt(); ?></p>
			<?php 
				if ( has_post_thumbnail() ) {
					echo '<span class="responsive">';
					the_post_thumbnail("small");
					echo '</span>';
				}
			?>
			<p><?php the_category(); ?></p>
			<p><?php the_tags(); ?></p>
			<p><small><?php the_date(); ?></small></p>
			
		</div>
		
		<?php
	 $column_count ++;
		if ($column_count == 4) {
			$column_count = 0;
			echo '</div>';
			$last_class = "";
		}
		if ($column_count == 3) {
			$last_class = " last";
		}
	}
	if ($column_count > 0) echo '</div>';
	?>
	<div class="sixteen columns">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>
	<?php
}
else
{
	echo "No Results Found";
}
?>

[Anonymous]

Hi,
the plug-in doensn’t work with my theme (Inovado).
The search section appears in this way:

I would like to display the search box horizontally, and I’m trying also to figure out how to display my results as a grid.

Thanks in advance,
carmine

[Trevor]

Hi Max

It depends a bit on your theme, but you will need some custom css. If you search this forum for the key term horizontal you will many example snippets of CSS that might work for you.

If I saw your form, I might be able to better advise you.

[Anonymous]

Hi, how can i embed all field horizontal?

[Trevor]

It rather depends what elements are in your form as to what the css would be. If you search this forum for the key word horizontal you will get many threads with sample code.

[Anonymous]

Hi, I’m using the Search & Filter Pro widget instead of WP’s regular search widget. I would like to make the search field longer (wider), and I would like the submit and reset fields to be side by side horizontally instead of on top of each other vertically. Can you help me with the css code needed to accomplish this? Thanks.

[Trevor]

Hi

1. The answer to this is dependent on how your site works and is structured. In general, if you want the same search form on many pages and for the results to appear on whichever page oyu happen to be on, that would require a new feature in Search & Filter pro (planned for the next major version, which is some while away yet), which is auto detect current page to be the results URL. However, under certain (varied) conditions, it is possible. Try using the Ajax option as well for this.

2. Again, somewhat dependent on your actual form, but search this forum for the key word horizontal for examples of custom css that do as you want.

[Anonymous]

hi trevor, nice to see you here also (i am ultimatum theme junky).

i dont want to change the results page, just the search form

i wanted it to be horizontal and also responsive on a ‘starter theme’ based on foundation.
my solution works great i just wanted it to be permanent solution.

it will be nice in the feutre to add this ability

[Anonymous]

hi,
first excelent plugin !
seconed this is for all RTL users who dont why the range slider handles dont move
to easly fix this just add to the your css file this line

.meta-slider.noUi-target.noUi-rtl.noUi-horizontal.noUi-background {
direction: ltr!important;
}

thanks again 🙂