Previous | Next

Layout: In Stitches

image prev | [info]tess028

001: Informative Info
Another 3-column layout! Sorry, sorry, I'm just wicked into these right now. Normal-entry version available below. Like my other column layouts, the flist page on these still functions like a regular journal. The ribbon in the sidebar is pure CSS, so don't worry about image editing! Color replacing will change all colors in this layout. Enjoy! <3
002: The Layout


003: Directions
→Go to Basics, choose S2, fill in your title and subtitle if desired, then save.
→Go to Look and Feel, choose Complete Style for the layout, then save.
→Go to Custom Options, and choose the following:
→Layout Type: Two column (Sidebar on left)
→Disable customized comment pages for your journal: Yes

→Link text to leave a comment: Comment
→Text used to link to the 'Recent Entries' view: Recent
→Text used to link to the 'Archive' view: Archive
→Text used to link to the 'Friends' view: Friends
→Text used to link to the 'User Information' view: Profile

→Body of custom sidebar module: <img src="YOURIMAGE"> <div class="ribbon"><div class="ribbon-stitches-top"></div><strong class="ribbon-content"><h1>JOURNALTITLE</h1></strong><div class="links"><a href="URL">LINK 1</a> <a href="URL">LINK 2</a> <a href="URL">LINK 3</a></div><div class="ribbon-stitches-bottom"></div></div>
→Person to credit if you have an individually created layout: Layout by Tessisamess
→URL to link the credit to: http://tessisamess.insanejournal.com/

→Custom stylesheet: Input the code above and save
004: CTRL+F This Shit
#713b3f to change ribbon text shadow; sidebar and entry link text shadow.
#777 to change bulk text color.
#9f5258 to change body link color, scrollbar, minor text color, sidebar and entry link border color, sidebar and entry link hover background, ribbon shadow, and ribbon stitches.
#bc6067 to change sidebar image shadow, userpic shadow, entry shadow, and ribbon bottom gradient.
#d26c74 to change scrollbar, sidebar image border, userpic border, entry border, entry subject link, and ribbon top gradient.
#f19aa0 to change link hover color.
#f27b84 to change background color and blockquote border.
#aaa to change entry date color.
#bbb to change all non-ribbon stitches.
#e5e5e5 to change entry bottom gradient.
#fff to change entry top gradient, top nav links, sidebar title and links, entry link color.

QUICKSAND to change the accent font.
HELVETICA,SANS-SERIF to change the bulk font.
http://i.imgur.com/UxSUdMt.png to change/remove stripes from the page background.
005: Rules and Shit
→Please put my credit in its designated spot.
→Do not remove my credit from the CSS.
→Do not redistribute in part or in whole.
→If you break something during editing don't be scared to ask me to see what happened. Yep. That's a rule.
→If you're a maker like I am and you do something cool with this I'd really like to see it, but it's not necessary.


Nov. 2nd, 2015 11:27 pm (UTC)
I recolored and used this gorgeous layout on this journal. One question, because I'm brain-fried today and it's probably right in front of my face and I still can't find it...where should I be looking to fix the top navigation bar? It's probably too wide because on my screen, all that's visible in my mod of this is new, old, and friends. I have to horizontally scroll to get to me (profile). This is like probably the dumbest easiest thing to fix and I'm just drawing a total blank on which piece to edit, help?
Nov. 2nd, 2015 11:33 pm (UTC)
Womp, never mind, I finally got it together and found it. Geez, self.

For anyone else that might run into this, though: it's under HEADER and it's the #nav-above width. I tweaked mine from the original 1520 to 1350 and it fits beautifully on my monitor, for whatever that's worth.

Tess, as always your layouts are incredible and your code is super easy to navigate and edit, thank you so much for everything you do!