Previous | Next

Responsive Info Gallery

The Woods
Never venture after dark
Pellentesque eget venenatis dolor, ut pulvinar orci. Aenean non neque ut justo bibendum congue. Nunc quis enim suscipit, pharetra justo sit amet, vulputate ligula. Mauris fermentum, felis eget lobortis venenatis, ex tortor bibendum massa, vel viverra erat orci posuere leo. Sed dignissim varius purus at volutpat. Morbi molestie dapibus ante sit amet placerat. Aenean pulvinar posuere consectetur. Sed vel mauris placerat, consectetur lacus quis, consequat nibh. READ MORE
Wine, Spirits & More
Vivamus commodo et nisi in placerat. Cras ut ex eget lorem mollis efficitur vel egestas leo. Aenean dictum auctor bibendum. Vestibulum id leo eleifend lorem interdum vehicula. Vivamus ullamcorper leo vitae arcu interdum, sed finibus velit eleifend. Maecenas dictum nibh ac aliquet tempor. Nulla velit elit, sollicitudin blandit neque a, mollis vulputate sapien. READ MORE
Hallow Prep
The Writing's on the Wall
Integer vel sem quam. Phasellus leo urna, bibendum quis molestie at, imperdiet eget turpis. Aliquam rhoncus eget elit ut condimentum. Praesent convallis, lorem ut porttitor tincidunt, sem mi rhoncus libero, eu ornare risus urna et purus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Proin ut dui sapien. Nulla tempus bibendum turpis, nec accumsan nisi. Curabitur molestie efficitur lorem hendrerit egestas. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. READ MORE
Bleak Cemetery
The End of the Line
Sed eleifend sed sapien nec blandit. Vivamus dui urna, sagittis vitae pharetra quis, sodales faucibus tellus. Proin aliquam efficitur tortor in luctus. Donec non ultricies mauris, sit amet consectetur lectus. Phasellus aliquet enim turpis, vitae dapibus lorem molestie ut. Cras erat neque, vehicula et mattis eget, laoreet sit amet leo. Sed placerat feugiat magna. Quisque volutpat risus vel placerat eleifend. Donec aliquam tortor urna, quis cursus justo vulputate ac. Phasellus ut elit sem. READ MORE
216 Grimm Rd
Tarot, Tea Leaves, & Palmistry
Curabitur id lobortis risus, sit amet efficitur risus. Sed egestas efficitur enim. Fusce elementum nisi ac magna eleifend consectetur. Morbi eros nibh, dapibus id hendrerit et, aliquet id enim. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse et gravida odio. Ut id dignissim ex, nec imperdiet massa. Donec consequat ligula ac dictum tempor. Aenean ornare ultrices diam sed fringilla. Proin finibus imperdiet ligula, ut facilisis justo volutpat id. READ MORE
Bathory Hotel
Ask about night prices
Etiam vulputate arcu ipsum, vel porttitor ex luctus eu. Curabitur vulputate mauris sed pellentesque finibus. Maecenas nec sapien sodales, mollis tellus sed, commodo enim. Proin placerat, neque ac finibus dapibus, mauris nisl rutrum orci, vitae efficitur tellus arcu non enim. Pellentesque faucibus tempus sem eget faucibus. READ MORE


Hey guys! Today we've got a fun, modern responsive gallery code that can be used for... pretty much anything. Character rosters, cast lists, locations, species—just fill it in and go go go! This would be great for games that want all of their image-based info pages to feel cohesive (bonus points: there isn't a whole lot of fiddling that needs to be done, so if you have a lot of pages to fill out this should be a time saver.)

This code will narrow and/or collapse itself into less columns for smaller screens and you won't have to do a thing, hooray! Enjoy! ♥

The Coding

Installation Guide

Paste into an entry and fill in the following!

Title - Block title
Subtitle - Block byline
IMGHERE - Block image; any size is fine
BLURBHERE - Block info
LINKURL - 'Read More' link (you can delete this link if unneeded; it won't break anything)

Editing Guide

Paste the coding into Notepad or similar and bring up Replace All (usually Ctrl+H) to replace values quickly and easily!

century gothic - Overall font; please note: this is technically not a websafe font, which is why I never use it, but I love it and missed it so much that I've made a few codes using it. If your font looks different than my image preview then your computer does not have this font. Less than 88% of OSes have Century Gothic installed, so if this bothers you you'll want to change this to Helvetica (or whatever websafe font you like!)

#fff 'Read More' link background
#fafafa Each block background
#000 Font color
0,0,0 Each block border; 'Read More' link border

Terms of Use

♡ Do not remove credit.
♡ Do not redistribute my codes in part or in whole (posting a copy for players to use in your game is fine with a link to original post.)
♡ If you break something during editing, please feel free to drop me a comment and I'll help as best I can!
♡ I love seeing edits! This isn't a rule, but if you have a cool edit of one of my codes I'd love to see it!


Apr. 29th, 2018 07:49 am (UTC)
Just when I think I'm close to finishing with the coding. You go and do more amazing stuff. ♥

I LOVE these, I will work on them tomorrow ASAP! for salem_city_mod

Can I save and use some of the images? Uploading them to another host? Not to eat your bandwidth? They are amazing O_o
Apr. 29th, 2018 03:23 pm (UTC)
AW, tysm! ♥

Please feel free! It's okay if you want to hotlink; I've got them up on Imgur so you're good! I dug most/all of the up by googling creepy thinghere tumblr gif if you want to find more!
Apr. 29th, 2018 09:27 pm (UTC)
Great advice to Google things. Thank you!

I will start working on these pretties ASAP! But the IJ, I just HAD to install it before sleep LOL. It was too pretty and perfect to go to sleep with out doing it :D
Apr. 29th, 2018 09:52 pm (UTC)
Oh my god I'm so awkward lmfao, now I'm like I SWEAR I DIDN'T MEAN THAT IN AN INSULTING WAY LOL. But yeah, a lot of times when I want gifs for demos I'll specifically add "tumblr" into the search terms and it usually yields more of the type of content/quality I'm looking for.

AWWW TY TY! BEEN THERE LOL. I'll be super tired and also be like okay but I should make this thing first...
Apr. 29th, 2018 10:03 pm (UTC)
LOLOLOL I didn't take it as an insult! I swear!

Sometimes I try to google for things, specific things and I can't find what I want! So I will try it your way! Adding the Tumblr gif part on the search :D

I have this photographer in Facebook who takes AMAZING pics of cemeteries? He's a professional. But they don't all work for games or IJ. Still, they are beautiful in their own decadent way. If you want I can give you the guy's name? And you see if it could be useful? But I think you might need to talk to him- because his images are all Copyrighted? I think...

But yeah, no- I wasn't been sarcastic at all! I was been truthfully thankful xD

LOL totally! I was like that yesterday. Then I couldn't sleep! The irony! Ahhhh xD
Apr. 30th, 2018 12:13 pm (UTC)

This is really nice and the use of Century Gothic is icing on the cake for me. ❤️
Apr. 30th, 2018 04:20 pm (UTC)
Eeee, ty ty! I always want to use Century Gothic but I always feel bad since it's not really websafe so I don't. But... god I really like that font lmao. I'm probably just going to start using it again here and there (I already have a set of bios to post that use it!) and just leave a note about it when I do.
May. 9th, 2018 05:30 pm (UTC)
HI! So I am playing with this code here and there is a gap in the top middle "card" that I can't seem to figure out how to get rid of. I don't know if I messed something up when I tried to shrink the widths, but if you could take a peek and see if you can point me to a fix, I would appreciate it!
May. 9th, 2018 05:30 pm (UTC)
PS this is gorgeous and I also love Century Gothic! Thanks for sharing!
May. 9th, 2018 05:32 pm (UTC)
Oh PPS the gap seems to be a thing in Firefox but it displays correctly in Chrome... I should have checked that before hitting you with a million comments lol!