使用PHP在WP中“主题化"我的滑块 [英] 'Themeing' my Slider in WP with PHP
问题描述
我在自定义Wordpress主题的内容上方实现了一个非常基本的功能列表-图像滑块".我想知道如何在两者之间对PHP进行硬编码,以将滑块与主题"连接起来. 我正在尝试滑动滑块"主题",以便通过最新帖子"或类别"提取内容.以及如何设置功能图像"以使其在滑块中显示为照片,并显示在列表区域的很多缩略图部分中?
I have a pretty basic 'featured-list - image slider' implemented above my content in my custom Wordpress theme. I'm wondering how I could hardcode the PHP in between to connect my slider with my 'theme'. I'm trying to 'theme' the slider so that the content is pulled via 'Recent-Posts' or via a 'Category'. And how I could set the 'Featured Imgs' to display as the photo within the slider and to display in my alotted thumbnail sections in list area?
这是我选择的jQuery I插件的屏幕快照;
(演示已中断,所以.)
Here's a screenshot of the jQuery I plugin I picked this up on;
(Their demo is broke, so.)
以下是我实现的标记.
<div id="featured" >
<ul class="ui-tabs-nav">
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/image1-small.jpg" alt="" /><span>David King – on his True Crime thriller</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img src="images/image2-small.jpg" alt="" /><span>Tips from Steve Perry</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img src="images/image3-small.jpg" alt="" /><span>Tips from Chuck Berry</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img src="images/image4-small.jpg" alt="" /><span>SFIRS</span></a></li>
</ul>
<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/image1.jpg" alt="" />
<div class="info" >
<h2><a href="#" >David King – on his True Crime thriller</a></h2>
<p>David King is Lorem Ipsum Lorem Ipsum Lorem Ipsum...<a href="#" >read more</a></p>
</div>
</div>
<!-- Second Content -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Tips from Steve Perry</a></h2>
<p>Steve Perry is Lorem Ipsum Lorem Ipsum Lorem Ipsum...<a href="#" >read more</a></p>
</div>
</div>
<!-- Third Content -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Tips from Chuck Berry</a></h2>
<p>Chuck Berry is Lorem Ipsum Lorem Ipsum Lorem Ipsum...<a href="#" >read more</a></p>
</div>
</div>
<!-- Fourth Content -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Create a Vintage Photograph in Photoshop</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
</div>
</div>
</div>
最新更新: 仍在尝试获取图像.我尝试了Suni的建议,但仍无法使其在滑块内插入(它们最终出现在外面)
LATEST UPDATE: Still trying to get images to pull in. I've tried Suni's suggestions but still can't get them to pull in within the slider (They end up populating outside of)
下面我已经尝试过一些:
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post);
<?php if ( has_post_thumbnail()) { $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large'); echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute('echo=0') . '" >'; the_post_thumbnail('thumbnail'); echo '</a>'; } ?>
?>
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post);
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
?>
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post);
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large'); <a href="' . $large_image_url[0] . '" title="' . the_title_attribute('echo=0') . '" >
?>
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post); ?>
<?php if ( has_post_thumbnail()) { $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large'); echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute('echo=0') . '" >'; the_post_thumbnail('thumbnail'); echo '</a>'; } ?>
推荐答案
Hi, you can user get_posts
to fetch posts.
下面是代码..未测试..
Below is the code .. Not Tested ..
<?php
/**
* @package WordPress
* @subpackage Default_Theme'
*/
//get_header(); ?>
<div id="content">
<?php if (have_posts()) : ?>
<!--Your slider code goes here-->
<?php
$args = array(
'numberposts' => 5,
'orderby' => 'post_date',
'order' => 'DESC'
);
$posts_array = get_posts( $args );
?>
<div id="featured" >
<ul class="ui-tabs-nav">
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post);
?>
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-<?php echo $i; ?>">
<a href="#fragment-1"><img src="" alt="" style="display:none;"/>
<span>
<?php the_title(); ?><br />
<p class="info" style="padding-left:10px;"><?php the_excerpt(); ?></p>
</span>
</a>
</li>
<?php $i++;
endforeach; ?>
</ul>
<?php
$i = 1;
foreach ($posts_array as $post) : setup_postdata($post);
?>
<!-- First Content -->
<div id="fragment-<?php echo $i; ?>" class="ui-tabs-panel" style="">
<img src="<?php the_post_thumbnail('slider_image'); ?>" alt="" />
<div class="info">
<h2><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h2>
<p><?php the_excerpt(); ?><a href="<?php the_permalink(); ?>" >read more</a></p>
</div>
</div>
<?php $i++; endforeach; ?>
</div>
<!--Your slider code goes here-->
<!-- End Featured Lists Image Slider -->
<?php endif; ?>
这篇关于使用PHP在WP中“主题化"我的滑块的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!