BY PISTACHI-O

Themes

Back

Theme 01

Back

THEME 01 : FIRST MISSIONLIVE PREVIEWINSTALL/CODES

Please remember to use the old customize page (if editing a tumblelog just add "/nameofblog") and to reset defaults if you want the same colors. Feel free to customize however much you want, the more the better, but leave credits intact. If you come across any glitches or need help just drop a message. It would also be great if you could 'like' this post if using the theme.

  • Title and Description visible. Edited from "Info" tab.
  • Default Home, Ask, Submit, Archive, Theme Credit links. Plus additional Custom Links.
  • Shows Pages.
  • Shows Icon (Userpic).
  • Date Posted (Full Format), Note Count, Tags and Reblog Info visible on Index Page.

→ SIDEBAR IMAGE
Please check the "Side Img" box for the sidebar image to show up. Can be up to 250px (width).

→ SIDEBAR & NAVIGATION LINKS
The live preview shows the drop down list when you hover on "Links". If you untick "Drop Down" you can use the box version of navigation which still allows you to add links. If using the box version, it will look best if you use a multiple of 3 (i.e. 3 or 6 links). If you have Pages, they will also show up.

→ NOTES
The preview shows the notes on the side of the entry, if you prefer to have everything with the tags at the bottom of the post, untick "Boxed Notes". Also if you need to customise the colors, you will need to change the colors of each "side note" manually.

→ POP-UP ASK BOX (IMPORTANT!)
For this to work properly you will have to edit the code slightly. Look for "YOURTUMBLRNAME" (about half way down the page) - using Ctrl + F is the easiest way - and replace it with your username. If this is not done, then you will not be getting messages through the pop-up. I suggest you try sending a message to yourself, to make sure it works.
<iframe frameborder="0" scrolling="no" width="100%" height="149" src="http://www.tumblr.com/ask_form/YOURTUMBLRNAME.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe> <!--[if IE]><script type="text/javascript">document.getElementById('ask_form') .allowTransparency=true;</script><![endif]--></p>

Theme 02

Back

THEME 02 : ON THE WAY TO A SMILELIVE PREVIEWDOWNLOAD

I know people asked for the theme I'm using right now and obviously this is not exactly it. I was tweaking the original and came across a few versions I liked so I'll be posting two variations of this tomorrow.

Please remember to use the old customize page and to "Reset Defaults" before editing. Feel free to customize however much you want, the more the better, but leave credits intact. If you come across any glitches or need help just drop a message. It would also be great if you could 'like' this post if using the theme.

  • Title and Description visible. Edited from "Info" tab.
  • Default Home, Ask, Submit, Archive links. Plus 5 additional Custom Links.
  • Shows Pages.
  • Date Posted (Full Format), Note Count, Tags and Reblog Info visible on Index Page.

→ SIDEBAR IMAGE
Please check "Side Img" for the sidebar image to show up. Can be up to 280px (width).

→ SIDEBAR NAVIGATION - WHEN HOVERED
A drop down menu will appear with all links.


THEME 02 : ON THE WAY TO A SMILE (B)LIVE PREVIEWINSTALL/CODES
Please note this theme is a variation of theme 02. It shares the same style for the entries and sidebar. The only modification is the drop down navigation menu.

→ SIDEBAR NAVIGATION - WHEN HOVERED
A drop down menu will slide down with all links. If you end up having too many links and it overflows the sidebar, adjust the height of #navigation:hover to something greater than 200px.


THEME 02 : ON THE WAY TO A SMILE (C)LIVE PREVIEWINSTALL/CODES
Please note this theme is a variation of theme 02. It shares the same style sidebar, with one additional customize option but the main modification is how the entries are displayed.

→ DROP DOWN DESCRIPTION - WHEN HOVERED
Description is hidden, to show, hover cursor anywhere on the sidebar. If your image and description overflows the sidebar, adjust the height of #sidebar:hover to something greater than 400px.

→ SIDEBAR BACKGROUND
This is the option to change how the background of the sidebar is displayed. The default setting, shown in the preview, has the background present with bottom rounded corners. In this option the sidebar scrolls from the bottom of the image to display to the description. The alternative is for the sidebar background not to be shown and instead when hovered, it will start scrolling from undeneth the title.

→ TAGS AND INFO - WHEN HOVERED
All relevant Post Info (date posted, notes, via/source) and tags will slide out to the side when you hover over the "+" on the left.

Theme 03

Back

THEME 003 : SKY-BLUE EYESLIVE PREVIEWINSTALL/CODES

So sharing another very simple looking theme. Some people asked for the theme I'm using now and it's basically a mix and match of this (sidebar) and my previous one (entries). I have also set up a page for my themes to keep things neat and tidy.

Please remember to use the old customize page and to "Reset Defaults" before editing. Feel free to customize however much you want, the more the better, but leave credits intact. If you come across any glitches or need help just drop a message. It would also be great if you could 'like' this post if using the theme.

  • Title and Description visible. Edited from "Info" tab.
  • Default Home, Ask, Submit, Archive links. Plus 5 additional Custom Links.
  • Shows Pages.
  • Date Posted (Full Format), Note Count, Tags and Reblog Info visible on Index Page.
  • Basic Audio Player with Album Art, Artist, Song and Album info included.

→ SIDEBAR IMAGE
Please check "Side Img" for the sidebar image to show up. Can be up to 300px (width).

→ TWO/THREE COLUMN LAYOUT
There is an option to have either a two (Sidebar Together) or three column layout. Keep in mind the height of your side image, length of description and number of links if using a single sidebar. A crowded sidebar can end up cutting off the Pagination.

→ BASIC AUDIO PLAYER
Audio with basic info Album Art, Artist, Song and Album included.

→ CUSTOM FONTS
Six Caps (Title), Droid Serif

Theme 04

Back

THEME 004 : ACROSS THE DIVIDELIVE PREVIEWINSTALL/CODES

I've had a few questions about sharing the theme I have now and I will eventually get to it but first is my previous theme which I promised. I have moved my stuff to the (world's most annoying) Theme Garden to comply with the TOS so it should make life easier to install as long as there's no glitches.

Please remember to use the old customize page and to "Reset Defaults" before editing. Feel free to customize however much you want, the more the better, but leave credits intact. If you come across any glitches or need help just drop a message. It would also be great if you could 'like' this post if using the theme.

  • Title and Description visible. Edited from "Info" tab.
  • Default Home, Ask, Submit, Archive links. Plus additional Custom Links.
  • Shows Pages.
  • Date Posted (Full Format), Note Count, Tags and Reblog Info visible on Index Page.

→ SIDEBAR IMAGE
Please check "Side Img" for the sidebar image to show up. Can be up to 300px (width). Under "Normal" and "Full" Sidebar options, Sidebar Image will slide across to reveal the the Title/Description - When Hovered.

→ SIDEBAR OPTION: NORMAL, FULL, FIXED
The default option is "Fixed", as seen in the live preview. Please make sure you ONLY HAVE ONE of these options ticked - this is what the default settings look like. If none of them are checked it means no sidebar, if more than one's checked it'll mean something looks wrong.

FIXED: is basically when the Title, Links, Pagination and Sidebar Image are visible at all times. When you hover over the Sidebar Image, your Description will show.
NORMAL: is when only the Sidebar Image and Pagination are visible. You will need to hover over the Sidebar Image to get Title, Links, Description. The height of the Sidebar is determined by the height of your Sidebar Image.
FULL: is the same as "Normal" with the exception that the Sidebar's height will fill to the bottom of the page.

→ IF USING FIXED OPTION: IMAGE HEIGHT (!IMPORTANT)
Enter the height of the sidebar image you will using (after it has been sized down to width:300px) keeping it a negative number. The default value is -140px. This is to make sure your description shows up properly when the Sidebar Image moves. The higher you want your descripition, the higher the negative number.

→ BOXED NOTES
Same as my first theme, an option to change how the notes are displayed. The default setting, shown in the preview, puts the notes on the side of the entry (when hovered they expand). If you prefer, you can have all the info in the posts by unticking "Boxed Notes". If so, Reblog Info will be with the Tags and Date/Notes will be at top of the post.

Edit: And a few people may have noticed that the default links aren't working - I'm not sure how long it takes for changes to be reviewed in the theme garden so when you install please look for this code: <a href="" class="info">Home</a> <a href="" class="info">Ask</a> <a href="" class="info">Archive</a> <a href=" class="info">Submit</a> and change it to: <a href="/" class="info">Home</a> <a href="/ask" class="info">Ask</a> <a href="/archive" class="info">Archive</a> <a href="/submit" class="info">Submit</a>

Theme 05

Back

THEME 005 : HANGING EDGELIVE PREVIEWINSTALLDOWNLOAD

This is the theme I am currently (still) using and promised ages ago. I'm going to stick the codes in Pastebin for now and see if any problems come up, then when I'm happy with it I'll copy them into the Theme Garden.

Please remember to use the old customize page and to "Reset Defaults" before editing. Feel free to customize however much you want, the more the better, but leave credits intact. If you come across any glitches or need help just drop a message. It would also be great if you could 'like' this post if using the theme.

  • Title now shown. Description visible. Edited from "Info" tab.
  • Default Home, Ask, Archive links. Plus additional Custom Links.
  • Does NOT show Pages.
  • Date Posted (Full Format), Note Count, Tags and Reblog Info visible on Index Page.

→ SIDEBAR IMAGE/HOVER DIRECTION/BORDER
Please check "Side Img" for the sidebar image to show up, you will need one for hover/slide to work properly. The sidebar image is a circle (automatically adjusted when you upload) with a diameter of 300px. You can also choose which direction the image slides to. Default is right but can be changed to downwards, which may work better with larger resolution screens. There is also an optional border around the image and description.

→ NAVIGATION LINKS
The default links (Home, Ask, Archive) are numbered from 01 - 03 and there's an additional four links that can be added. Pages are NOT shown. Under "Apperances" you can change the background color of each individual links. The current colour palette I'm using is "Data Eyes".

Pages

Back

Film Table 01

Back

FILMS IN 2012 CHALLENGEPREVIEWIN ACTION PREVIEWDOWNLOAD

I'm surprised by the number of comments I got about my "100 Films in 2012" page and as a few people requested the codes, here it is. If there are any questions about changing colours/fonts or adding posters and film info please have a look here first. Any other problems just message me. Feel free to edit as much as you like but if things go wrong I'm not promising to help you to fix customizations you made (this is mainly what my inbox is full of nowadays).

Little side note, in the picture preview above I used "Six Caps" as the font of my title but since then I have changed it to "Riot Squad". If you want to change it the custom font is still uploaded in the codes.


→ HOW TO: INSTALL / ADD PAGE
01. At the Customize page (new or classic should make little difference), click “Pages”, and then “Add a page”.
02. There will be a pop-up and on the drop down menu at the top select “Custom Layout”.
03. Type in whatever URL you will be using and tick the "Show a link" if you want. Keep in mind not all themes support this and you may have to manually link back later.
04. Copy and paste the whole code in the box, do your editing/customization and click "Create Page". Sometimes they will ask you to confirm "Save Page" as well.
05. This is probably best viewed in Chrome. I've tried to adjust it to fit other modern browsers like Firefox and Safari but I have no clue how it looks in IE. Probably bad.


→ HOW TO: CHANGE TITLE FONT
The custom font kit used is "Riot Squad". To change, just look for font-family under #title.


→ HOW TO: CHANGE ROWS/# OF FILMS PER ROW
The default number of films per row is 6. This is determined by the width of the ".content" and each ".view img" (poster image). You can feel free to change this - keeping in mind the most popular screen resolution is 1280x720 - but if things go wrong I'm not promising to help you to fix customizations you made.


→ HOW TO: CHANGE COLOURS

Main Background - #FDF9F1
Film Info Background - #E8DDCB
Title - #036564
Title Shadow - #CDB380
Links - #033649
Links when Hovered - #9ABFC8
'Title/Year' Heading - #00000
'Date Watched' Text - #333333


→ HOW TO: ADD FILM DETAILS
There are no tables in this version, therefore no columns and rows, so there's no need to stick to a structure. Everytime you want to add a new film just copy/paste the code and keep adding to the list.
<div class="view view-style"> <img src="IMAGE-URL-HERE"> <!-- Poster Image Link --> <div class="mask"> <h2>TITLE-OF-FILM-HERE</h2> <p>DATE-WATCHED-AND-TEXT-HERE<br> <!-- Date Watched/Text/Rating --> ★★★★★</p> <a href="#" class="links">CREDIT TO MAKER</a> <!-- Optional: Credit to Poster Maker/Artist --> <a href="#" class="info">(link to graphic?)</a> <!-- Optional: Link To Graphic --> </div> </div> For hosting images I suggest sites like Imgur or Imageshack. Remember to use the direct link which ends in the file format. Also this is quite important: I would not recommend using image ratings/stars unless you're willing to recode some stuff. Basically if you use an image it will hover off the page.


Redirect Page 01

Back

MOVED/REDIRECT PAGEPREVIEWDOWNLOAD

After seeing this by lmthemes, I wanted to make a redirect page myself even though I have no plans to change usename anytime soon. This page includes a very small animation at the beginning of the page and will only work on modern browsers with the CSS3 transitions (i.e. It probably looks horrible in IE).

→ HOW TO: INSTALL / ADD PAGE
01. It's the exact same as changing your theme - just copy and paste the code into the "Theme" tab.


→ HOW TO: CHANGE TITLE FONT
The two fonts currently used are: Miso and Unlock. I would advise against changing the fonts because the size/lettering space will then change which could effect the overall layout as it doesn't adjust automatically.


→ IF YOUR OLD USERNAME IS TOO LONG
... and starts to overflow into the arrows change, under "Apperances", change the Font Size to something less than 90px.


→ HOW TO: CHANGE COLOURS
Under "Apperances" just like a normal theme.