Intereting Posts
Как изменить пользователя через SQL? Отключить просмотр каталогов загружаемых файлов Закрытие вложений данных для последующего обновления почты? Основной вопрос о передаче переменных в AJAX в WordPress Как установить задание cron для моего сайта WordPress? Как получить список сообщений с пустым содержимым Пользовательский пост, заданный объект. Соглашения о таксономии в плагине $ wpdb Ошибка запуска Mysql wp_login не работает из-за сохраненного паролем браузера Создание блога на моем новом веб-сайте с использованием WordPress, но у меня есть проблемы с боковой панелью Как получить несколько флажков в одном мета-поле Каков наилучший способ добавить тег расширенного / промежуточного / начального к сообщению Как разместить пользовательские типы сообщений на главной странице Если (категория / тег отмечен), то (display header2php) боковая панель не отображается при использовании данных

Какой плагин можно использовать для создания списка / слайд-шоу из цветных изображений?

Я ищу плагин, который позволит пользователю загружать файлы, возможно, 4-10, которые можно использовать на главной странице как часть слайд-шоу. Я могу закодировать часть слайд-шоу самостоятельно, если это необходимо, но то, что меня интересует, – это способ для пользователя выбирать / загружать фотографии. Было бы замечательно, если бы они были интегрированы с медиа-менеджером WordPress так же, как и другие загрузки. Благодаря!

Solutions Collecting From Web of "Какой плагин можно использовать для создания списка / слайд-шоу из цветных изображений?"

jQuery Cycle и Cycle Lite очень гибкие и очень просты в использовании.

Большинство плагинов слайдшоу WordPress либо не делают именно то, что вам нужно, либо стараются сделать все и слишком сложно с параметрами и функциями.

Решение

Создайте слайд-шоу в шаблоне темы или создайте собственный плагин.

Чтобы сделать его простым и интуитивно понятным для пользователя, я бы создал настраиваемый тип сообщений «Избранный контент», который поддерживает только изображение с изображением (миниатюра) и выдержку, если вы хотите добавить подпись к каждому изображению.

Зарегистрируйте свой собственный тип сообщения и для использования аргументов поддержки:

'supports' => array('thumbnail','excerpt',) 

Запустите свои скрипты в functions.php

 <?php add_action( 'init', 'c3m_get_the_js' ); function c3m_get_the_js() { wp_register_script( 'jquery.cycle', get_bloginfo('template_directory'). '/path_to_your_js/jquery.cycle.lite.1.1.min.js', array('jquery'), TRUE); wp_enqueue_script('jquery.cycle' ); wp_enqueue_script( 'custom', get_bloginfo('template_directory'). '/path_to_your_js/c3m_functions.js', array('jquery.cycle'), TRUE); } ?> 

Задайте размер вашего «изображенного изображения» в functions.php

 add_image_size( 'featured', 747, 285, true ); 

Настройте шаблон для показа слайд-шоу

 <div id="home-slider"> <div class="cycle-nav"> <a id="prev2" href="#">«Prev</a> <a id="next2" href="#">Next»</a> </div> <ul id="cycle" class="pics"> <?php $i = 1; global $wp_query; $custom_query = array( 'post_type' => 'featured_content', 'posts_per_page' => -1 ); if ( $custom_query ) query_posts( $custom_query ); $more = 0; ?> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <li class="cycle-item slide-<?php echo $i; ?>"> <?php the_post_thumbnail('featured'); ?> <div class="excerpt"> <?php echo get_the_content('<span class="more">more &raquo;</span>'); //Use this if you want text with your images ?> </div> </li> <?php $i++; endwhile; endif; ?> <?php wp_reset_query(); ?> </ul> </div> <!-- /home-slider --> 

Добавьте параметры цикла jQuery в свой файл custom.js

 jQuery.noConflict(); jQuery(document).ready(function($) { jQuery('ul#cycle').cycle({ timeout: 9000, speed: 1500, delay: 2000, prev: '#prev2', next: '#next2' }); }); 

Добавить css

  #home-slider { width:735px; overflow:hidden; height:280px; float:right; position:relative; margin-right:0; display:inline-block } a#prev2 { position:absolute; width:31px; height:32px; text-indent:-999em; z-index:100; background-position:0 0; background-image:url(images/cycle-nav.png); top:185px; box-shadow:1px 1px 2px rgba(2,2,2,0.3); -moz-box-shadow:1px 1px 2px rgba(2,2,2,0.3); -webkit-box-shadow:1px 1px 2px rgba(2,2,2,0.3) } a#prev2:hover { background-position:0px -32px } a#next2 { position:absolute; right:0px; width:31px; height:31px; display:block; z-index:100; top:185px; background-position:31px 0px; background-image:url(images/cycle-nav.png); overflow:hidden; text-indent:-999em; box-shadow:1px 1px 2px rgba(2,2,2,.3); -moz-box-shadow:1px 1px 2px rgba(2,2,2,0.3); -webkit-box-shadow:1px 1px 2px rgba(2,2,2,0.3) } a#next2:hover { background-position:31px -32px } ul#cycle { margin:0; padding:0; list-style:none } ul#cycle .excerpt { width:700px; height:82px; background: rgb(0, 0, 0); background:rgba(0,0,0,.5); position:absolute; bottom:0; padding:10px 20px 10px 25px; overflow:hidden } 

Пользовательский интерфейс

введите описание изображения здесь

Ползунок на передней панели

введите описание изображения здесь