Tessisamess

Previous | Next

Layout: Cut & Run


image preview | [info]tess051


Information

Hey guys! It's the last resource post of the month, oh man! It's weird having it all posted so close together, right? I'm gonna get to some comment answering today, but just a heads up: The rest of the month is gonna be super busy with moving-related stuff on my end, so I probably will be really spotty on comment replies until April 1st.

An unrelated "announcement" is that I am now using a personal journal over at [info]shudder, and if you'd like to keep up with me you can feel free to add me over there for chit chat and life updates!

Cut & Run is a Generator layout with a lot of character-specific potential! It features an expanding navigation for extra links, icon links for your navigation pages, and a monochromatic design. Enjoy! ♥

Layout Coding



Installation Guide

♡ Make sure you have a website in your profile page.
♡ Go to Basics and choose S1 for your style system, then save.
♡ Go to Look and Feel, choose Generator for all page views, then save.
♡ Go to Custom Options and paste the layout code, then save. Make sure you've done a replace all on the following with your information:
PAGETITLE for your journal title
<b>NAME</b> HERE for your header title
SUBTITLE for your header subtitle
SIDEIMG for your sidebar picture
DROPURL and DROPLINK for your dropdown nav (copy/paste as needed for more)
JOURNALNAME to complete your URL and activate links

Editing Guide

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

FONTS
Roboto Condensed - Page text
Yesteryear - Header text

IMAGES
https://i.imgur.com/sFHOgEt.png - Header bar icon; tab, user, and lock icons
http://i.imgur.com/QvoqWhi.png - Home icon
http://i.imgur.com/sYvEel5.png - Profile icon
http://i.imgur.com/Vv82jA8.png - Friends icon
http://i.imgur.com/rdoLWZd.png - Credit icon

COLORS
#fff Header background, sidebar background, and comment link text
#97afa0 Page background
#395543 Link color, headings color, header bold text color, left-of-page background, entry title, date color, and comment link background
#222 Username/community link on posts
#000 Page text, link hover color, sidebar link color, comments link hover color
0,0,0 Horizontal rule, all borders, entry background, dropdown link background hover, comments hover background, entry userpic background, bottom page navigation text (semi-transparent rgba value)


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

Mar. 12th, 2018 09:53 pm (UTC)
AHHH! Gorgeous!!! I love this!
Mar. 12th, 2018 11:13 pm (UTC)
Eeee, ty ty! ♥
Mar. 13th, 2018 03:14 am (UTC)
Oh I love this!
Mar. 17th, 2018 06:14 am (UTC)
Aw, tysm!! ♥
Mar. 16th, 2018 11:34 pm (UTC)
LOKI. <3 I love this so much! I'm snagging the coding if I change out my journal for him, someday soon.

Thank you for making it!
Mar. 17th, 2018 06:15 am (UTC)
MY TRASH BABY JUST THROW ME IN THE GARBAGE WITH HIM ♥

I'd love to see this on an actual Loki journal if you ever get around to it!!
Mar. 18th, 2018 02:56 am (UTC)
Oh wow, I am right there with you where this trash baby is concerned. IW is making me nervous AF for him.

Right now I have another of your layouts on [info]the_trickster but I will let you know when I finally do change it out! Because, gosh, thank you for making such fab layouts. This one in particular is ♥
Apr. 29th, 2018 08:34 pm (UTC)
I didn't use it for Loki (sorry! I loved the other code too much!) but I did tweak it to use for Vision: [info]vision_of_hope

As for the film? Right in the feels all OVER the place. Totally shook.
Mar. 19th, 2018 10:32 pm (UTC)
Hi!

Could you explain me how to use these? *puppy eyes*

I tried this, but it didn't work...






NAVIGATION
Just Dive
href="http://natasharoman0ff.insanejournal.com/">Just Dive</a>





And it didn't work... but I don't know how to add the other two properly.
Mar. 19th, 2018 10:35 pm (UTC)
Ugh- it seems to work here, but not in the actual IJ. I don't know what I'm doing wrong *cries*

http://bruce-b.insanejournal.com/
Mar. 19th, 2018 10:42 pm (UTC)
Looks like it's working fine; you just don't have the link anywhere but on the friends page. For a custom sidebar to work in S1 Generator, it's actually repeated four times in the coding, so anything you do to one will need to be done to all four, one for each pageview (recent, friends, calendar, and day.) If you scroll through the layout you should see three duplicates of the sidebar. Make sure your links go into all three and you're good!
Mar. 19th, 2018 10:49 pm (UTC)
Oh! You ARE a genius! It works! ♥ Thank you so much! You Goddess of awesome layouts.

I appreciate the help a LOT. :)
Mar. 20th, 2018 12:49 am (UTC)
No problem! ♥
Mar. 22nd, 2018 03:46 pm (UTC)
Love this, modified it for this journal.
Apr. 10th, 2018 04:34 pm (UTC)
Thank you! That looks awesome for Tony!
May. 3rd, 2018 07:01 pm (UTC)
oh! I had a question on the lock and user info icons. How do I get them to be different? Right now they are the same and I really would like a small lock or something different for the friends only icon.
May. 3rd, 2018 07:50 pm (UTC)
Sure! At the bottom of the CSS portion of your layout you'll see a section for TINYICONS. Replace that bit with this and you'll be able to change each image individually!

/*--- TINYICONS ---*/

img[src*="img/userinfo.gif"], img[src*="img/community.gif"], img[src*="img/icon_protected.gif"], img[src*="img/icon_private.gif"], img[src*="img/icon_groups.gif"]{background-size:16px!important;width:0!important;height:0!important;padding:16px 0 0 18px!important;margin-bottom:3px;}

/* user icon img */
img[src*="img/userinfo.gif"]{background:transparent url(https://i.imgur.com/YbX97SO.png)no-repeat!important;}

/* comm icon img */
img[src*="img/community.gif"]{background:transparent url(https://i.imgur.com/YbX97SO.png)no-repeat!important;}

/* custom lock icon img */
img[src*="img/icon_protected.gif"]{background:transparent url(https://i.imgur.com/YbX97SO.png)no-repeat!important;}

/* private icon img */
img[src*="img/icon_private.gif"]{background:transparent url(https://i.imgur.com/YbX97SO.png)no-repeat!important;}

/* friends lock icon img */
img[src*="img/icon_groups.gif"]{background:transparent url(https://i.imgur.com/YbX97SO.png)no-repeat!important;}
May. 3rd, 2018 08:02 pm (UTC)
You are truly wonderful. Thank you so very much!
May. 27th, 2018 10:33 pm (UTC)
i am in love - i just want to change the favicon (loki's helmet doesn't work for this pb character)