chaihongjun.me

wordpress边栏增加百度站内搜索框及嵌入式搜索结果页

wordpress边栏增加百度站内搜索框及嵌入式搜索结果页

在wordpress的侧栏增加百度搜索框有两种方式,一种是类似小工具的方式,需要制作侧栏小工具,这样的方法有些麻烦,涉及需要了解如何制作wordpress小工具。另外一种方式就是直接在侧栏模板写入html代码,主要是表单代码:

<aside class="sidebar">	
<!-- 百度站内搜索框 -->
<div class="widget widget_baidu">
    <h3 class="widget_tit">百度站内搜索</h3>
    <div id="bdcsMain">
      <form method="get" class="dropdown search-form" action="http://www.hzwlb.org/baidu-search">
        <input class="search-input" name="q" type="text" placeholder="百度一下,你就知道" x-webkit-speech="">
        <input class="btn btn-success search-submit" type="submit" value="度娘">
    </form>     
    </div>
</div>
<!-- 百度站内搜索框 -->
<?php 
if (function_exists('dynamic_sidebar') && dynamic_sidebar('widget_sitesidebar')) : endif; 

if (is_single()){
	if (function_exists('dynamic_sidebar') && dynamic_sidebar('widget_postsidebar')) : endif; 
}
else if (is_page()){
	if (function_exists('dynamic_sidebar') && dynamic_sidebar('widget_pagesidebar')) : endif; 
}
else if (is_home()){
	if (function_exists('dynamic_sidebar') && dynamic_sidebar('widget_sidebar')) : endif; 
}
else {
	if (function_exists('dynamic_sidebar') && dynamic_sidebar('widget_othersidebar')) : endif; 
}
?>
</aside>

在sidebar.php文件添加了站内搜索框表单代码,该表单代码最主要的几个元素及属性:

<!-- form 的action是搜索结果页地址 -->
<form method="get" action="这里是搜索结果页地址">
<!-- 输入表单的name值必须是q  -->
<input class="search-input" name="q" type="text" placeholder="百度一下,你就知道"  x-webkit-speech="">
<!-- 以上关键部分保证在输入框内的关键词可以传递到搜索结果页 -->

接下来需要的步骤是制作搜索结果的展现页面:

从当前主题的页面模板(page.php或者page-[slug].php)或者文章页模板(single.php或者single-[slug].php)选择一个作为模板来修改,建议使用文章页的,因为有侧栏啊:

/* 文章页面模板 */
<?php get_header(); ?>
<div class="content-wrap">
	<div class="content">
		<div class="breadcrumbs"><?php echo deel_breadcrumbs() ?></div>
		<?php while (have_posts()) : the_post(); ?> /* 制作百度站内搜索结果页时需要删除 */
		<header class="article-header">
			<h1 class="article-title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
			<div class="meta">  /* 制作百度站内搜索结果页时需要删除 */
				<?php  
					$category = get_the_category();
			        if($category[0]){
			            echo '<span class="muted"><a href="'.get_category_link($category[0]->term_id ).'"><i class="icon-list-alt icon12"></i> '.$category[0]->cat_name.'</a></span>';
			        }
				?>
				<span class="muted"><i class="icon-user icon12"></i> <a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ) ?>"><?php echo get_the_author() ?></a></span>
				<?php echo dopt('d_post_from_s') && hui_get_post_from() ? '<span class="muted">'.hui_get_post_from().'</span>' : '' ?>
				<time class="muted"><i class="ico icon-time icon12"></i> <?php echo timeago( get_gmt_from_date(get_the_time('Y-m-d G:i:s')) )?></time>
				<span class="muted"><i class="ico icon-eye-open icon12"></i> <?php deel_views('浏览'); ?></span>
				<?php if ( comments_open() ) echo '<span class="muted"><i class="icon-comment icon12"></i> <a href="'.get_comments_link().'">'.get_comments_number('去', '1', '%').'评论</a></span>'; ?>
				<?php edit_post_link('[编辑]'); ?>
			</div>
		</header>

		<?php if( dopt('d_adpost_01_b') ) echo '<div class="banner banner-post">'.dopt('d_adpost_01').'</div>'; ?>
		
		<article class="article-content">
			<?php the_content(); ?>
		</article>

		<?php endwhile;  ?> /* 制作百度站内搜索结果页时需要删除 */

		<footer class="article-footer"> 
			<?php the_tags('<div class="article-tags">继续浏览有关 ','',' 的文章</div>'); ?> /* 制作百度站内搜索时需要删除 */
			<?php deel_share(); ?>
		</footer>

		<nav class="article-nav"> /* 制作百度站内搜索结果页时需要删除 */
			<span class="article-nav-prev"><?php previous_post_link('上一篇 %link'); ?></span>
			<span class="article-nav-next"><?php next_post_link('%link 下一篇'); ?></span>
		</nav>

		<div class="relates"> /* 制作百度站内搜索结果页时需要删除 */
			<h3>与本文相关的文章</h3>
			<?php include( 'modules/related.php' ); ?>
		</div>
	

		<?php if( dopt('d_adpost_02_b') ) echo '<div class="banner banner-related">'.dopt('d_adpost_02').'</div>'; ?>

		<?php comments_template('', true); ?>

		<?php if( dopt('d_adpost_03_b') ) echo '<div class="banner banner-comment">'.dopt('d_adpost_03').'</div>'; ?>

	</div>
</div>
<?php get_sidebar(); get_footer(); ?>

因为是要制作成结果页,所以文章页的内容部分就要替换成百度站内搜索提供的代码:

<div id="bdcs-frame-box"></div>
<script type="text/javascript">
var bdcsFrameSid="你的id";
var bdcsFrameWidth = 552;
var bdcsFrameWt = 1;
var bdcsFrameHt = 1;
var bdcsFrameResultNum = 10;
var bdcsFrameBgColor = "#ffffff";
</script>
<script type="text/javascript" src="http://zhannei.baidu.com/static/js/iframe.js"></script>
<!--  以上是百度站内搜索默认的嵌入式代码,具体参数可以参考百度站内搜索修改 -->

文章模板主题部分的一些内容就需要删除修改:

<?php while (have_posts()) : the_post(); ?> /* 文章内容while 循环,制作百度站内搜索结果页时需要删除 */
<?php endwhile;  ?> /* 文章内容while 循环,制作百度站内搜索结果页时需要删除 */

<div class="meta">  /* meta内容,主要是文章的来源作者发布时间等 制作百度站内搜索结果页时需要删除 */
	<?php  
	$category = get_the_category();
	 if($category[0]){
	    echo '<span class="muted"><a href="'.get_category_link($category[0]->term_id ).'"><i class="icon-list-alt icon12"></i> '.$category[0]->cat_name.'</a></span>';
	 }
	?>
	<span class="muted"><i class="icon-user icon12"></i> <a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ) ?>"><?php echo get_the_author() ?></a></span>
	<?php echo dopt('d_post_from_s') && hui_get_post_from() ? '<span class="muted">'.hui_get_post_from().'</span>' : '' ?>
<time class="muted"><i class="ico icon-time icon12"></i> <?php echo timeago( get_gmt_from_date(get_the_time('Y-m-d G:i:s')) )?></time>
	<span class="muted"><i class="ico icon-eye-open icon12"></i> <?php deel_views('浏览'); ?></span>
	<?php if ( comments_open() ) echo '<span class="muted"><i class="icon-comment icon12"></i> <a href="'.get_comments_link().'">'.get_comments_number('去', '1', '%').'评论</a></span>'; ?>
	<?php edit_post_link('[编辑]'); ?>
	</div>

	
<?php the_tags('<div class="article-tags">继续浏览有关 ','',' 的文章</div>'); ?> /*  制作百度站内搜索结果页时需要删除 */

<nav class="article-nav"> /* 制作百度站内搜索结果页时需要删除 */
			<span class="article-nav-prev"><?php previous_post_link('上一篇 %link'); ?></span>
			<span class="article-nav-next"><?php next_post_link('%link 下一篇'); ?></span>
		</nav>
		
<div class="relates"> /* 制作百度站内搜索结果页时需要删除 */
			<h3>与本文相关的文章</h3>
			<?php include( 'modules/related.php' ); ?>
		</div>

然后需要将

<?php the_content(); ?>

替换成上面的百度站内搜索嵌入代码。最后记得在制作结果页模板的时候添加模板名称注释,以免在生成页面的时候找不到模板可生成。

/*
  template name: 百度站内搜索嵌入式结果页
*/


知识共享许可协议本作品采用 知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议进行许可。作者: 柴宏俊» wordpress边栏增加百度站内搜索框及嵌入式搜索结果页

  •  wordpress头部模块header代码

    wordpress头部模块header代码

  •  wordpress主循环the_loop内可以调用的模板标签

    wordpress主循环the_loop内可以

  •  wordpress根据不同页面类型输出不同的css或者js

    wordpress根据不同页面类型

  •  wordpress学习笔记之文章页标题字数截取

    wordpress学习笔记之文章页

相关推荐

  • 头条文章
  • 特别推荐
  • 热门随机
  • 联系本站

360

最新发布

  • fail2ban阻止SSH及FTP暴力破解fail2ban阻止SSH及FTP暴力破解2022-04-11阅读(54)
  • vue3获取异步数据并渲染模板demovue3获取异步数据并渲染模2022-03-24阅读(133)
  • axios封装和应用(version2) axios封装和应用(version2) 2022-03-19阅读(181)
  • Vite+Vue3+Vue-Router@4+Pinia 快速起步Vite+Vue3+Vue-Router@4+Pinia 快速2022-03-14阅读(190)
  • pinia快速入门 (一)pinia快速入门 (一)2022-02-18阅读(180)

随机精选

  • [Vue]入门学习之一Vue实例化[Vue]入门学习之一Vue实例化2019-04-27阅读(142)
  • dedecms织梦系统全站内容json格式输出dedecms织梦系统全站内容2020-04-03阅读(173)
  • 根据新浪IP库,将用户访问的站点做指定跳转根据新浪IP库,将用户访问2016-10-21阅读(79)
  • 织梦系统(DedeCMS)程序文件结构详解织梦系统(DedeCMS)程序文2016-10-21阅读(91)
  • dedecms整合百度站长平台主动推送插件dedecms整合百度站长平台主2016-10-21阅读(134)