0

ページインジケーターを使ってWordpressでフォトギャラリーを作成する簡単な方法を探しています。WP Nivo Slider http://wordpress.org/extend/plugins/wp-nivo-slider/screenshots/を見つけましたが、何ができるか、いつ使用できるかという点で非常に制限があります。

理想的には、HTMLに多数の画像を含め、スライダーでタグを自動的に取得して1つに結合するようにしたいのですが、シンプルでありながら柔軟なAPIが優れています。

4

2 に答える 2

1

私はNivoSliderWordpressプラグインとその制限については見ていませんが、スタンドアロンのNivo SliderはWordpressのインストールで簡単に使用でき、多くの柔軟性を提供します。ページインジケーターの意味はわかりませんが、必要に応じてページ/投稿から情報を引き出すことができます。例を挙げると、以下のコードを使用して、特定のカテゴリの投稿から注目の画像を引き出すカスタムクエリを使用して画像スライダーを作成しました。

     <!-- Slideshow -->
        <div id="nivowrapper">
          <div id="nivoslider">
            <?php 
            $featured_slide = new WP_Query('cat=4&showposts=-1');
            while ($featured_slide->have_posts()) : $featured_slide->the_post();
              ?>
               <?php 

                if (function_exists('has_post_thumbnail') && has_post_thumbnail()) {
                    $img_height = 293;
                    $img_width  = 960;

                    slider_image(thumb_url(),$img_width,$img_height);

                }
              ?>
            <?php endwhile; ?>
            <?php wp_reset_query(); ?>
          </div>
        </div>
    <!-- Slideshow End -->

これは、私のfunctions.phpにあるメソッドslider_image（）とメソッドthumb_url（）を使用します-これは、クライアントが間違ったサイズの画像をアップロードした場合に、timthumbを使用して全体が南に移動しないようにするためです注目の投稿カテゴリに。

Functions.phpで

 # This function returns the attached Featured image in the page / post
 function thumb_url(){  
   $thumb_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array( 960,960 ));
   return $thumb_src[0];
 }


# This function resizes the featured image to the requested proportions via timthumb. 
function slider_image($image_source,$width,$height) {
  global $post;

  echo '<img src="'.get_bloginfo('template_directory').'/timthumb.php?src='.$image_source.'&amp;h='.$height.'&amp;w='.$width.'&amp;zc=1" alt="" title="'.get_the_title().'" />';
}

Firefoxでキャプションが消えるという問題があり、解決されなかったため、NivoSliderを少しオフにしました。Flexslider 2を見たことがありますか？技術的にはまだベータ版だと思いますが、素晴らしく、高度に構成可能です。私はそれをサイトで使用したばかりで、それは素晴らしいです（特に、指でスワイプしてタブレットやスマートフォンでスクロールできるという事実）。

これが少し役立つことを願っています。

編集

これを読んでいて、Nivo Sliderをスタンドアロンで使用したことがない人のために、最後にもう1つ追加する必要があることに気付きました。NivoSliderを初期化する必要があります。Nivo Slider Javascriptファイル（functions.phpにエンキューします）とCSSを含め、次のコードを先頭または終了bodyタグの前に配置します。必要に応じてパラメータを変更できます。

  <script type="text/javascript">
    jQuery(window).load(function($) {

      jQuery('#nivoslider').nivoSlider({
        effect:'fade',
        slices:15,
        animSpeed:700, 
        pauseTime:7000,
        controlNav: false,
        directionNav: true,
        directionNavHide: false,
        captionOpacity: 1
      });

    });
    </script>
于 2012-07-06T20:47:15.317 に答える
1

私はrivaスライダープロ（http://rivaslider.com/）を使用しています。これは有料のプラグインですが、非常にうまく機能し、非常に使いやすいです。サムネイル、アイコン、または小さなインジケータードットをページインジケーターとして出力するかどうかを選択できます。パッケージにはテーマが含まれていますが、スライダーごとに、管理者内でCSSをオーバーライドできます。

唯一の欠点。応答しません。応答性を高めるために編集しましたが、箱から出して高さと幅が固定されています。これは少し面倒です。

これを使用するには、スライドショーを設定し、ショートコードを使用して投稿/ページに埋め込みます。探しているもののように聞こえます。

于 2012-07-06T21:44:06.010 に答える