Tessisamess

Layouts, Codes, Tutorials, & Resources

Hey there, I'm Tess!

Welcome to my blog; I make lots of different layouts, codes, tutorials, and other resources for Insanejournal and Dreamwidth RPers! There's a lot to choose from and brand new content goes up every week!

Take a look around, and don't hesitate to ask for help if you need it!

Can't get enough resources? Why not subscribe to my Patreon for exclusive monthly content, or support the creation of more content by leaving a tip on Ko-Fi! ♡

Need an invite?

If you're unable to comment on my journal to ask for help now that anon has been turned off due to serious spam issues, don't worry! Just shoot me an email and I'll send you an invite code for Insanejournal. I've got plenty to spare!
×

Please Note:

I do not offer assistance with any sites other than IJ and DW unless it is for general HTML and CSS (ie. custom hosted pages and similar.) I cannot convert a code to a new site's rules because there are a lot of niche RP sites, and I have no way of knowing each one's limitations and caveats. Sorry about that!

Layout By

Powered by InsaneJournal

Hey there, I'm Tess!

Welcome to my blog; I make lots of different layouts, codes, tutorials, and other resources for Insanejournal and Dreamwidth RPers! There's a lot to choose from and brand new content goes up every week!

Take a look around, and don't hesitate to ask for help if you need it!

Can't get enough resources? Why not subscribe to my Patreon for exclusive monthly content, or support the creation of more content by leaving a tip on Ko-Fi! ♡

Need an invite?

If you're unable to comment on my journal to ask for help now that anon has been turned off due to serious spam issues, don't worry! Just shoot me an email and I'll send you an invite code for Insanejournal. I've got plenty to spare!
×

December 2019

S M T W T F S
1234567
891011121314
15161718192021
22232425262728
293031    

Please Note:

I do not offer assistance with any sites other than IJ and DW unless it is for general HTML and CSS (ie. custom hosted pages and similar.) I cannot convert a code to a new site's rules because there are a lot of niche RP sites, and I have no way of knowing each one's limitations and caveats. Sorry about that!

Layout By

Powered by InsaneJournal
Previous | Next

Layout: Snapshots


image preview | [info]tess070


Information

Hey guys! I've been dying to do a layout with a CSS grid sidebar collage, so it's finally here! Left or right sidebar works just fine, and you have FIVE (5) grid options (hell yeah!!!), which you can read more about below. Enjoy! ♥

Layout Coding



Installation Guide

♡ Go to Basics and choose S2 for your style system, fill in your title and subtitle, then save.
♡ Fill in your Links List if desired, then save.
♡ Go to Look and Feel, choose Complete Style, then save.
♡ Go to Custom Options and choose the following options:
Layout Type:
Two Column (Sidebar on Left)
Two Column (Sidebar on Right)
Disable customized comment pages for your journal: Yes
Navigation link names: Recent/Archive/Friends/Profile
Fill in sticky note if desired.
♡ Fill in first custom sidebar module if desired with your IMAGE GRID.
♡ Fill in second custom sidebar module if desired with your BLURB.
Person to credit if you have an individually created layout: 🍂
URL to link the credit to: http://tessisamess.insanejournal.com/
Custom stylesheet: Input the CSS provided and save!

Grid Options

Use any of the grids below by adding the HTML provided to your FIRST custom text. The :root directory in the layout CSS is where you'll add your images for your grid, and there are heights and widths above your image options if you'd like to change the dimensions of your grid and layout!

Additionally, if you'd like some of the grid blocks to be solid colors rather than images, you can change that in the CSS by going to the grid item's class (ex. .one) and changing the background to your chosen color code!



<div class="grid1"><div class="one"></div><div class="two"></div><div class="three"></div><div class="four"></div></div>




<div class="grid2"><div class="one"></div><div class="two"></div><div class="three"></div><div class="four"></div></div>




<div class="grid3"><div class="one"></div><div class="two"></div><div class="three"></div></div>




<div class="grid4"><div class="one"></div><div class="two"></div><div class="three"></div></div>




<div class="grid5"><div class="one"></div><div class="two"></div><div class="three"></div><div class="four"></div></div>


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!

Comments

May. 6th, 2019 09:48 pm (UTC)
dfsljsldkj. OH MY GOODNESS. THIS IS JUST WHAT I NEEDED. I LOVE it! Amazing work as always! Thank you!
May. 22nd, 2019 11:13 pm (UTC)
AW YAY!! Thank you! ♥
May. 6th, 2019 11:36 pm (UTC)
This is gorgeous af. I love it!!!!
May. 22nd, 2019 11:14 pm (UTC)
Heeeee ty tysm!! ♥
May. 7th, 2019 01:28 am (UTC)
HI I am playing with the layout here and I tried adding a fixed navigation bar, but I can't figure out how to make the entries scroll under the bar instead of over! Can you help? :) This is freaking amazing!!!
May. 14th, 2019 09:17 pm (UTC)
Oh, that's cute!!! To fix this you'll want to add z-index:1; to your .entry CSS. Since the entries are set to position:relative; to accommodate their own styling it's causing them to conflict with the positioning of the new topbar. Hope that helps! ♥
Jun. 9th, 2019 06:26 pm (UTC)
So I don't know if I otherwise screwed of the CSS lol but I tried that and it didn't change anything. Any thought?
May. 7th, 2019 02:15 am (UTC)
I'LL EAT YOU UP I LOVE YOU SO
May. 22nd, 2019 11:15 pm (UTC)
PSHHHHHHHHHHHH TY FOR FINALLY GETTING ME TO READ UP ON GRIDS LOL all your cool grid stuff got me like !!!!
May. 7th, 2019 02:21 am (UTC)
This is so pretty!
May. 22nd, 2019 11:15 pm (UTC)
Thank you! ♥
May. 7th, 2019 03:08 am (UTC)
Aaaaaaaahhhhhhh! I love this!
May. 22nd, 2019 11:15 pm (UTC)
SAMEEE THANK YOU!!
May. 7th, 2019 10:58 pm (UTC)
I am absolutely in love with this...
May. 22nd, 2019 11:16 pm (UTC)
AW YAY! It's def one of my favorite narrow layouts that I've done!
May. 8th, 2019 01:24 am (UTC)
omg i love this
May. 22nd, 2019 11:16 pm (UTC)
YASSS ♥
May. 9th, 2019 01:07 am (UTC)
Dang it. I just changed my CDJ layout and now you're gonna make me change it again. :P
May. 22nd, 2019 11:16 pm (UTC)
LOL MY BAD, the cool blue tones you used look SUPER NICE!!
May. 9th, 2019 04:17 pm (UTC)
THIS IS SO CUTE AND CLEAN.

Combine this with a gradient background and it'll be so chic... I have such a powerful urge to spruce up my Dreamwidth journal with this because what a look! o v o
May. 22nd, 2019 11:17 pm (UTC)
Ohhhh, that WOULD be really nice! If you do, please show me!
May. 12th, 2019 10:39 pm (UTC)
I love this so much, I just used it for a new journal over here.
May. 14th, 2019 09:18 pm (UTC)
AHHHHHH THAT'S CUTE!!! Also in another comment you left I MEANT TO TELL YOU: SCREAM YOU'RE USING THE ONLY FACE I CAN EVER SEE FOR THAT SPECIFIC PETER PARKER & I LOVE IT A LOT LMAO.
May. 14th, 2019 09:23 pm (UTC)
It's obnoxious how perfect he is for Peter. I love him so muuuuuch! T__T
May. 21st, 2019 08:54 am (UTC)
Okay so I just wanted to know if I'm missing something about the grids! I can't get the gifs to stretch to fit (or crop, they just sort of insert themselves and never fill). Am I missing something? Am I needed to crop the gifs manually? Halp. I feel stupid rofl. (See : [info]outsourcedhelp for an example.)
May. 21st, 2019 09:04 am (UTC)
Never mind I figured it out because I'm not stupid, just lacking in coffee.
May. 22nd, 2019 11:17 pm (UTC)
LOL OH NO, glad you got it worked out!
Jun. 4th, 2019 12:27 am (UTC)
holy crow im in love.
Jun. 5th, 2019 09:30 pm (UTC)
Aw, ty ty!! This one was super fun and I bet it's gonna look SUPER cute with different aesthetics! :D
Jun. 6th, 2019 11:01 pm (UTC)
I love this so much!

I'm having a little trouble though. I'm not sure what I'm doing wrong but the image grid doesn't show up when I try to put the coding in the sidebar module. I know I'm probably missing something simple.
Jun. 6th, 2019 11:15 pm (UTC)
I can't help without seeing the journal, sorry!
Jun. 6th, 2019 11:26 pm (UTC)
I am so sorry! It's been a day!

http://laekisis.insanejournal.com/
Jun. 6th, 2019 11:34 pm (UTC)
No problem! I don't see a problem on my end when I add the custom HTML into the first custom text content on your journal. Is it possible you used the second custom text by accident when you tried putting it in before?

Jun. 6th, 2019 11:42 pm (UTC)
Thank you! I figured I missed something completely simple!
Jun. 6th, 2019 11:47 pm (UTC)
So I adore this layout and I'm using it over on dreamwidth here with some modifications. Also shoutout to the other person who mentioned trying a gradient background with it!
Jun. 7th, 2019 05:06 am (UTC)
Ohhh man that looks REALLY good like that! I'm loving the dark scheme with this layout!
Jun. 28th, 2019 10:28 pm (UTC)
Hi!

I mostly figured out the gradient on this journal, but I have a bar across the bottom, and I'm not sure how to fix that.

Any guidance would be most appreciated.
Jun. 28th, 2019 10:41 pm (UTC)
Oh, awesome!! Sometimes when your content doesn't meet or exceed the height of your browser window the gradient will stop where the content ends, so just add min-height:100vh; to body and you'll be all set!
Jun. 28th, 2019 10:43 pm (UTC)
Thank you! That did the trick (google failed me).