Circumventing the normal image upload process

I have a page that I would like to work on little techniques and then show them off. I built a scrolling banner that uses images and then scrolls them in order. I have successfully built this with static HTML but I have never done so in Wordpress.

I have uploaded the images to my MAMP server and I call them in their respective s. It all works except the images don't load. Also, while troubleshooting I loaded an image by itself on the same page and it did not display either.

How can I load images in for an individual page? Techicnally, they aren't to be used outside of that page. Hmm.

-Josh

    <?php
    /*

    Template Name: scrolling headers


    */

    get_header(); ?>

    <div id="primary" class="site-content">
        <div id="primary" class="site-content" style="width:100%;">
    <!-- Each image is 350px by 233px -->
            <div class="photobanner">
                <img class="first" src="../converted_images/lebowoski-01.jpg" alt="lebowoski-01" width="350" height="197" />
                <img src="../converted_images/lebowoski-04.jpg" alt="lebowoski-04" width="350" height="197" />
                <img src="../converted_images/lebowoski-03.jpg" alt="lebowoski-03" width="330" height="233" />
                <img src="../converted_images/lebowoski-09.jpg" alt="lebowoski-09" width="350" height="224" />
                <img src="../converted_images/lebowoski-02.jpg" alt="lebowoski-02" width="350" height="197" />
                <img src="../converted_images/lebowoski-08.jpg" alt="lebowoski-08" width="350" height="197" />
                <img src="../converted_images/lebowoski-07.jpg" alt="lebowoski-07" width="350" height="197" />
                <img src="../converted_images/lebowoski-06.jpg" alt="lebowoski-06" width="350" height="210" />
                <img src="../converted_images/lebowoski-05.jpg" alt="lebowoski-05" width="350" height="210" />
            </div>
        </div><!-- #content -->
    </div><!-- #primary -->



    <?php get_footer(); ?>
images
Lavada Batz

Answers 1

Submit Answer
  • Mrs. Cloyd Beahan

    If the question is "Why don't my images load?" the answer is "Don't use relative URLs in a WordPress context."

    Use functions like admin_url and these other related functions instead.

    Relative URLs are relative to the URL of the page you are on, and are calculated by the browser. In other words, relative URLs are relative the URL as the (client-side) browser see it. With static HTML sites that more or less maps to the filesystem paths, and it works fine. With generated URL structures like WordPress creates that doesn't work.

    Think about http://example.com/category/aciform. In WordPress, there is no file at that location, yet that is the base for calculating the relative URL. It makes them very unreliable.

    Related

    http://yoast.com/relative-urls-issues/

Related Questions