Wrap Search results in DIV tage

  • Hi all.

    My site https://www.skipperbar.co.za has all content from pages and posts in a DIV tag <div style="width: 790px; height: 365px; margin: 5px; overflow: auto;">
    However I’m not sure how to set the search results page in such a manner.

    Also to make life easier how could we automatically add that to new posts?

    Thanks in advance!

Viewing 5 replies - 1 through 5 (of 5 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Do you know the file that displays search results?

    Thread Starter Marcdj01

    (@marcdj01)

    Hi Andrew

    There isn’t a specific page, but the PHP page is https://www.skipperbar.co.za/wp-content/themes/SkipperBarv4_1/search.php

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You’ll need to find where the search results are outputting, then wrap your <div> around it, however you should use CSS externally as opposed to inline.

    Thread Starter Marcdj01

    (@marcdj01)

    The theme was written by Artisteer. There is a searchform.php and search.php.

    <?php get_header(); ?>
<?php global $sb_primary,$sb_secondary ;$sb_primary = 'default';$sb_secondary = 'secondary'; ?>
<style type='text/css'>
.post ol {list-style-position:outside;}
.post ul li, .post ol ul li {overflow:visible;}
</style>
<?php if (theme_get_option('top_sidebar_search') && theme_get_option('top_sidebar_wide_search')) {get_sidebar('top');} ?>
<?php tt_get_header_layout(); ?>
			<?php if (theme_get_option('top_sidebar_search') && !theme_get_option('top_sidebar_wide_search')) {get_sidebar('top');} ?>
			<?php
				if(have_posts()) {

					theme_post_wrapper(
			  			array('content' => '<h4 class="box-title">' . sprintf( __( 'Search Results for: %s', THEME_NS ),
			  				'<span>' . get_search_query() . '</span>' ) . '</h4>'
			  			)
			  		);

					/* Display navigation to next/previous pages when applicable */
					if (theme_get_option('theme_top_posts_navigation')) {
						theme_page_navigation();
					}

					/* Start the Loop */
					while (have_posts()) {
						the_post();
						get_template_part('content', get_post_format());
					}

					/* Display navigation to next/previous pages when applicable */
					if (theme_get_option('theme_bottom_posts_navigation')) {
						 theme_page_navigation();
					}

				} else { ?>
<div style="width: 790px; height: 365px; margin: 5px; overflow: auto;">
<?php ob_start();
$title_search =  __('Sorry but I can\'t find the page you\'re looking for...', 'THEME_NS');?>

   		<p><?php _e('Let me help you find what you came here for:', 'THEME_NS'); ?></p>
		<?php
			$s = preg_replace("/(.*)-(html|htm|php|asp|aspx)$/","$1",$wp_query->query_vars['name']);
			$posts = query_posts('post_type=post&name='.$s);
			$s = str_replace("-"," ",$s);
			if (count($posts) == 0) {
				$posts = query_posts('post_type=post&s='.$s);
			}
			if (count($posts) > 0) { ?>
				<ol><li>
				<p><?php _e('Were you looking for <strong>one of the following</strong> posts?', 'THEME_NS'); ?></p>
				<ul>
			<?php	foreach ($posts as $post) {
					echo '<li><a href="'.get_permalink($post->ID).'">'.$post->post_title.'</a></li>';
				}
				echo "</ul>"; ?>
				<p><?php _e('If not, don\'t worry, I\'ve got a few more tips for you to find it:', 'THEME_NS'); ?></p></li>
			<?php } else { ?>
				<p><?php _e('<strong>Don\'t worry though!</strong> I\'ve got a few tips for you to find it:', 'THEME_NS'); ?></p>
				<ol>
			<?php }
		?>
			<li><p>
				<?php _e('<strong>Search</strong> for it:', 'THEME_NS'); ?>
				<form style="display:inline;" action="<?php bloginfo('siteurl');?>">
					<input type="text" value="<?php echo esc_attr($s); ?>" id="s" name="s"/> <input type="submit" value="Search"/>
				</form></p>
			</li>
			<li><p>
				<?php _e('<strong>If you typed in a URL...</strong> make sure the spelling, cApitALiZaTiOn, and punctuation are correct. Then try reloading the page.', 'THEME_NS'); ?></p>

			</li>
			<li><p>
				<?php _e('<strong>Look</strong> for it in the ', 'THEME_NS'); ?><a href="<?php bloginfo('siteurl');?>/sitemap/"><?php _e('sitemap', 'THEME_NS'); ?></a>.
				</p>
			</li>
			<li><p>
				<?php _e('<strong>Start over again</strong> at my ', 'THEME_NS'); ?><a href="<?php bloginfo('siteurl');?>"><?php _e('homepage', 'THEME_NS'); ?></a><?php _e(' (and please contact me to say what went wrong, so I can fix it).', 'THEME_NS'); ?></p>
			</li>
		</ol>
<?php
	theme_post_wrapper(
		array(

			'title' => $title_search,
			'content' => ob_get_clean()
		)
	);
?></div>

 <?php } ?>
<?php if (theme_get_option('bot_sidebar_search') && !theme_get_option('bot_sidebar_wide_search')) {get_sidebar('bottom');} ?>
<?php tt_get_footer_layout(); ?>
<?php if (theme_get_option('bot_sidebar_search') && theme_get_option('bot_sidebar_wide_search')) {get_sidebar('bottom');} ?>
<?php get_footer(); ?>

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If the theme is not custom, you should first create a Child Theme, otherwise any changes made to original theme files will be overwritten once the theme updates.

    You need the basic example of a child theme in the link (above), then a copy of this file from the theme, into the child theme.

    Then you can modify this file (from within the child theme).

    This could be a possible change for your <div>;

    <?php get_header(); ?>
<?php global $sb_primary,$sb_secondary ;$sb_primary = 'default';$sb_secondary = 'secondary'; ?>
<style type='text/css'>
.post ol {list-style-position:outside;}
.post ul li, .post ol ul li {overflow:visible;}
</style>
<?php if (theme_get_option('top_sidebar_search') && theme_get_option('top_sidebar_wide_search')) {get_sidebar('top');} ?>
<?php tt_get_header_layout(); ?>
			<?php if (theme_get_option('top_sidebar_search') && !theme_get_option('top_sidebar_wide_search')) {get_sidebar('top');} ?>
			<?php
				if(have_posts()) {
echo '<div class="search_wrapper">';

					theme_post_wrapper(
			  			array('content' => '<h4 class="box-title">' . sprintf( __( 'Search Results for: %s', THEME_NS ),
			  				'<span>' . get_search_query() . '</span>' ) . '</h4>'
			  			)
			  		);

					/* Display navigation to next/previous pages when applicable */
					if (theme_get_option('theme_top_posts_navigation')) {
						theme_page_navigation();
					}

					/* Start the Loop */
					while (have_posts()) {
						the_post();
						get_template_part('content', get_post_format());
					}

					/* Display navigation to next/previous pages when applicable */
					if (theme_get_option('theme_bottom_posts_navigation')) {
						 theme_page_navigation();
					}
echo '</div>';
				} else { ?>
<div style="width: 790px; height: 365px; margin: 5px; overflow: auto;">
<?php ob_start();
$title_search =  __('Sorry but I can\'t find the page you\'re looking for...', 'THEME_NS');?>

   		<p><?php _e('Let me help you find what you came here for:', 'THEME_NS'); ?></p>
		<?php
			$s = preg_replace("/(.*)-(html|htm|php|asp|aspx)$/","$1",$wp_query->query_vars['name']);
			$posts = query_posts('post_type=post&name='.$s);
			$s = str_replace("-"," ",$s);
			if (count($posts) == 0) {
				$posts = query_posts('post_type=post&s='.$s);
			}
			if (count($posts) > 0) { ?>
				<ol><li>
				<p><?php _e('Were you looking for <strong>one of the following</strong> posts?', 'THEME_NS'); ?></p>
				<ul>
			<?php	foreach ($posts as $post) {
					echo '<li><a href="'.get_permalink($post->ID).'">'.$post->post_title.'</a></li>';
				}
				echo "</ul>"; ?>
				<p><?php _e('If not, don\'t worry, I\'ve got a few more tips for you to find it:', 'THEME_NS'); ?></p></li>
			<?php } else { ?>
				<p><?php _e('<strong>Don\'t worry though!</strong> I\'ve got a few tips for you to find it:', 'THEME_NS'); ?></p>
				<ol>
			<?php }
		?>
			<li><p>
				<?php _e('<strong>Search</strong> for it:', 'THEME_NS'); ?>
				<form style="display:inline;" action="<?php bloginfo('siteurl');?>">
					<input type="text" value="<?php echo esc_attr($s); ?>" id="s" name="s"/> <input type="submit" value="Search"/>
				</form></p>
			</li>
			<li><p>
				<?php _e('<strong>If you typed in a URL...</strong> make sure the spelling, cApitALiZaTiOn, and punctuation are correct. Then try reloading the page.', 'THEME_NS'); ?></p>

			</li>
			<li><p>
				<?php _e('<strong>Look</strong> for it in the ', 'THEME_NS'); ?><a href="<?php bloginfo('siteurl');?>/sitemap/"><?php _e('sitemap', 'THEME_NS'); ?></a>.
				</p>
			</li>
			<li><p>
				<?php _e('<strong>Start over again</strong> at my ', 'THEME_NS'); ?><a href="<?php bloginfo('siteurl');?>"><?php _e('homepage', 'THEME_NS'); ?></a><?php _e(' (and please contact me to say what went wrong, so I can fix it).', 'THEME_NS'); ?></p>
			</li>
		</ol>
<?php
	theme_post_wrapper(
		array(

			'title' => $title_search,
			'content' => ob_get_clean()
		)
	);
?></div>

 <?php } ?>
<?php if (theme_get_option('bot_sidebar_search') && !theme_get_option('bot_sidebar_wide_search')) {get_sidebar('bottom');} ?>
<?php tt_get_footer_layout(); ?>
<?php if (theme_get_option('bot_sidebar_search') && theme_get_option('bot_sidebar_wide_search')) {get_sidebar('bottom');} ?>
<?php get_footer(); ?>

    I’ve wrapped a <div class="search_wrapper"> around your search results, which encourages external or internal CSS use.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Wrap Search results in DIV tage’ is closed to new replies.

Tags