I want to do a website that you can upload a picture and it shows up on the page right away. Like in specific order. For example if I have an empty collage grid of 6 pictures placements can I create a submit button to upload pictures to that collage page?
For the upload part check out repository stack
For display you have a lot of options.
When you said “lot of options” what do u mean? I need that all the pictures uploaded appears on the panel crop to fit. Is that possible with every option you suggest? Please point me to the right path
There are several gallery stacks available that can display images from a directory on the webserver.
Gallery 3 from the same developer would be an example. Not sure what all your requirements are.
Keep in mind that you should have some kind of security built in to prevent outsiders from uploading anything to your website.
You also need to look at what your hosting company limits as for file sizes.
Perhaps it’s not clear what exactly you want to achieve?
There are also warehouse stacks that display images from certain locations, so wiring the upload stack with the warehouse stack could be a rough direction.
I’m working on an interactive webcomic where people (members) will upload the panels. So if I enter the website and I see there’s three panels already done and the fourth is empty, I can draw mine and upload the one that is missing to complete the page. The idea is you visit the page for 1. Reading the comic or 2. Contribute to it. I think it could be made based on the stack suggestions. Any idea that help me get started with it?
@Albertkinng The first thing that draws my attention is “where people (members)…”, so it sounds like that you need a system to track the multiple panels and the uploads of multiple users?
I just played around, looks like it’s (more or less*) possible with the free Droplet Stack by stacks4stacks and a condition stack like Agent by weaver space (I used my own condition stack for this, let me know if you need it, I’ll send it to you). The uploaded image is shown bei either a warehouse stack (there are plenty) or, like in my example, a simple HTML stack.
*More or less means: I modified the Droplet stack to be able to have multiple instances on a single page and to configure filenames for each instance, those are later then used by the page to check if an image was already uploaded or not.
It could be something like this:
The first image was already uploaded when the page was shown, the second it a fresh upload into the Droplet stack, the other two slots are still empty.
It a grid with four drop zones, each configured for a different filename (strip1 to strip4):
There are some challenges:
- This doesn’t work for multiple users, they would overwrite each others uploads. But there are options with parameters and a bit of custom work on Droplet (to stay with this example)
- The images are shown in the Drop Zone after uploading, perfect would be reloading the page after a succesful upload
- You probably need a virus scanner on your server to make sure no infected files are uploaded.
Btw.: I like the idea!
I quickly uploaded the demo:
Warning: I did a church site last year…I wound never allow public to upload things (pics or comments) without checking them before posting. You would not believe the things people would upload to a church site!!!
OMG! You are awesome! Thanks for this well detailed explanation man. You just give me hope. Yes I will like that stack! And I’m glad you liked the idea. I’m really looking forward to achieve this. Thank you so much. Can I still contacting you if I need more help?
Thanks. I would filter the pics. That is a great advice
Sure. Feel free
I uploaded the example project with the modified stacks on my site:
Please note, the Droplet 2 Stack is a free download and originally written by @willwood / stacks4stacks. You might consider a small donation to him, he’s doing some great work.
I will! Thanks