分类目录归档:Wordpress

记录分享WP使用经验和技巧

WordPress 文章缩略图

先吐槽下,今天网站速度实在是太慢了;周末无聊,看了下缩略图顺便弄上了,其实这主题已经添加了这个功能,不过没有调用而已。对于一般无缩略图的,按照如下即可:
一、在主题文件夹下的functions.php添加代码

// post thumbnail support 缩略图支持
	add_theme_support( 'post-thumbnails' );
function post_thumbnail( $width = 160,$height = 100 ){
    global $post;
    if( has_post_thumbnail() ){
        $timthumb_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'full');
        $post_timthumb = '<a href="'.get_permalink().'"><img src="'.get_bloginfo("template_url").'/timthumb.php?src='.$timthumb_src[0].'&amp;h='.$height.'&amp;w='.$width.'&amp;zc=1" alt="'.$post->post_title.'" class="thumb" title="'.get_the_title().'"/></a>';
        echo $post_timthumb;
    } else {
			$content = $post->post_content;
			preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
			$n = count($strResult[1]);
			if($n > 0){
				echo '<a href="'.get_permalink().'"><img src="'.get_bloginfo("template_url").'/timthumb.php?w=160&amp;h=100&amp;src='.$strResult[1][0].'" title="'.get_the_title().'" alt="'.get_the_title().'"/></a>';
			} else {
				echo '<a href="'.get_permalink().'"><img src="'.get_bloginfo('template_url').'/images/random/'.rand(1,10).'.jpg" title="'.get_the_title().'" alt="'.get_the_title().'"/></a>';
			}
		}
	}

如果设置特色图像,那么首页缩略图就调用特色图像;如果没有设置特色图像,文章中有图片,则调用第一张作为缩略图,文章中没有图片,则调用/images/random文件夹中随机一张作为缩略图
二、在主题文件index.php,category.php里面适当的位置添加

<?php post_thumbnail(); ?>

三、添加适当的CSS样式

PS:本站现在使用的缩略图代码,同理添加到functions.php里面

//缩略图设置
add_theme_support('post-thumbnails');
set_post_thumbnail_size(200, 140, true);
//缩略图获取
function post_thumbnail($width = 200,$height = 140) {
    global $post;
    if ( has_post_thumbnail() ) {
    $domsxe = simplexml_load_string(get_the_post_thumbnail());
    $thumbnailsrc = $domsxe->attributes()->src;
    echo '<img width="200" height="140" src="'.$thumbnailsrc.'" alt="'.trim(strip_tags( $post->post_title )).'"  />';
    } else {
        $content = $post->post_content;
        preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
        $n = count($strResult[1]);
        if($n > 0){
            echo '<img width="200" height="140" src="'.$strResult[1][0].'" alt="'.trim(strip_tags( $post->post_title )).'"  />';
        }else {
            echo '<img width="200" height="140" src="'.get_bloginfo('template_url').'/img/sj/'.rand(1,7).'.jpg" alt="'.trim(strip_tags( $post->post_title )).'"  />';
        }
    }
}

友情提示下:请在图片目录img下建立sj文件夹,其中随机图片请以1~7.jpg命名;有些图片目录可能为images,请注意区分和自行修改,调用方法同上…

为博客添加返回顶部按钮

当Wordpress网页显示的内容增多时,如果继续使用鼠标滚动来返回顶部导航的话将会是件很麻烦的事情。很多时候我们需要滚好几下才能到达顶部,这时为博客添加返回顶部按钮是很有必要的,不过现在大部分博客主题都已集成这个功能。这次添加的返回顶部是我在上个主题mossight中用到的,具体效果为icon
源代码下载地址http://pan.baidu.com/share/link?shareid=1248009496&uk=2114932829
引入lrtk.css/jquery.js/js.js文件

<link type="text/css" href="<?php bloginfo('template_directory');?>/lrtk.css" rel="stylesheet" />
<script type="text/javascript" src="<?php bloginfo('template_directory');?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory');?>/js/js.js"></script>

在single.php或者index.php添加

<!-- 代码开始 -->
<div id="tbox">
	<a id="pinglun" href="#@@@@@@"></a>
	<a id="xiangguan" href="#@@@@@@"></a>
	<a id="gotop" href="javascript:void(0)"></a>
</div>
<!-- 代码结束 -->

在本主题中,可以如下设置定位到快速回复,相关文章

<!-- 代码开始 -->
<div id="tbox">
	<a id="pinglun" href="#respond"></a>
	<a id="xiangguan" href="#share"></a>
	<a id="gotop" href="javascript:void(0)"></a>
</div>
<!-- 代码结束 -->

大家可以自身主题更改下…………<高手勿喷>

不用插件实现关键词自动添加链接

通过一定的SEO技术,比如为关键字tag添加内部链接,来优化你的博客,提高你的搜索引擎收录和排名是一定需要的。建立内部链接对网页排名是有好处的,就算不能提高网页排名, 建立内部链接也能增加一些页面浏览量,即提高PV。如果在发布文章时手动添加链接效果会很好,但如果含有较多关键字则实际操作起来比较麻烦,wordpress这类插件网上也比较多例如SEO Smart Links、Keyword Link Plugin;对于那些不喜欢用插件的童靴来说,能少用插件就尽量少用,今天介绍一个不用插件实现的方法。
将下面代码添加到functions.php,具体代码如下: 继续阅读

分享几个代码

① 在文章内插入的广告
在文章内插入的广告具有相当高的点击率。用 WordPress 自带的 add_filter 函数将广告插入more标签后面
打开主题的 function.php ,插入下面的代码:

/**
 * The filter to insert the ads
 */
function bl_insert_ad_code_filter( $content ) {
	global $id;
	// 只在文章页面显示
	if ( !is_single() ) {
		return $content;
	} 
	// 首先插入广告代码
	$html = '<div class="single_ads">你的广告代码</div>'; 
		// more 标签在 WordPress 2.3 前是一个 a 标签,2.3 后是一个 span 标签
		// 保证兼容性
		return preg_replace("#\<(a|span) id\=\"more-$id\"\>\</\\1\>#", $html."$0", $content, 1); 
	return $content;
}
add_filter('the_content', 'bl_insert_ad_code_filter', 50);

继续阅读

移动版主题:Mobile pack


闲来无事,有加了一个移动版主题Mobile pack;简洁的Wordpress移动版主题,自适应屏幕宽度,当使用移动终端访问博客時,会自动切换到移动版主题;演示见左边图片。
使用说明:
主题需配合Wordpress移动设备检测插件:WPMS Mobile Edition
首先,上传主题
其次,安装 WPMS Mobile Edition 插件。当使用移动版浏览器查看博客时会自动切换到 Mobile pack 主题。
插件启用后无需设置,不要按提示升级插件配套主题:Carrington Mobile ,该主题也非常经典,如果喜欢也可以使用该主题,不过升级后会覆盖掉 Mobile pack 主题,切记!
为了方便用移动设备查看留言,主题集成了最近留言模版,需要正常切换到Mobile pack主题新建一个页面,右下模版中选择“最近留言”,发布后记下链接地址,打开index.php模版,用链接地址替换其中的“你的链接地址”。 继续阅读