Showing posts with label CSS. Show all posts
Showing posts with label CSS. Show all posts

Thursday, March 29, 2018

How I made my Photo Gallery page

Hi All,

One of the things that you may have noticed is that I've been working on a photo gallery to display all the figures I've painted over the last year. I knew there were many ways to do it and I tried a few that were hit and miss.


First I tried this one from Georgia Lou Studios seemed interesting, but all the code had been removed and the easier method didn't seem to work anymore either.

Then I tried this one from Xommise.com. It had a few problems. The {box-sizing} tag appeared to effect the boxes around the page tabs. If you follow the instructions and put the CSS inside your <skin> for your blog, it will effect the entire thing. You can put the CSS just into the post or page and it will just effect that, not the whole thing globally.

It also had a problem with portrait images breaking the whole format of the gallery. Same if you have a long caption to display. All of a sudden things no longer stack correctly and it looks like garbage.

After that I tried this one using tables:


It does work and her code to do it is here. There is one caveat though. For whatever reason, it doesn't seem to work to just plug in the image link <img src=" "> directly yourself. I may have made the mistake of switching between Compose Mode and HTML Mode, but I don't think so. For me this method of using the Insert Image from Blog would have meant scrolling through the hundreds of photos I've posted in 7 years to find what I want. Not really an optimal use of my time. So because of this I didn't use it.

What I did learn from this, in an almost throw away remark, was that you should never switch back to Compose Mode after you have been coding your gallery in HTML mode. I learned the hard way that it completely breaks what you were doing and copying and pasting the code into a new HTML window will not save it. I had to do it a second time from scratch.

What I ended up using was a Dynamic Drive gallery from here.


I'll try to show you step by step what I did in pictures and then, if I have time, follow it up with a short video.