How does one best host and display images on a website?

How does one best host and display images on a website?

I got shanghaied into making a website for my choir on the virtue of being the only one being able to turn on a computer, which is fine. Trouble is that I haven't done large scale project like this before and one of the requirements is that they want to display lots pictures and videos from when we are out singing.

I know how to use html to display picture with tags and all that, but its unwieldy and impractical when we are talking about potentially hundreds if not thousand of pictures.

Is there way where you can just drop in the pictures and movies and will largely automatically display them properly on the appropriate page or sub page?

Other urls found in this thread:

zenphoto.org/
codex.wordpress.org/Installing_WordPress
premium.wpmudev.org/blog/forum-wordpress/
35.189.88.125/
sass-lang.com/guide,
twitter.com/NSFWRedditImage

Yes of course, but not without additional knowledge. Something like Zenphoto zenphoto.org/ or another CMS gallery will do the trick, but require SQL, PHP and other languages to implement.

Have you considered wordpress? There are plenty of wordpress plugins which are one click installations, plus there are tons of guides on how to install wordpress, again; these things require sequel and PHP in order to function.

>zenphoto.org/

At first look it looks like what I am looking for. I can learn whatever language I need along the way, I got all summer. But will it work whit vidoes? And google machine? I heard someone recommend firebase, but I have no idea where to start on that.

>Have you considered wordpress?

They had an old website they had made years ago laying around so I have been using it, updating old code and doing cleanups. But its all kinds of messy. I mean, there is giant pics on the front page that takes forever to load.That aside, wordpress is way too "bloggy" for what they wanted.

In fact, the website is propacechoir dot com if ya want to have a look at its current state..

Thanks a lot by the way!

What you want is a CMS (Content Management System) gallery, there are plenty of fantastic free plugins which do exactly that, I'd suggest asking in the web development general if you want more suggestions, there's always a thread up during the day.

>That aside, wordpress is way too "bloggy" for what they wanted.
Wordpress is what you make it, it's just a base on which to iterate, sure the majority use it for blogs but there are many very elaborate and functional websites used by massive corporations that run on wordpress, at the core it's a CMS not a blogging platform, it's just so easy to set up that even the average blogger degenerate can do it.

Personally I'd suggest wiping the server clean, installing the latest Wordpress version then load it with plugins to minimise your workload, that way anyone with a login can add images instead of you being fronted with all tasks.

>4.608px × 2.702px
>5.710,69 KB
w-e-w

You are tempting me, I like having absolute control over what I can do, which is why I code it on my own in html, I haven't tried using wordpress, how, ah, open source is it? I am afraid of getting locked into it where I have to be limited to the available themes and plugins and can't muck about in the code and do what I want.

I know right? One of the girls in the choir is a media designer of some short, she loves taking pictures and is the one responsible for designing the look of the site. I keep telling her to send me scaled down pictures, but she insist on using those. Which is why I removed the media page, it was way to unwieldy. It would be grand if one of the pluggins could scale the pics automatically.

>that preload comic sans
made me kek
>that postload... lobster two?
made me vomit

Please, please, for the love of god, convince them to let you use a more readable font than whatever's there. It's okay for title sized stuff, but for paragraph sized content, even just Verdana would be 100x better.

But I digress. basically - wordpress will be fine for what you need. I'd recommend Amazon Web Services' free tier, it's pretty easy to wrap your head around.

>You are tempting me, I like having absolute control over what I can do
You need to consider the time and effort required before approaching a project like this, from what you're describing it'll mostly be used to blog and host images, as it's for a group of people (your choir), having a CMS so anyone can sort it will help you massively, especially years down the line when you need to hand it off to someone else.

Wordpress is open source and based on PHP.
As for theming, you can make it look however you want as you have direct access to the CSS, but again there are plenty of great themes which require minimal effort.

>It would be grand if one of the plugins could scale the pics automatically.
Another case for wordpress, you can use lazyload and image compression plugins to show smaller images on mobile, automatically compress and store images and such, very useful.

>lobster two?

Oh, yep, that is spot on. Our choir leader actully complained about the font vomit, there is what, 8 or 9 different fonts on one page. Convinced her to go talk to out designer about it.

My current settup is using a google cloud machine, linked to my github account where I have a script that automatically pushes any changes that I commit from intelij on my computer.

Thing is, I am pretty much locked into using google cloud machine. You think I can host wordpress there? See, the choir is basically a volunteer thing, we pay no membership fees. We have a sponsor who paid for our domain and hosting, and he had a contact with a professor of computer science at the local university who set it up that he wanted to use. I can get a little bit of help from that proffesor, he writes awesome code, but only so much and he have a hard time understanding the needs of the choir when he gives advice

Already spent a lot of time and effort on getting the site to a fuctional state.But its as you say, its my concern for the future that gives me problem; I don't have enough experience to jugde what aproach is the most future proof so I struggle finding the best solution.

I will look into wordpress tough. Do I have to go trough their website or what is the best way to start using it when you already have a host and a domain? In fact, can I use the host I already have?

But thanks a lot for the help, everyone

>Already spent a lot of time and effort on getting the site to a fuctional state.
You should have asked us sooner then.

codex.wordpress.org/Installing_WordPress
Everything you'll need to know is there. Generally speaking popularity = good documentation so it should be easy to follow.

Best way to start is to wipe everything, FTP drag the wordpress folder then run install.php, again you'll need a server that supports PHP and databases. Scroll down to the "Famous 5 minute install" section on that wp article.

>You should have asked us sooner then.

Oh, aye. But I did learn a lot during it all tough.

>Best way to start is to wipe everything, FTP drag the wordpress folder then run install.php, again you'll need a server that supports PHP and databases. Scroll down to the "Famous 5 minute install" section on that wp article.

Well, now you made my piss freeze. At least I got a site running, I could easily mess this up.

By the way, I plan on setting a forum too, does wordpress support it?

>Well, now you made my piss freeze. At least I got a site running, I could easily mess this up.
Make a backup then, local or onsite. Do you have FTP access?

>By the way, I plan on setting a forum too, does wordpress support it?
premium.wpmudev.org/blog/forum-wordpress/
Yup.

Great! Technically, I have it, but practically the proffesor set my github account up with webhook that automatically updates the google server. I guess its time I figure out how to actually access the server...

More spesifically, I believe I have to figure out how the google cloud console works

Well I can't help you with that, we use Azure, git and direct FTP where I work.
I wish you luck on your path of beginner CMS knowledge.

Thanks a bunch for the help! I owe you guys a beer. If you ever find yourself in Denmark contact me and I will buy you one

No problem, I just had a look at the contact page and I was right to suggest destroying it all and starting again, jesus fuck they're just DSLR images with a 50% border radius.

Go to inspect element in Chrome then network, those profile avatar images are taking 26 seconds to load fully. twenty. six. seconds.
Chrome/Firefox dev tools are your friend.

Haha, yeah, I am still finding little gems like that. You should have seen the page when I got it, especially the CSS was just one giant page and then a lot of templates. Took a while to short it all out, I manged to boil it all down to bootstrap and then seperated the css for indivudal pages into seperate pages.

And yeah, those profile pics, man, I tried explaining to her they needed to be reduced and if she wanted them circular, it would be easier with perfectly square images as bootstrap has build in methods for that. She got the square part but not reducing the file size.

She know enough to upload images and some CSS to muck about in the code, but man, I am meeting with her in the morning to try and explain bandwith limit and such. And introduce wordpress.

Got it up and running by the way

35.189.88.125/

Now to get it to do what I want

I can't even imagine the state you got it in.
For staters I'd suggest a third party plugin for security, we run a few projects through wordpress and we get a shit ton of bots trying to log in, change all of the default management passwords and install something like Sucuri, and pick up something for analytics and SEO if you aren't doing so already.

Use mozjpeg and optipng to losslessly compress the images to save bandwidth and make loading times faster.

Oh yes, you should have seen it. So many templates! Bootstrap, Lightbox, Solidity, I could go on. And most where only used a couple of times here and there. And there where so many images folders! Every single template had one that they used for a little while and then got lazy and just added the pics wherever.

Took so long to condense all the various folders into a proper hierarchy in one place. She had 36 different background images! She made little changes, uploaded the new image but never bothered removing the old one.

And the divs! All where just named box1, box2 and so on. And all in one big CSS beside the various template css. I thank god that intelij had a "find definition" and "find implemetation" function

Also, good suggestions, I will take it into consideration.

>display images on a website
Set up a booru lol

Sounds like a dumpster fire.

>And all in one big CSS beside the various template css.
All your CSS in one place can be a good thing provided you use a compiler/preprocessor, we used a component-based SCSS approach with minification so we're only ever editing small scss files (footer.scss, header.scss, gallery.scss etc etc) then get npm to compile and minify.

If such things interest you take a look at sass-lang.com/guide, I barely write any vanilla css any more.