010. Lost in Translation
OK, so this is supposed to be penderies' layout request, who wanted a "nature-y minimalistic theme". (Hope you like it!) "Lost in Translation" is inspired by one of sireesanwar's latest layouts, Oasis. Yep, I really really liked it.
With this layout, I've experimented new CSS techniques: the navigation is actually hidden under the LJ control strip and will only appear when scrolling the page down. The link list trick was the most difficult one to pull off. You don't have to enable it if you don't want to though.
PS: the second version of this layout is actually meant for you, wildling.
010. Layout - Lost in Translation
↳ Live [ 1 / 2 ] ▪ Code [ 1 / 2 ]
📌 Answered
How to Enable Mood Themes
More Information on the Link List Trick
-BASIC INFO
-S2 Flexible Squares.
-Basic, plus and paid.
-1024x600+.
-Best view with Firefox.
-FEATURES
-Custom comment pages, navigation and sidebar.
-DISABLED
-Title, entry date, mood themes and everything in the sidebar except for the blurb and the link list.
-HOW TO INSTALL
「 Select Journal Style 」
Apply any S2 Flexible Squares layout (except Circular and Circular Brown).
Scroll down to Choose a Page Setup: set the ads to horizontal or between entries, and select 2 Column (sidebar on left).
「 Text 」
Under Navigation, replace the Recent Entries text with Recent only.
「 Sidebar 」
Choose the following ordering: Default Userpic, Blurb, Link List.
「 Custom CSS 」
Set all drop-down boxes to NO and paste the code. Save changes.
-OPTIONAL
「 Replace the Sidebar Picture 」
In the Global section, find this:
body {
background-image: url(http://i.imgur.com/STiRpGW.jpg);
}
Replace the current URL with your picture URL. The recommended picture size is 1280x1920px.
「 Replace the Link List 」
If you want the links in the sidebar's link list to show up as in the preview, replace each of your links' text with I., II., III., etc.
Paste this code at the end of the CSS stylesheet for each link you have:
#sidebar_linklist .sbaritem:nth-child(?) a:hover:after {
content: 'Text';
}
Replace ? with the number of your link (1, 2, 3, etc.), and instead of Text, enter the text as you want it to appear when hovering the link.
-APPENDIX
「 Credit & Comment 」
Credit is nice; please link back to revolumna.
Don't redistribute or claim as your own.
Comments aren't required, but are appreciated!
「 Resources 」
Preview icons from recycle.
With this layout, I've experimented new CSS techniques: the navigation is actually hidden under the LJ control strip and will only appear when scrolling the page down. The link list trick was the most difficult one to pull off. You don't have to enable it if you don't want to though.
PS: the second version of this layout is actually meant for you, wildling.
010. Layout - Lost in Translation
↳ Live [ 1 / 2 ] ▪ Code [ 1 / 2 ]
📌 Answered
How to Enable Mood Themes
More Information on the Link List Trick
-BASIC INFO
-S2 Flexible Squares.
-Basic, plus and paid.
-1024x600+.
-Best view with Firefox.
-FEATURES
-Custom comment pages, navigation and sidebar.
-DISABLED
-Title, entry date, mood themes and everything in the sidebar except for the blurb and the link list.
-HOW TO INSTALL
「 Select Journal Style 」
Apply any S2 Flexible Squares layout (except Circular and Circular Brown).
Scroll down to Choose a Page Setup: set the ads to horizontal or between entries, and select 2 Column (sidebar on left).
「 Text 」
Under Navigation, replace the Recent Entries text with Recent only.
「 Sidebar 」
Choose the following ordering: Default Userpic, Blurb, Link List.
「 Custom CSS 」
Set all drop-down boxes to NO and paste the code. Save changes.
-OPTIONAL
「 Replace the Sidebar Picture 」
In the Global section, find this:
body {
background-image: url(http://i.imgur.com/STiRpGW.jpg);
;){kind=link}
}
Replace the current URL with your picture URL. The recommended picture size is 1280x1920px.
「 Replace the Link List 」
If you want the links in the sidebar's link list to show up as in the preview, replace each of your links' text with I., II., III., etc.
Paste this code at the end of the CSS stylesheet for each link you have:
#sidebar_linklist .sbaritem:nth-child(?) a:hover:after {
content: 'Text';
}
Replace ? with the number of your link (1, 2, 3, etc.), and instead of Text, enter the text as you want it to appear when hovering the link.
-APPENDIX
「 Credit & Comment 」
Credit is nice; please link back to revolumna.
Don't redistribute or claim as your own.
Comments aren't required, but are appreciated!
「 Resources 」
Preview icons from recycle.