posted : Thursday, February 21st, 2008

Museum Installation & Use

Instructions:

  1. Download the museumTheme.txt file
  2. Go to your Tumbr dashboad and click on the Cusomize gear
  3. Click the “Themes” Tab and click the “Use custom HTML”
  4. Copy the contents of museumTheme.txt and paste it into the custom HTML field
  5. Click “Save Changes”

Using Museum:

The “More” tag

The key feature of Museum is the ability to trigger a ‘more’ permalink on posts that would otherwise be too long for the index page content boxes. To trigger the ‘more’ link, simply tag your post with the word “more” in the advanced options on the edit post page.

Out of the box, the ‘more’ link can be triggered for all content types except Photo posts. The ‘more’ link tends to interfere with photo captions which is why I’ve disabled it. However you can easily enable the ‘more’ link for photos by looking through the template and uncommenting the section that says “Morelink disabled for photos”.

Photos

Photo posts will display the center a 500px image on the index pages, and the full photo on the permalink pages. This works seamlessly if the original image is at least 500px wide and standard proportions. If the original image is smaller than 500px it may appear off to the left of the content box on the index pages. If this happens, tag the photo post as “slim” (that’s a stupid tag name, sorry) and the image will appear top left in the content box.

Comments

Museum has been designed to drop in the excellent Disqus comments. On this site, you can see that Disqus comments have been enabled as a demonstration. The comment counts have to be enabled for each individual post type within the template, however it’s easy to do. The comment count link is already in the template- just uncomment it for each post type you’d like to see comment counts for. Then, at the bottom of the .post div, there is a .comments div which says: “PASTE DISQUS PERMALINK BLOCK HERE”. Paste the Disqus permalink block (from the Disqus integration setup) here and that’s it. 

Mods

Please feel free to rip apart the theme and make it your own. If you think you’re using a fair amount of my original it’d be great if you left my link in, but use your best judgment. If you plan on changing colors there are a few things to consider. The .post div background is currently #000, and if you change it you might be surprised to find an ugly black fade under the morelink. The text dissolve effect under the morelink is handled by the .fade class which has a transparent PNG background. That PNG needs to fade from transparent to the .post background color. So if you plan on changing your .post boxes to #fff, you’ll want to make a new .fade PNG that fades from transparent to #fff.

Comments (View)

posted : Thursday, February 21st, 2008

Museum Mods

Small CSS files that can be dropped into your Museum Theme to change its appearance. Click on the Advanced tab in the Tumblr Customization and paste the code into the “Add Custom CSS” field. 

Center Mod

museumCenterMod.txt»
Centers the design and changes the header padding slightly. Sreenshot»

Comments (View)

posted : Wednesday, February 20th, 2008

Change Log

v1.3:

  1. fixed IE 7 Disqus display error

v1.2:

  1. added blockquote style

v1.1:

  1. rearrange disqus integration - single permalink block
  2. comment out video resizing. didn’t work well anyway
  3. revert videos to 250
Comments (View)

posted : Wednesday, February 20th, 2008

Short Text Post

This is a short text post that has *not* been tagged ‘more’. It will be displayed in its entirety on the index pages. 

Comments (View)

posted : Wednesday, February 20th, 2008

A PhotoThis is a photo post with caption 

A Photo

This is a photo post with caption 

posted : Wednesday, February 20th, 2008

Long Text Post

This is a long text post that has been given the tag ‘more’. The ‘more’ tag will trigger the css which fades the text and displays the red More+ link.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur venenatis velit rhoncus ipsum. Maecenas venenatis ipsum. Duis eget pede ac ante consectetuer tincidunt. Maecenas quis est id est facilisis venenatis. Nunc lectus.

Quisque sit amet sem. Proin auctor pretium quam. In hac habitasse platea dictumst. Duis quis lacus. Vivamus quam leo, vestibulum imperdiet, iaculis non, tempor ut, augue. Donec molestie nisl at dolor. Nulla sed turpis at est vehicula ultrices.

Nulla fermentum nunc ut magna. Sed eros lacus, porttitor non, euismod non, ullamcorper id, dolor. Aliquam tristique. Pellentesque vitae neque vitae mi convallis ultrices. Donec tristique, nisl et adipiscing volutpat, quam diam imperdiet urna, non nonummy mauris metus ut pede. Integer mauris.

Comments (View)

posted : Wednesday, February 20th, 2008