У меня есть довольно простой «слайдер с расширенными списками», реализованный над моим контентом в моей пользовательской теме WordPress. Мне интересно, как я мог бы жестко кодировать PHP между ними, чтобы соединить свой слайдер с моей «темой». Я пытаюсь « пометить » слайдер, чтобы содержимое было загружено через «Recent-Posts» или через «Category». И как я мог установить «Featured Imgs» для отображения в качестве фотографии в слайдере и для отображения в моих выделенных разделах миниатюр в области списка?
Вот скриншот плагина jQuery I, на который я его выбрал;
(Их демо сломано, так.)
Ниже приведена разметка, которую я реализовал.
<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>
Обновленный Q здесь, с обновленной попыткой, все еще не решен
ПОСЛЕДНИЕ ОБНОВЛЕНИЯ: все еще пытаюсь получить изображения, чтобы втянуть. Я пробовал предложения Суни, но все же не могу заставить их втягиваться в слайдер (они в конечном итоге заполняются за пределами)
Некоторые из них я пробовал:
<?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>'; } ?>
Привет, вы можете получить get_posts
для получения сообщений.
Ниже приведен код .. Не протестирован ..
<?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; ?>
Вот как я это сделаю.
Вам понадобятся по существу две петли над сообщениями, которые вы хотите использовать, – один для создания вкладок, один для создания контента. Чтобы избежать выполнения двух запросов БД, кешируйте сообщения из одного запроса в массиве и используйте цикл foreach над этим массивом.
Используйте пользовательский запрос для получения объектов post, которые вы хотите использовать в своем слайдере: http://codex.wordpress.org/Class_Reference/WP_Query
Отказ от ответственности: это не будет работать дословно, но должно предоставить вам необходимые рамки
<?php $post_data = array(); // Use a custom query to get the posts you want for your slider $the_query = new WP_Query( $args ); // The Loop while ( $the_query->have_posts() ) : $the_query->the_post(); $post_data[] = $post; endwhile; // Reset Post Data wp_reset_postdata(); ?> <div id="featured" > <ul class="ui-tabs-nav"> <?php foreach($post_data as $key => $post){ // Out put the markup + data from the $post object that you need for your tabs } ?> </ul> <?php foreach($post_data as $key => $post){ // Out put the markup + data from the $post object that you need for your slider fragments } ?> </div>