myCloudCode

Posts Mentioning RSS Toggle Comment Threads | Keyboard Shortcuts

• 

  Jay Kwong 7:30 am on February 25, 2010 Permalink | Reply
  Tags: Functions, thumb (3), Wordpress (7)   

  如何使用WordPress 2.9内置文章缩略图功能Post Thumbnail | 帕兰映像 

  1. 激活文章缩略图功能

  要激活该功能，打开你主题的functions.php文件，输入下面的代码:

  add_theme_support( 'post-thumbnails' );
  

  你也可以添加一个参数来指定在post还是page激活该功能:

  add_theme_support( 'post-thumbnails', array( 'post', 'page' ) );
  

  默认是在两者里都激活的。激活后，在你的post或page编辑页面的侧边栏底部，就能看到该功能的设置模块了。
  

  2.输出到主题

  要在你的主题中显示出设置的图片，你需要在loop里面添加下面这个函数:

  你可以给该函数传递一个参数值来调用图片的不同尺寸，

  the_post_thumbnail();                  // 默认显示缩略图
  
  the_post_thumbnail('thumbnail');       // 显示缩略图
  the_post_thumbnail('medium');          // 显示中等尺寸
  the_post_thumbnail('large');           // 显示大尺寸
  
  the_post_thumbnail( array(100,100) );  // 自定义尺寸
  

  3. 在loop外调用某篇文章的文章缩略图

  如果你想在loop以外调用某些文章的缩略图，另一个函数为你准备:

  和the_post_thumbnail()相比，它需要再传入一个参数来指定文章的ID:

  get_the_post_thumbnail($id);
  
  get_the_post_thumbnail($id, 'thumbnail');
  get_the_post_thumbnail($id, 'medium');
  get_the_post_thumbnail($id, 'large');
  
  get_the_post_thumbnail($id, array(100,100) );
  

  对于大多数wordpress用户来说，知道上面这些就已经足够了。如果你是一个主题开发者，想了解的更深入，可以查看justintadlock的这篇文章：

  Everything you need to know about WordPress 2.9’s post image feature

  里面还介绍了如何添加函数连接到过滤器动作来改变文章缩略图尺寸和缩略图的html代码输出。

  via 如何使用WordPress 2.9内置文章缩略图功能Post Thumbnail | 帕兰映像.

   

  Reply Click here to cancel reply.

  Name (required)

  Email (required)

  Web Site

   
• 

  Jay Kwong 7:28 am on January 19, 2010 Permalink | Reply
  Tags: Content (2), post (3), Shortcode, the loop   

  Shortcode – Display the loop 

  function.php

  function myLoop($atts, $content = null) {
  	extract(shortcode_atts(array(
  		"pagination" => 'true',
  		"query" => '',
  		"category" => '',
  	), $atts));
  	global $wp_query,$paged,$post;
  	$temp = $wp_query;
  	$wp_query= null;
  	$wp_query = new WP_Query();
  	if($pagination == 'true'){
  		$query .= '&paged='.$paged;
  	}
  	if(!empty($category)){
  		$query .= '&category_name='.$category;
  	}
  	if(!empty($query)){
  		$query .= $query;
  	}
  	$wp_query->query($query);
  	ob_start();
  	?>
  	<h2><?php echo $category; ?></h2>
  	<ul class="loop">
  	<?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
  		<li><a href="<?php the_permalink() ?>" rel="bookmark"><?php echo $thumbnail_image; the_title(); ?></a></li>
  	<?php endwhile; ?>
  	</ul>
  	<?php if(pagination == 'true'){ ?>
  	<div class="navigation">
  	  <div class="alignleft"><?php previous_posts_link('« Previous') ?></div>
  	  <div class="alignright"><?php next_posts_link('More »') ?></div>
  	</div>
  	<?php } ?>
  	<?php $wp_query = null; $wp_query = $temp;
  	$content = ob_get_contents();
  	ob_end_clean();
  	return $content;
  }
  add_shortcode("loop", "myLoop");
  

  display a loop :

  [loop category="news" query="" pagination="false"]
  

  http://www.wprecipes.com/

   
• 

  Jay Kwong 7:08 am on January 19, 2010 Permalink | Reply
  Tags: images, post (3), thumb (3), Wordpress (7)   

  Automatically resize post pictures 

  First, note that this code use TimThumb to resize pictures. This recipe explain how to install TimThumb on your WordPress blog.

  Let’s start by creating the shortcode. Just paste the code below into your functions.php file.

  function imageresizer( $atts, $content = null ) {
  	return '<img src="/timthumb/timthumb.php?src='.$content.'&w=590" alt="" />';
  }
  
  add_shortcode('img', 'imageresizer');
  

  Then, you can use the following syntax to add an automatically resized image to your blog post:

  [img]http://www.yoursite.com/yourimage.jpg[/img]