使用javascript显示来自Wordpress查询的多组内容项 [英] Display multiple sets of content items a from a Wordpress query with javascript
本文介绍了使用javascript显示来自Wordpress查询的多组内容项的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试使最近的帖子显示在带有Java脚本的褪色内容列表中.我想提取12条最新帖子,然后一次显示4条,从最新到最少.
I am trying to get my recent posts to display in a fading content list with java-script. I want to pull 12 of the latest posts, and then display them, 4 at a time, from most recent to least.
这些是我的查询详细信息:
These are my query details:
<?php
$my_query = new WP_Query('showposts=12');
while ($my_query->have_posts()) : $my_query->the_post();
?>
<?php
if (strlen(the_title('','',FALSE)) > 80) {
$title_short = substr(the_title('','',FALSE), 0, 80);
preg_match('/^(.*)\s/s', $title_short, $matches);
if ($matches[1]) $title_short = $matches[1];
$title_short = $title_short.'...';
}
else
{
$title_short = the_title('','',FALSE);
}
?>
我希望它们在此脚本中正确显示:
I would like them to appear properly with this script:
<script>
var $items = $('#marquee li'),
i = 0;
function slide() {
var index = i % $items.length;
$items.hide().removeClass('curr').slice(index, index +4).show('fade').addClass('curr');
i += 4;
setTimeout(slide, 4000);
};
slide();
</script>
这是我的上下文的组织方式:
This is how my context is organized:
<div id="mholder">
<ul id="marquee">
<li><div class="marquee" style="height: auto">
<a title="<?php echo the_title() ?>" href="<?php the_permalink() ?>"><?php echo $title_short ?></a><span><small><br/><?php the_time('F jS, g:i a') ?></small></span>
</div></li>
</ul>
</div>
推荐答案
<head>
<script data-require="jquery@*" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div class="newsblock">
<ul id="newgall">
<?php
//display 10 posts with title and date
$args=array(
'post_type' => 'post',
'post_status' => 'publish',
'post_category' => '123',
'posts_per_page' => 12,
'caller_get_posts'=> 1
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post();
?>
<li>
<p>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a>
<br/><?php the_time('F jS, g:i a') ?>
<br/>
</p>
</li>
<?php
endwhile;
}
wp_reset_query(); // Restore global post data stomped by the_post().
?>
</ul>
</div>
<script>
var $items = $('#newgall li'),
i = 0;
function slide() {
var index = i % $items.length;
$items.hide().removeClass('curr').slice(index, index +4).show('fade').addClass('curr');
i += 4;
setTimeout(slide, 400);
};
slide();
</script>
</body>
确保通过插件启用了PHP.该代码有效.
Make sure PHP is enabled though a plugin. This code works.
这篇关于使用javascript显示来自Wordpress查询的多组内容项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文