wordpress侧边栏随页面滚动完美版

其实关于wordpress侧边栏随页面滚动的代码,本站已经收集了几篇,但是以前的代码都不支持侧边栏滚动时到一定位置停止(有时候我们不希望侧边栏出现无限滚动的情况,所以才会有滑动到一定位置时希望它停止的要求),今天无意间在一网站上看见可以达到这一要求的代码。

效果说明:当指定内容块的顶部接触浏览器上部边框时,这个内容块将固定不动。
当内容块的底部与下方的DIV达到指定距离时,内容块开始随整体向上滚动。从而不会覆盖掉下方的内容。

第一步,既然是jquery插件,当然要在<head></head>里加上下面的代码,如果你已经挂载过JQ,则可以省略此步。

<script type=”text/javascript” src=”http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js></script>

第二步,在侧边栏合适位置添加这段插件代码。

<!-- 侧边栏滚动-->
 <script type="text/javascript">
$(document).ready(function(){
	$(".post_content a[href='"+window.location.href+"']").addClass("selflink")
	$('.selflink').click(function() {return false;});
	$.fn.scrollFollow=function(options){options=options||{};options.container=options.container||$(this).parent();options.bottomObj=options.bottomObj||'';options.bottomMargin=options.bottomMargin||0;options.marginTop=options.marginTop||0;options.marginBottom=options.marginBottom||0;$window=$(window),$scrollObj=$(this);if($scrollObj.length<=0){return}scrollObj_Top=$scrollObj.position().top,scrollObj_Container_Height=options.container.height(),scrollObj_Position=$scrollObj.css("position");if(options.bottomObj==''||$(options.bottomObj).length<=0){is_bottomObj_exists=false}else{is_bottomObj_exists=true}$window.scroll(function(event){var new_scrollObj_Container_Height=options.container.height();var scrollObj_Height=$scrollObj.height();if(scrollObj_Container_Height!=new_scrollObj_Container_Height&&scrollObj_Container_Height<new_scrollObj_Container_Height+scrollObj_Height){scrollObj_Top=$scrollObj.position().top;scrollObj_Container_Height=new_scrollObj_Container_Height}scrollTop=$window.scrollTop(),topPosition=Math.max(0,scrollObj_Top-scrollTop);if(is_bottomObj_exists==true){var bottomObj_Top=$(options.bottomObj).position().top-options.marginBottom-options.marginTop;topPosition=Math.min(topPosition,(bottomObj_Top-scrollTop)-scrollObj_Height)}if(scrollTop>scrollObj_Top){if(is_bottomObj_exists==true&&(scrollObj_Top+scrollObj_Height>bottomObj_Top)){$scrollObj.css({position:scrollObj_Position,top:scrollObj_Top})}else{if(window.XMLHttpRequest){$scrollObj.css({position:"fixed",top:topPosition+options.marginTop})}else{$scrollObj.css({position:"absolute",top:scrollTop+topPosition+options.marginTop+'px'})}}}else{$scrollObj.css({position:scrollObj_Position,top:scrollObj_Top})}})};

	$("#float").scrollFollow({
		bottomObj: '.foot',
		marginTop:0,
		marginBottom:17
	});
});
 </script>
<!-- 侧边栏滚动-->

第三步,注意代码中的两个标签(红色位置)。给右侧需要浮动定位的DIV加上(id=“float”)。再给下方不想覆盖住的DIV加上(class=“foot”)。如此便大功告成了!

资料来源:http://www.jingucn.com/221/

缓存WordPress的Sidebar(侧边栏)的技巧

缓存WordPress的Sidebar(侧边栏)的技巧。缓存WordPress的相关栏目无疑会减轻服务器的压力,所以这里就给大家分享一种缓存WordPress的Sidebar(侧边栏)的技巧。

对 Sidebar 缓存的代码分享下,几点说明:

1. 可以自己修改缓存时间,怎么修改,看下面代码的唯一的注释。
2. 一旦采用这样的缓存,在缓存时间内对 sidebar 做任何修改都不会生效。
3. 如果你又想缓存又想修改东西,你可以把缓存时间修改为1秒,作了修改之后,让 sidebar 缓存生成之后,再把缓存时间修改为原来的。
4. 如果你的 sidebar 为不同页面不同 sidebar,那么你要根据自己的 sidebar 生成不同 sidebar 缓存,如:sidebar_home, sidebar_single,基本代码类似。
5. 会对 Recent Post, Recent Comment 这些插件产生延迟,在缓存的时间内,如果这些列表更新了回不能及时体现。

下面是具体的步骤和代码:

1. 进入 WordPress 后台,点击 Design => Theme Editor => Sidebar (sidebar.php)。

2. 在 sidebar.php 开头加入以下代码:

<?php 
$sidebar_html = ABSPATH . "wp-content/cache/sidebar.txt";
$have_cached = false;
if (file_exists($sidebar_html)){
$file_time = filemtime($sidebar_html);
if (($file_time + 3600) > time()){ //缓存1小时
echo "<!-- cached sidebar -->";
echo(file_get_contents($sidebar_html));
echo "<!-- end of cached sidebar -->";
$have_cached = true;
}
}
if(!$have_cached){
ob_start();
?>

3. 在 sidebar.php 结尾加入以下代码:

<?php
$sidebar_content = ob_get_contents();
ob_end_clean();
$sidebar_fp = fopen($sidebar_html, "w");

if ($sidebar_fp){
fwrite($sidebar_fp, $sidebar_content);
fclose($sidebar_fp);
}

echo $sidebar_content;
}
?>

到此代码就部署完毕,但要注意的是需要手动在wp-content下建cache文件夹并给予777权限,还有第2点代码中的缓存时间可以根据自己的情况而设置。效率和灵活永远是矛盾,只能求一个折衷咯。

资料来源:http://www.6ird.com/archives/82.html

WordPress获取某一页面的文章内容的代码

WordPress获取某一页面的文章内容的代码。使用wordpress有时候可能需要在首页或其它页面调用某一页面的内容或者其它相关信息,而具体方法我们是可以通过要获取的页面的ID从而调用该页面的内容。下面是具体相关的页面内容调用代码,

wordpess调用某页面内容的代码:

<?php
$my_id = 1;
echo get_post($my_id)->post_content;
?>

其中的1是页面的ID,页面ID的获取方法:把鼠标移动页面的标题上,然后在浏览器状态栏中显示的URL地址 ,其中post=后面的数字便是页面的ID。

post_author:(整数)文章作者的编号

post_data:(字符)文章发表的日期和时间(YYYY-MM-DD HH-MM-SS)

post_data_gmt:(字符)文章发表的格林尼治标准时间(GMT) (YYYY-MM-DD HH-MM-SS)

post_content:(字符)文章内容

post_title:(字符)文章标题

post_category:(整数)文章类别的编号。注意:该值在WordPress 2.1之后的版本总为0。定义文章的类别时可使用 get_the_category()函数。

post_excerpt:(字符)文章摘要

post_status:(字符)文章状态(publish|pending|draft|private|static|object|attachment|inherit|future)

comment_status:(字符)评论状态(open|closed|registered_only)

ping_status:(字符)pingback/trackback状态(open|closed)

post_password:(字符)文章密码

post_name:(字符)文章的URL嵌套

to_ping:(字符)要引用的URL链接

pinged:(字符)引用过的链接

post_modified:(字符)文章最后修改时间(YYYY-MM-DD HH-MM-SS)

post_modified_gmt:(字符)文章最后修改GMT时间(YYYY-MM-DD HH-MM-SS)

post_parent:(整数)父级文章编号(供附件等)

guid:(字符)文章的一个链接。注意:不能将GUID作为永久链接(虽然在2.5之前的版本中它的确被当作永久链接),也不能将它作为文章的可用链接。GUID是一种独有的标识符,只是目前恰巧成为文章的一个链接。

post_type:(字符)(日志 | 页面 | 附件)

其函数为WP官方文档

此代码可用于wordpress做企业站,在首页的公司简介中调用某页面(关于我们)的内容等

资料来源:http://www.6ird.com/archives/84.html

wordpress利用CSS让每个页面都不一样

wordpress利用CSS让每个页面都不一样。你是否厌倦了WordPress页面千篇一律的样子,是否想每个页面各不相同?比起用自定义模板,用CSS更快一些,WordPress给每篇文章或者页面指定了独一无二的body class,用这个class就可以让页面各不相同。

什么是body class

body class是WordPress API: body_class()函数产生的一组class,这些class会随着不同的页面发生变化。

例如,首页body class

<body class="home blog two-column right-sidebar customize-support">

这是twentyeleven主题产生的class,可能与别的主题略有不同,但首页都有home这个class。

利用CSS让文章页面不同

下面进入正题,假如要实现在ID为872的文章页面隐藏掉导航,方法如下。

1. 查看文章页面的body class,我们可以找到一个class叫做postid-872

<body class="single single-post postid-872 single-format-standard singular two-column right-sidebar customize-support">

这个postid-872是独一无二的,用这个class,我们可以随意修改ID为872的文章页面内容而不用担心影响其它页面。

我们甚至不需要修改样式表(style.css),只需要在编辑器中输入我们需要的样式就行了,现在来隐藏这个页面的导航,导航的id是#access,所以以藏菜单的样式为

<style type="text/css">

.postid-872 #access{

display:none;

}

</style>

将这段代码直接在编辑器的源代码模式下输入即可达到目的。

将代码在编辑器HTML模式下输入

利用CSS让页面不同

如果要隐藏某个页面的导航,假设页面ID为2

<body class="page page-id-2 page-template-default singular two-column right-sidebar customize-support" >

这个page也独一无二的class是post-id-2,隐藏导航的css代码为

<style type="text/css">

.post-id-2 #access{

display:none;

}

</style>

利用CSS修改某个模板的样式

同理,body class还可以用于page模板,假设我们有一个自定义模板叫做showcase.php,使用这个模板的页面会有一个自己的class

<body class="page page-id-2 page-template page-template-showcase-php  two-column right-sidebar customize-support">

从上面找一下,表示当前页面使用了showcase.php模板的class是page-template-showcase-php

格式是page-template-(template file name)

于是,隐藏这个模板导航的方法

<style type="text/css">

.page-template-showcase-php #access{

display:none;

}

</style>

拓展

body_class()的用途不仅于此,我们可以在functions.php中filter body class,从而轻松实现切换layout的功能,比如著名的genesis主题支持六种layout布局,不但可以后台一键切换,还可以在每篇文章中单独设定。

结语

通过body class修改模板的好处是,修改方便,管理容易。特别是当你你要修改的是header和footer的内容,这些内容不能轻易通过修改新模板来解决,原因很简单,重新定义模板依然要调用get_header()和get_footer(),如果你要去掉导航,只有两种方法

  • 去掉get_header()函数,将header.php内容拷贝到模板中,去掉导航
  • 定义一个新的头部文件,例如名叫header-mypage.php,然后调用get_header(‘mypage’)来调用这个自定义header文件,在header-mypage.php中去掉导航

做大的改动,上述方法比较合适,小改动则有些大材小用的感觉。用CSS修改,还是修改模板实现,要根据我们的具体需求来选择,合适的就是最好的。

文章来源:http://www.solagirl.net/wordpress-create-different-look-with-css.html

自动为WordPress文章设置特色图像-免插件

免插件实现自动为WordPress文章设置特色图像。wordpress的特色图像在很多时候还是挺不错的,不过比较麻烦的是需要用户手动选择,但我们不是每次都能想起来点一下设置特色图像按钮的,所以手动选择设置wordpress特色图像就显得有些不方便了,如果能自动为WordPress文章添加特色图像,就方便多了。

自动为WordPress文章设置特色图像代码

这里有一段很实用的代码,可以自动将文章中的第一张图片设置为特色图像,如果你手动设置了特色图像,可以覆盖这段代码。将下面的代码丢到当前主题的functions.php里,以后就不用担心忘记设置特色图像了。

function autoset_featured() {

global $post;

$already_has_thumb = has_post_thumbnail($post->ID);

if (!$already_has_thumb)  {

$attached_image = get_children( "post_parent=$post->ID&post_type=attachment&post_mime_type=image&numberposts=1" );

if ($attached_image) {

foreach ($attached_image as $attachment_id => $attachment) {

set_post_thumbnail($post->ID, $attachment_id);

}

}

}

//end function

add_action('the_post', 'autoset_featured');

add_action('save_post', 'autoset_featured');

add_action('draft_to_publish', 'autoset_featured');

add_action('new_to_publish', 'autoset_featured');

add_action('pending_to_publish', 'autoset_featured');

 

资料来源:http://wpforce.com/automatically-set-the-featured-image-in-wordpress/

wordpress实现访客足迹功能

早一段时间为亿品元素博客开通了访客足迹功能,现在又想把访客足迹功能功能去除,故发文一篇以记录一下代码,方便以后自己哪天又想折腾的时候,不用满世界找代码。

何谓访客足迹?通俗点的来讲就是把访客自己回复过文章展示出来(有点类似购物网站的浏览历史,不过此处是留言历史而已,并且这一系列文章也只有访客自己能看见,可以说是完善访客体验的一个表现),个人认为,这一功能非常有必要在技术型博客上加载,大家也许会遇到这样的情况,有时去某个技术牛人的博客上留言咨询点问题,但是当你过一段时间去再去看看博主是否已经回复时,却发现自己已经不记得是在哪篇文章中留言了。如果该网站加载了访客足迹功能,那要找回你的评论历史文章就很简单了。只要再在该网站评论一次,你的留言足迹就立即显示出来,非常方便。

下图是亿品元素博客的展示效果,本人是把该功能加载在评论框的下面,其实你可以把这一功能加在其他地方,如sidebar.php

访客足迹

下面是亿品元素上使用的wordpress实现访客足迹功能代码,效果如上图

<!– 访客足迹–>
<?php
if($_COOKIE["comment_author_" . COOKIEHASH]!=""){
//1.如果COOKIE不为空,则输出您的足迹
global $wpdb;//2.读取数据库相关项
$sql = "SELECT DISTINCT ID, post_title,post_password,
comment_ID, comment_post_ID,comment_author,
comment_count,
comment_date_gmt,comment_approved, comment_author_email,
comment_type,comment_author_url,
SUBSTRING(comment_content,1,25)
AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts
ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID)
WHERE comment_approved = ‘1’ AND comment_type = ”
AND comment_author = ‘".$_COOKIE["comment_author_" . COOKIEHASH]."’
AND post_password = ”
GROUP BY comment_post_ID
ORDER BY comment_date_gmt
DESC LIMIT 10";//3.输出10篇文章
$comments = $wpdb->get_results($sql);
foreach ($comments as $comment) {
$output .= "\n<li><a href=\"" .get_permalink($comment->ID)."#comment-".$comment->comment_ID. "\" title=\"" . $comment->post_title ."(". $comment->comment_count."评论)\">" . $comment->post_title . "</a></li>";
}//4.输出最近评论过的文章
$output = ‘<div class="postList"><h3 style="border-bottom:1px solid #FF6600; color: #FF6600;">’. mb_substr(strip_tags($comment->comment_author),0,12).’ 您最近留下的足迹:</h3><ul>’.$output.'</ul></div>’;
$output = convert_smilies($output);
echo $output;
}
?>

wordpress网站禁止目录索引的方法

wordpress网站禁止目录索引的方法。首先我们先解释一下什么是目录索引,就是当你打开一个网站地址时,网站内的文件以列表的形式显示出来。以wordpress网站做说明吧,例如你有时无意间打开你的网站/wp-content/uploads/2011这样的地址,你会惊奇的发现里面所有的文件都以列表的形式展示出来了(如下图),这是非常不安全的,无论是WordPress还是其它程序都一样。

Wordpress文件目录列表

下面给大家分享两种禁止网站目录索引的方法

网站禁止目录索引方法1:利用.htaccess文件修改

在空间网站的根目录下找到.htaccess文件,空间路径一般在/home/YouUsername/public_html/下,添加这句代码到.htaccess文件的最后,独立占一行。

Options All -Indexes

保存退出即可,如果是用ftp,就修改保存后重新上传。

网站禁止目录索引方法2:利用 cPanel管理界面“索引管理器”修改

登录到cPanel,然后拉到下面的“高级”-“索引管理器”

cPanel 索引管理器

请单击文件夹名选择你想要保护的文件夹。

cPanel 索引管理器

选择“无索引”,然后保存即可。

以上两个方法都能实现禁止网站显示文件目录列表的功能,但是如果仔细去研究的话,第二种方法的操作也是在.htaccess这个文件里面添加了这句代码而已

Options All -Indexes

但是,推荐使用第一种方法,因为这句代码必须要独立一行才有效,而通过Cpanel中的索引管理器操作的默认也是在.htaccess文件里添加了这句代码,但是没有自动换行,如果该文件里原本已经有内容, 修改后的结果会变成Options All -Indexes加到了最后一句的后边,不是新的一行,导致网站出错,无法访问

资料来源:http://luckerme.com/archives/845.html

wordpress免插件实现相关文章代码

给wordpress网站增加相关文章功能可以在一定程度上提高网站的pv,不过很多朋友可能出于懒得折腾的原因吧,都还是习惯采用wordpress相关文章插件,但是方便的同时也许牺牲了网站的速度,毕竟插件要考虑很多主题的兼容性,可能会增加很多对你网站无用的代码。所以个人的做法是能用代码达到效果就绝对不用插件,玩wordpress,玩的就是折腾嘛!再说在折腾的过程还可以学到点东西呢,何乐而不为?下面就给大家分享一下wordpress免插件实现相关文章代码。

<h3>Related Posts</h3>
<ul>
<?php
$post_num = 5; // 數量設定.
$exclude_id = $post->ID; // 單獨使用要開此行 //zww: edit
$posttags = get_the_tags(); $i = 0;
if ( $posttags ) {
$tags = ”; foreach ( $posttags as $tag ) $tags .= $tag->term_id . ‘,’; //zww: edit
$args = array(
‘post_status’ => ‘publish’,
‘tag__in’ => explode(‘,’, $tags), // 只選 tags 的文章. //zww: edit
‘post__not_in’ => explode(‘,’, $exclude_id), // 排除已出現過的文章.
‘caller_get_posts’ => 1,
‘orderby’ => ‘comment_date’, // 依評論日期排序.
‘posts_per_page’ => $post_num
);
query_posts($args);
while( have_posts() ) { the_post(); ?>
<li><a rel=”bookmark” href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”><?php the_title(); ?></a></li>
<?php
$exclude_id .= ‘,’ . $post->ID; $i ++;
} wp_reset_query();
}
if ( $i < $post_num ) { // 當 tags 文章數量不足, 再取 category 補足.
$cats = ”; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ‘,’;
$args = array(
‘category__in’ => explode(‘,’, $cats), // 只選 category 的文章.
‘post__not_in’ => explode(‘,’, $exclude_id),
‘caller_get_posts’ => 1,
‘orderby’ => ‘comment_date’,
‘posts_per_page’ => $post_num – $i
);
query_posts($args);
while( have_posts() ) { the_post(); ?>
<li><a rel=”bookmark” href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></li>
<?php $i++;
} wp_reset_query();
}
if ( $i  == 0 )  echo ‘<li>没有相关文章!</li>’;
?>
</ul>

把上述代码复制到你主题模板需要显示相关文章的位置即可(一般是插入在single.php文件中),该段代码可以通过调取tags来实现相关文章功能(所以我们有必要在发布文章的时候为文章增加tag),并且默认设置为5篇相关文章(可以修改代码中的文章数量显示),当相关文章数量不够时采用category补足。

上面的相关文章代码由于采用tag作为相关文章来源所以有时侯相关度就显得不是很高,如果喜欢用插件来实现相关日志的功能,那么推荐你使用yet-another-related-posts-plugin。相对来说yet-another-related-posts-plugin的相关文章无论从设置上面还是相关度都是相对不错的。

来源:http://zww.me/archives/25353

改进版,相关文章数量不够时再增加随机文章来补齐。

<h3>Related Posts</h3>
<ul>
<?php
$post_num = 5;
$exclude_id = $post->ID;
$posttags = get_the_tags(); $i = 0;
if ( $posttags ) {
$tags = ”; foreach ( $posttags as $tag ) $tags .= $tag->term_id . ‘,’;
$args = array(
‘post_status’ => ‘publish’,
‘tag__in’ => explode(‘,’, $tags),
‘post__not_in’ => explode(‘,’, $exclude_id),
‘caller_get_posts’ => 1,
‘orderby’ => ‘comment_date’,
‘posts_per_page’ => $post_num
);
query_posts($args);
while( have_posts() ) { the_post(); ?>
<li><a rel=”bookmark” href=”<?php the_permalink(); ?>” title=”<?php the_title(); ?>”><?php the_title(); ?></a></li>
<?php
$exclude_id .= ‘,’ . $post->ID; $i ++;
} wp_reset_query();
}
if ( $i < $post_num ) {
$cats = ”; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ‘,’;
$args = array(
‘category__in’ => explode(‘,’, $cats),
‘post__not_in’ => explode(‘,’, $exclude_id),
‘caller_get_posts’ => 1,
‘orderby’ => ‘comment_date’,
‘posts_per_page’ => $post_num – $i
);
query_posts($args);
while( have_posts() ) { the_post(); ?>
<li><a rel=”bookmark” title=”<?php the_title(); ?>” href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></li>
<?php
$exclude_id .= ‘,’ . $post->ID; $i ++;
} wp_reset_query();
}
if ( $i < $post_num ) {
$args = array(
‘post__not_in’ => explode(‘,’, $exclude_id),
‘caller_get_posts’ => 1,
‘orderby’ => ‘rand’,
‘posts_per_page’ => $post_num – $i
);
query_posts($args);
while( have_posts() ) { the_post(); ?>
<li><a rel=”bookmark” title=”<?php the_title(); ?>” href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></li>
<?php
$exclude_id .= ‘,’ . $post->ID; $i ++;
} wp_reset_query();
}
if ( $i  == 0 )  echo ‘<li>No Related Articles!</li>’;
?>
</ul>