ThemeShaper Forums » Thematic

[closed]

Making Nivo Slider fully valid

(4 posts)
  • Started 7 years ago by proto
  • Latest reply from proto
  • This topic is resolved
  1. proto
    Member

    Hello all,

    I think I'm nearly there and have got Nivo Slider working on my website (hurray!) I just need to make it validate on the W3C validator. I think I only need a small tweak to make it work but just wanted a pointer:

    Here's the error message when I try and validate with W3C validator as XHTML 1.0 Transitional The ">" just after "Slide Three" is causing the validation problem, here's the actual W3C error message below:

    document type does not allow element "a" here; missing one of "object", "span", "bdo", "applet", "iframe", "tt", "i", "b", "u", "s", "strike", "big", "small", "font", "em", "strong", "dfn", "code", "q", "samp", "kbd", "var", "cite", "abbr", "acronym", "sub", "sup", "label", "ins", "del" start-tag
    …ree/slide-three-2" title="Slide Three"<problem>></problem><img width="940" height="300" src="http…
    ✉

    Here's my loop code which works (but I think I need to tweak to make XHTML 1.0 Transitional:

    <div class="grid_12">
     <div class="nivoSlider">
    <?php query_posts('category_name=slideshow&posts_per_page=3'); ?>
    
        <div id="slider" class="nivoSlider img">
         <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
            	<?php
    				if ( has_post_thumbnail() ) {
    						echo '<a href="';
    						the_permalink();
    						echo '">';
    						the_post_thumbnail('nivothumb', array( 'alt' => get_the_title(), 'title' => get_the_title()));
    						echo '/</a>';
    					}
    			?>
    
    	<?php endwhile; ?>
        </div><!-- End the slider -->

    I tried adding an

    'echo .'/' after my "'title' => get_the_title()));" to make it valid but the code didn't work from a syntax point of view, so I couldn't use it, can someone point out how I can validate this please! :)

    Here's my homepage in case you it's useful to see page source etc:

    https://www.universalonewebdesign.com/bespoke-design-three/

    Posted 7 years ago #
  2. proto
    Member

    The webpage to checkout the slider is here (in case it helps you look at things!):

    https://www.universalonewebdesign.com/bespoke-design-eleven/

    Posted 7 years ago #
  3. If you view source on the page, you will see.

    <a href="https://www.universalonewebdesign.com/bespoke-design-eleven/slideshow-one"><a href="https://www.universalonewebdesign.com/bespoke-design-eleven/slideshow-one" title="Slideshow One"><img width="940" height="300" src="https://www.universalonewebdesign.com/bespoke-design-eleven/wp-content/uploads/2011/12/slideone.jpg" class="attachment-nivothumb wp-post-image" alt="Slideshow One" title="Slideshow One" /></a></a>

    The error is caused because you have a link nested inside another link (simplified example below).

    <a><a><img></a></a>

    While this kind of error is a good one to fix, don't put too much weight into the validator for making a site with the goal of being 100% valid also or you will go crazy.

    Posted 7 years ago #
  4. proto
    Member

    Thanks so much ScottNix,

    Your help is greatly appreciated! Thanks to your help here is the code that validates and the slideshow loads well!

    <div class="nivoSlider">
    <?php query_posts('category_name=slideshow&posts_per_page=3'); ?>
    
        <div id="slider" class="nivoSlider img">
         <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
            	<?php
    				if ( has_post_thumbnail() ) {
    
    						the_post_thumbnail('nivothumb', array( 'alt' => get_the_title(), 'title' => get_the_title()));
    
    					}
    			?>
    
    	<?php endwhile; ?>
    
        </div><!-- End the nivoSlider -->
        </div><!-- End the slider -->
    Posted 7 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.