Slider Thumbnail page

  • Hi there,

    I was wondering if anybody van point me the right direction. Im developing my own theme for my own use. Im not a programmer, do know my HTML and CSS and a little PHP and so on.

    The THING!
    I’m creating a page with a wide slider on top, below that it pulls thumbs and excerpts. So I started messing around with multiple loops, due I think that is the case.

    What the page has to do. Only load posts from a certain category, show the 1th 5 in the nivo slider (which already has been setup) followed by thumbnails from the rest of the posts in the category.

    <?php
/*
Template Name: Portfolio
*/
?>

<?php get_header(); ?>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">

jQuery(window).load(function() {
	jQuery('#slider').nivoSlider({
		effect:'fade', //Specify sets like: 'fold,fade,sliceDown'
    slices:15,
		animSpeed:500, //Slide transition speed
		pauseTime:5000,
		startSlide:0, //Set starting Slide (0 index)
		directionNav:true, //Next & Prev
		directionNavHide:true, //Only show on hover
		controlNav:true, //1,2,3...
		keyboardNav:true, //Use left & right arrows
		pauseOnHover:true, //Stop animation while hovering
		captionOpacity:0.8, //Universal caption opacity
	});
});
</script>

<body>
    <nav>
      <?php wp_nav_menu(array('menu' => 'Main Nav Menu')); ?>
      <a href="https://www.twitter.com/Kortschot" target="_blank" class="twitterbird-nav"></a>
    </nav>

    <p style="font-size: 16px; text-align:center; padding:10px 0 0 0;">Deze pagina is nog in ontwikkeling</p>

    <div id="main-content-werk">
      <div id="slider">
       <?php $my_query = new WP_Query('showposts=5&category_name=werk'); while ($my_query->have_posts()) : $my_query->the_post(); ?>
       <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
       <img src="<?php echo get_post_meta($post->ID, 'slider-image', true); ?>" alt="" title="<?php the_title(); ?>" />
       </a>
       <?php endwhile; ?>
      </div>
      <br clear="all" />
    </div> <!-- end main-content-werk -->

    <?php get_footer(); ?>

    Anybody who can show me the way… I appreciate it.

    With Regards,
    Paul te Kortschot

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter kortschot

    (@kortschot)

    These threads go soooo quickly =) just a comment to try and get the post up a bit.

    (no idea if it works though)

    Thread Starter kortschot

    (@kortschot)

    little update,

    Now I have:

    <div id="slider">
          <?php $my_query = new WP_Query('category_name=werk&posts_per_page=3');
           while ($my_query->have_posts()) : $my_query->the_post();?>
           <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, 'slider-image', true); ?>" alt="" title="<?php the_title(); ?>" /></a>
           <?php endwhile; ?>
         </div> <!-- END slider -->

         <br clear="all" />

        <?php rewind_posts(); ?>
        <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
          <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
      <?php endwhile; endif; ?>

    But now it posts the page permalink below the slider… I cant get it to list the category posts. When I get this working I can use offset to skip the posts in the slider… at least thats the plan.

    Anybody who has an idea…. please, i’m all ears.

    With Regards,
    Paul

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Slider Thumbnail page’ is closed to new replies.