How do you go about these CSS effects? And also how do you add a photo gallery to

Hello there everyone! Everytime I get on a website I tend to study the design. Recently I ended up on this website and I want to get an idea of how you create these effects.

I’m not sure if those are just border effects but it looks pretty good to have the main content in a box with a border like that that gives it a bit of a 3d look. Also the image has somewhat of the same effect! I would like to download the page source and look at how its done myself but I’m just a beginner and I don’t understand anything apart from the basic stuff.

  1. How do you add a photo gallery? I have seen some basic websites that have galleries and also some large e commerce websites that have it. I was wondering as to how it was done. I tried uploading photos to a page and then arranged them properly. Then I created a hyper link for those images that would take the viewer to a page which had the full-size image but there’s got to be a better way! Any ideas?

(1) The effect that you are pointing to is done with the {box-shadow} property.

(2) Without knowing your design intent for a photo gallery, I can’t offer any suggestions. I roll my own, but you may prefer to use a pre-existing design or template with special features like a slider or fader, etc. Google should lead you to any number of them.

Hope this is helpful.

Yes, thank you for your answer. What is a (good) pre existing design or template? I don’t want to download any viruses in search of them so I figured I’d ask. Do the big websites like ebay get work done with help of those? When you say you roll on your own, do you mean you design your own galleries? How long did it take you to learn to do that and how can I go about it?

Please describe the environment you are using… Wordpress, hand coding, other

Please describe what you expect your photo gallery to look like and how you expect it to work? How do you plan to update it? Will it be updated dynamically or manually, etc.

The “big boys” all have customized sites. Their “photo galleries” are customized. You need to be able to describe exactly what you want.

I have never found a virus in any web software that I’ve downloaded (knock on wood). The odds are in your favor that you will not either. You would most likely be downloading a JavaScript from a reliable source. If it looks shady, go elsewhere.

Sorry, still no “this one is best” answer. I don’t know all about all of the different sliders and galleries available.

How long it takes to learn to write a photo gallery is a very individual thing. No quick, easy answer to that question, either.

The original lightbox gallery is pretty easy to implement but there are [URL=“http://coding.smashingmagazine.com/2007/05/18/30-best-solutions-for-image-galleries-slideshows-lightboxes/”]many others to choose from depending on functionality.

I’ve used this one recently for responsive designs and it works quite well.

I don’t really have any specific purposes. I’ve only been building test websites and now I’m building one on a charity that my friend runs. I’ve got a photo gallery section and it will have a few pictures (around 20 images) and I may enter more photos there once in a while. I think lightbox will do. It appears to be good!