做这样的事情作为一个项目来说是比较大的，所以我不能真正地发布代码来做你真正想要的事情，但是你可以把它作为一个项目委托给某人来帮助你完成项目的这一方面。
但以下是执行类似操作所涉及的步骤：
步骤1；注册自定义帖子类型
function create_post_type() {
register_post_type( \'products\',
array(
\'labels\' => array(
\'name\' => __( \'products\' ),
\'singular_name\' => __( \'products\' )
),
\'public\' => true,
\'menu_position\' => 6,
\'rewrite\' => array(\'slug\' => \'products\'),
\'supports\' => array(\'title\',\'thumbnail\',\'editor\',\'custom-fields\')
)
);
}
add_action(\'init\', \'create_post_type\');
Codex链接：
http://codex.wordpress.org/Function_Reference/register_post_type步骤2；显示自定义帖子类型下面的代码基本上将您的自定义帖子打印到一个页面中，并将html标记准备好用于jQuery的样式和功能。
<ul> <!-- to hold the posts -->
<?php
$paged = (get_query_var(\'paged\')) ? get_query_var(\'paged\') : 1;
$post_per_page = 9; // -1 shows all posts & show 3 per line so 9 in total before showing the other pages
$do_not_show_stickies = 1; // 0 to show stickies
$args=array(
\'post_type\' => \'products\',
\'paged\' => $paged,
\'posts_per_page\' => $post_per_page,
\'order\' => \'ASC\',
);
$temp = $wp_query; // assign orginal query to temp variable for later use
$wp_query = null;
$wp_query = new WP_Query($args);
if( have_posts() ) : while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
<?php $download_link = get_post_meta($post->ID, \'download-link\', $single = true); // custom field on post to allow entry of a http link for the download?>
<li>
<?php the_post_thumbnail(array(200,300), array(\'title\' => trim(strip_tags( $attachment->post_title)), ));?>
<a href="#" class="trigger"><?php the_title();?></a>
</li>
<div class="tooltip">
<?php the_post_thumbnail(array(200,300), array(\'title\' => trim(strip_tags( $attachment->post_title)), ));?>
<a href="<?php echo $download_link ?>"><?php the_title();?></a>
<?php the_content();?>
</div>
<?php endwhile; ?>
<?php endif; $wp_query = $temp; //reset back to original query ?>
<?php wp_reset_query();?>
</ul>
要以编号格式显示下一页和上一页，您可以使用诸如WP分页之类的插件来获取编号页，如[1][2][3]
步骤3；jQuery需要花费最多的时间来实现，但您可以查找工具提示样式的插件或编写自己的插件，但如果您自己编写插件，则只需使用上述代码中的div并添加一个。隐藏（）到该位置；
然后，当鼠标悬停在一个class=“trigger”上时，它会。show（）这个div，这个div将为您的鼠标保存信息，以获得页面滑动效果，这本身就是一个更大的任务。
但我希望以上内容能帮助您开始您的项目。
下面是一些jQuery插件，它们将在这一过程中帮助您；
http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/http://jquery.bassistance.de/tooltip/demo/
