<commit_before>---
layout: post
title: Show all images in a folder with PHP
tags:
- php
---

A simple PHP tool to list all images in a folder.

[Demo](http://pe.ngu.in/show-all-images-in-a-folder-with-php/)

When I work on homepage or mobile layouts, or anything like that, i prefer to first sketch things up on a piece of paper, or in Photoshop. Then after I have a couple of ideas, I take photos of my paper-sketches, make png files of my PSD ideas, and show it all to the client. After receiving feedback I make any changes required, and show everything to the client again. Sometimes it turns out to be a lot of images.

The way I use to show it to the client is by giving them a link to a place where i keep this one PHP file, and a ‘img’ folder where i keep all the images in. The PHP file automatically shows all the images in this folder, and I don’t have to manually update anything, just upload to the folder.

Images will display up to a max width of 900 pixels. Images larger than 900 pixels will show their full size if you click it.

You can link to a specific image as they're link anchored. Just click on the specific image and copy the browser URL.

You'll need PHP on your server in order for this to work.

### Setup
#### The easy way
This works out of the box, so you can either Git clone the repository, or [download the zip](https://github.com/justnarp/show-all-images-in-a-folder-with-php/archive/master.zip).

#### The <del>hard</del> <i>other</i> way
Add [`ins-imgs.php`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.php) and [`ins-imgs.css`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.css) in your root folder (or wherever your index file is).

In your index HTML, insert this:

```html
<!-- insert images here -->
<script src="ins-imgs.php"></script>
```

### Settings
In [`ins-imgs.php`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.php#L5-L17) you can find the following settings:

```php
    # Path to image folder
    $imageFolder = 'img/';

    # Show only these file types from the image folder
    $imageTypes = '{*.jpg,*.JPG,*.jpeg,*.JPEG,*.png,*.PNG,*.gif,*.GIF}';

    # Set to true if you prefer sorting images by name
    # If set to false, images will be sorted by date
    $sortByImageName = false;

    # Set to false if you want the oldest images to appear first
    # This is only used if images are sorted by date (see above)
    $newestImagesFirst = true;
```

Make the changes needed for your setup.

### Help, bugs, pull requests, etc.
Very welcomed.

### Customized implementations
[Easy Folio](https://github.com/justnarp/easy-folio) ([Demo](http://www.lukasspieker.com/hebrides/)) by [<NAME>](https://twitter.com/lukasspieker)<commit_msg>fix styling<commit_after>---
layout: post
title: Show all images in a folder with PHP
tags:
- php
---

A simple PHP tool to list all images in a folder.

[Demo](http://pe.ngu.in/show-all-images-in-a-folder-with-php/)

When I work on homepage or mobile layouts, or anything like that, i prefer to first sketch things up on a piece of paper, or in Photoshop. Then after I have a couple of ideas, I take photos of my paper-sketches, make png files of my PSD ideas, and show it all to the client. After receiving feedback I make any changes required, and show everything to the client again. Sometimes it turns out to be a lot of images.

The way I use to show it to the client is by giving them a link to a place where i keep this one PHP file, and a ‘img’ folder where i keep all the images in. The PHP file automatically shows all the images in this folder, and I don’t have to manually update anything, just upload to the folder.

Images will display up to a max width of 900 pixels. Images larger than 900 pixels will show their full size if you click it.

You can link to a specific image as they're link anchored. Just click on the specific image and copy the browser URL.

You'll need PHP on your server in order for this to work.

## Setup
### The easy way
This works out of the box, so you can either Git clone the repository, or [download the zip](https://github.com/justnarp/show-all-images-in-a-folder-with-php/archive/master.zip).

### The <del>hard</del> <i>other</i> way
Add [`ins-imgs.php`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.php) and [`ins-imgs.css`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.css) in your root folder (or wherever your index file is).

In your index HTML, insert this:

```html
<!-- insert images here -->
<script src="ins-imgs.php"></script>
```

## Settings
In [`ins-imgs.php`](https://github.com/justnarp/show-all-images-in-a-folder-with-php/blob/master/ins-imgs.php#L5-L17) you can find the following settings:

```php
    # Path to image folder
    $imageFolder = 'img/';

    # Show only these file types from the image folder
    $imageTypes = '{*.jpg,*.JPG,*.jpeg,*.JPEG,*.png,*.PNG,*.gif,*.GIF}';

    # Set to true if you prefer sorting images by name
    # If set to false, images will be sorted by date
    $sortByImageName = false;

    # Set to false if you want the oldest images to appear first
    # This is only used if images are sorted by date (see above)
    $newestImagesFirst = true;
```

Make the changes needed for your setup.

## Help, bugs, pull requests, etc.
Very welcomed.

## Customized implementations
[Easy Folio](https://github.com/justnarp/easy-folio) ([Demo](http://www.lukasspieker.com/hebrides/)) by [<NAME>](https://twitter.com/lukasspieker)
{'fraction_non_alphanumeric': 0.11245551601423487, 'fraction_numerical': 0.003202846975088968, 'mean_word_length': 3.6841666666666666, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 12, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4889619', 'n_tokens_mistral': 1763, 'n_tokens_neox': 1694, 'n_words': 748}