简体   繁体   中英

PHP Automatically upload images in folder

I'm really beginner in web programming. I want to make webpage which contain photo gallery. This is the code

<body>
    <div class="container">
        <header class="clearfix">
        </header>
        <div class="main">
            <a class="fancybox" href="gallery/1.jpg" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"><img src="gallery/1.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/2.jpg" data-fancybox-group="gallery" title="Etiam quis mi eu elit temp"><img src="gallery/2.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/3.jpg" data-fancybox-group="gallery" title="Cras neque mi, semper leon"><img src="gallery/3.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/4.jpg" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"><img src="gallery/4.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/5.jpg" data-fancybox-group="gallery" title="Etiam quis mi eu elit temp"><img src="gallery/5.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/6.jpg" data-fancybox-group="gallery" title="Cras neque mi, semper leon"><img src="gallery/6.jpg" alt="" /></a>
            <a class="fancybox" href="gallery/7.jpg" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"><img src="gallery/7.jpg" alt="" /></a>
        </div>
    </div>
</body>

I have to type the name of photos manually. But it will be tired if the amount of photos is too much. I want to add php code to upload those images from a folder automatically. How to use php code inside the

<div class="main"></div>

Please give me example.

you can use PHP RecursiveDirectoryIterator

<body>
    <div class="container">
        <header class="clearfix">
        </header>
        <div class="main">
        <?php $images = new RecursiveDirectoryIterator('images');
        foreach($images as $img){
        if(is_dir($img->getFileName())){ continue; }
            echo '<a class="fancybox" href="folder/'.$img->getFileName().'" data-fancybox-group="gallery" title="'.$img->getFileName().'"><img src="folder/'.$img->getFileName().'" alt="'.$img->getFileName().'" /></a>';
        }?>

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

Try this in your <div> : <body> <div class="container"> <header class="clearfix"> </header> <div class="main"> <?php $image_array = array_diff(scandir("images"), array('..', '.')); $i = 0; foreach ($image_array as $key) { ?> <a class="fancybox" href="<?php echo 'images/'.$key; ?>" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"> <img src="<?php echo 'images/'.$key; ?>" alt="" height="150" width="150"/></a> <?php $i++; } ?> </div> </div> </body> <body> <div class="container"> <header class="clearfix"> </header> <div class="main"> <?php $image_array = array_diff(scandir("images"), array('..', '.')); $i = 0; foreach ($image_array as $key) { ?> <a class="fancybox" href="<?php echo 'images/'.$key; ?>" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"> <img src="<?php echo 'images/'.$key; ?>" alt="" height="150" width="150"/></a> <?php $i++; } ?> </div> </div> </body> <body> <div class="container"> <header class="clearfix"> </header> <div class="main"> <?php $image_array = array_diff(scandir("images"), array('..', '.')); $i = 0; foreach ($image_array as $key) { ?> <a class="fancybox" href="<?php echo 'images/'.$key; ?>" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"> <img src="<?php echo 'images/'.$key; ?>" alt="" height="150" width="150"/></a> <?php $i++; } ?> </div> </div> </body> Change images to your folder name.

This should be use full

<body>
    <div class="container">
        <header class="clearfix">
        </header>
        <div class="main">
            <?php
                $image_array = array_diff(scandir("YOUR IMAGES FOLDER NAME"), array('..', '.'));
                $i = 0;
                foreach ($image_array as $key) { ?>
            <a class="fancybox" href="<?= 'YOUR IMAGES FOLDER NAME/'.$key ?>" data-fancybox-group="gallery" title="Lorem ipsum dolor sit amet"><img src="<?= 'YOUR IMAGES FOLDER NAME/'.$key ?>" alt="" height="150" width="150"/></a>
            <?php $i++; } ?>
        </div>
    </div>
</body>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM