...

View Full Version : Nivo-Slider Help



Canman07
05-26-2012, 03:15 AM
Hey so on my localhost the nivo slider was working perfectly fine. I uploaded everything to my wordpress theme and boom - only the loading.gif is showing... Any solution to this?


Header.php
<script src="/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
slices: 15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed: 500, // Slide transition speed
pauseTime: 3000, // How long each slide will show
startSlide: 0, // Set starting Slide (0 index)
directionNav: true, // Next & Prev navigation
directionNavHide: true, // Only show on hover
controlNav: true, // 1,2,3... navigation
controlNavThumbs: false, // Use thumbnails for Control Nav
controlNavThumbsFromRel: false, // Use image rel for thumbs
controlNavThumbsSearch: '.jpg', // Replace this with...
controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
keyboardNav: true, // Use left & right arrows
pauseOnHover: true, // Stop animation while hovering
manualAdvance: false, // Force manual transitions
captionOpacity: 0.8, // Universal caption opacity
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
randomStart: false, // Start on a random slide
beforeChange: function(){}, // Triggers before a slide transition
afterChange: function(){}, // Triggers after a slide transition
slideshowEnd: function(){}, // Triggers after all slides have been shown
lastSlide: function(){}, // Triggers when last slide is shown
afterLoad: function(){} // Triggers when slider has loaded
});
});
</script>

Index.php

<div id="newslider">
<div id="slider_wrapper">
<div id="slider">
<img src="<? bloginfo('stylesheet_directory'); ?>/images/mario.jpg" title="#htmlcaption" />
<img src="<? bloginfo('stylesheet_directory'); ?>/images/starcraft2slider.jpg" title="#htmlcaption" />
<img src="<? bloginfo('stylesheet_directory'); ?>/images/leagueoflegends.jpg" title="#htmlcaption" />

</div>

<div id="htmlcaption" class="nivo-html-caption">
<a href="#" style="color: white;"><h2>Back2Back wins IPL</h2></a>
<span class="slider-readmore"><a href="#">Read More</a></span>
<p>Everything about the news event will be posted here. It can go on and on intill you are all done then have a read more link at the end to link it to the full page of the story yup yup. Everything about the news event will be posted here. It can go on and on intill you are all done then have a read more link at the end to link it to the full page of the story yup yup.</p>

</div>
</div>
</div>

Any ideas?

VIPStephan
05-26-2012, 07:34 PM
You are including the plugin script before you even include the core framework on which the plugin is based.
The current file path assumes that the file is in the root directory of your installation. Check that this is indeed correct or adjust it accordingly.

Canman07
05-26-2012, 09:35 PM
Thanks for your support Stephan! I was finally able to get it to work, the problem was the file path - stupid me!

However, I am unsure of how to link the slider to wordpress so that it is separate from posts. Meaning, I want to be able to select a tab in the WP admin "Slider" (or something along those lines) where I can go to upload an image, caption, and post link. Again, completely separate from selecting "featured image" on a post. Here is a good example of what I mean, but don't really know how to go about doing it:

http://oi49.tinypic.com/2nk0uad.jpg

_Aerospace_Eng_
05-26-2012, 09:52 PM
Why are you trying to reinvent the wheel? Just install the Nivo Slider plugin. http://nivo.dev7studios.com/features/#wordpress

Canman07
05-26-2012, 10:11 PM
Why are you trying to reinvent the wheel? Just install the Nivo Slider plugin. http://nivo.dev7studios.com/features/#wordpress

I'd rather not buy a nivo slider wordpress plugin when the outcome is obtainable at no cost.

VIPStephan
05-27-2012, 12:29 AM
However, I am unsure of how to link the slider to wordpress so that it is separate from posts. Meaning, I want to be able to select a tab in the WP admin "Slider" (or something along those lines) where I can go to upload an image, caption, and post link. Again, completely separate from selecting "featured image" on a post.

You need to create/register a new post type: http://codex.wordpress.org/Function_Reference/register_post_type You can then have a “Slides” menu item in the admin menu which basically works the same as regular posts but is separate from them.

Canman07
05-27-2012, 04:17 AM
Making progress, but the images don't show up nor do the excerpts or titles... hmmmm


<?php query_posts('post_type=slider'); ?>
<div id="slider">
<?php the_post_thumbnail();?
<div id="htmlcaption" class="nivo-html-caption">
<a href="<?php echo get_permalink(); ?>" style="color: white;"><h2><?php the_title(); ?></h2></a>
<span class="slider-readmore"><a href="<?php the_permalink(); ?>">Read More</a></span>
<p><?php echo excerpt(45); ?></p>
</div>
</div>
<?php ?>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum