Start

SIGNUM Tumblr Theme Documentation

Theme version 1.0 / last update: 04.02.2014

Introduction

At first, thank you for your interest in our theme. If you purchased our theme, we hope that, SIGNUM will meet your expectations and you will enjoy it a lot.

We do our best in making themes, so we will be very appreciated if you can rate and review our theme on ThemeForest (more details you can find in "FAQ" section). It will really motivates us to make more quality themes. Your opinion (rate and review) is very helpful and necessary for us.

Thanks in advance.

PS. If you want, you can follow us on social websites:

About theme

SIGNUM is a clean, minimal blog theme for Tumblr. This theme can be used as a personal / company blog, photo / image portfolio etc. It support all Tumblr posts types (also the newest - Panorama). You can easily change the look of the theme using custom made options which are described in features section.

SIGNUM is fully responsive web design for all devices.

For a better experience, please check the live preview demos:

Features

Below are described all features included in SIGNUM theme. Let’s start!

Retina ready logo image
SIGNUM has support for Retina ready logo image (as a theme options)
"Load more" pagination - dynamic post fetching
Pagination can be switched between normal pagination (previous/next page) and dynamic post loading (load more posts button)
Support for all Tumblr post types (including newest - Panorama)
SIGNUM offers support for all Tumblr post types: text, photo/photosets, quote, link, chat, audio, video, answer and the newest - panorama for wide photos.
Localized theme strings
SIGNUM uses localized theme strings that allow theme to appear in every language Tumblr supports.
Social media links
You can add social links in theme's footer.
Exif data for photo posts
This feature shows basic Exif data from a photos: camera name, ISO value, aperture, exposure and focal length.
Highly customizable sidebar
Sidebar contains some important widgets: search, about me text widget, menu and social widgets (Twitter, Instagram, Dribbble and Flickr)
Syntax code highlighting
Multi-language automatic code highlighting in text posts. Includes automatic language detection.
Instagram, Dribbble and Flickr photostream widgets
Shows your photos/images from popular social websites in sidebar.
Well styled typography
Typography is prepared to be shown perfectly and clearly on any screen devices and resolutions.
Custom footer background image/color
You can switch between background color and image in footer section.
Webfont vector icons
Vector icons are retina ready and can be used to show social media links.
Responsive design
SIGNUM automatically adapts to any screen resolution or device.
Custom theme colors
You can change colors for header bar, links, body background, footer background and text.
HTML5 + CSS3 animations
SIGNUM theme is created using the newest web standards (HTML5, CSS3).
Social share buttons for blog posts and pages
Twitter, Facebook and Google Plus sharing buttons.
Social media links (widget in sidebar)
Up to 10 custom buttons placed in the sidebar (you can set icon and URL).
Twitter feed
Retrieve and display tweets based on your twitter handle
Disqus comments
Includes support for Disqus comments system.
Author avatar and description in sidebar
In the sidebar there is a possibility to show avatar image and text description
Google Analytics support
To set up your Google Analytics, you only need to paste your unique code.
Lightbox for fullscreen photos
Cool way to showcase your photos (available in photoset, photo and panorama posts).
Showing or hiding theme elements
You can hide unnecessary theme element/elements with one button.
Custom Vimeo video player color
You can set custom color for Video player for better match to the theme color scheme.
Like and Reblog buttons
SIGNUM has implemented Tumblr features: Like and Reblog buttons.
Support for user defined pages
Create your custom static pages in the dashboard and add a link to them so they show up on the sidebar. SIGNUM offers support for Ask and Submit pages as well.

Installation

This is a step-by-step installation process, facilitated using screenshots from Tumblr.

Open www.tumblr.com/dashboard and login to your account.

Click on the Settings Icon.

Click on the tab of the blog you want to install the theme on.

Click on the Customize button.

On the customization panel, click on Edit HTML.

Unpack archive you’ve downloaded from Themeforest and search for the file named: Signum-1.html (from demo 1) or Signum-2.html (from demo 2) or use relevant .txt files.

Once located, open .html or .txt file with a text / code editor (such as Sublime Text, Dreamweaver, Notepad or other). Select all code (in Windows press Ctrl+A) and copy (press Ctrl+C).

Next step is paste this code in Tumblr’s Edit HTML text area (first select all current theme code and press Ctrl+V to paste SIGNUM theme code).

Final step is to click Update Preview, then Save button. Get back to Appearance tab and refresh your browser window. (F5 or Ctrl+F5).

SIGNUM theme has responsive design which adapts to any device and screen resolutions, so you have to disable Tumblr's optimized mobile layout (it's enabled by the default). In "Customize" panel please go to the bottom and open "Advanced options" and switch this option off.

Customization

Theme customization is really easy! To make it easier to find the desired option, we've added a number prefix to the option name, for example 205 Blog Title. In this section you have a description for all theme options.

Theme options

Images

Option name Description
202 Logo Logo in header (related with: 204 Logo Width)
203 Logo 2x Logo (for Retina displays) in header
431 Footer Optional image in footer (if not set, footer will have background color - option 432 Footer Bg)

Colors

Option name Description Default value
in demo #1
Default value
in demo #2
001 Link Links color in whole theme #84cbc5 #2e97de
002 Link Hover Links color on cursor hover in whole theme #f57365 #50b9ff
206 Blog Title Blog title color (below logo image) #84cbc5 #2e97de
208 Blog Description Blog description color (below blog title) #cccccc #999999
324 Link in Sidebar Hover color for all links in sidebar #84cbc5 #50b9ff
432 Footer Bg Footer background color (if 431 Footer is not set) #84cbc5 #eeeeee
433 Scroll To Top Scroll to top icon color #ffffff #2e97de
434 Scroll To Top Hover Scroll to top icon color on cursor hover #f57365 #50b9ff

Switches

Option name Description
005 Show Exif Toggles display of an Exif data on the photo posts
006 Show Like Button Toggles display of a Tumblr's like (heart) button in the posts
007 Show Reblog Button Toggles display of a Tumblr's reblog button in the posts
008 Show Comment Button Toggles display of a comment icon in the posts
009 Show Share Button Toggles display of a share button in the posts
010 Show Tags Toggles display of a tags in the posts
011 Load More Pagination Toggles display of a pagination. If it is switched on, pagination will be set to dynamic post loading, if it is switched off, pagination will be set to normal
012 Sidebar On Right Toggles display of a sidebar. If it is switched on, sidebar will be placed on the right side, otherwise sidebar will be placed on the left
013 Show Tumblr Controls Toggles display of a Tumblr controls on the top right corner (customize, follow, dashboard etc.)
201 Show Logo Toggles display of a logo image
301 Show About Me Toggles display of an "About me" text widget in sidebar
304 Show Home Link Toggles display of a home link in sidebar's menu
305 Show Archive Link Toggles display of a archive link in sidebar's menu
306 Show Random Link Toggles display of a random link in sidebar's menu
307 Show RSS Link Toggles display of a RSS link in sidebar's menu

Texts

Option name Description
003 Disqus Username Your Disqus username. Required to display comments
004 Google Analytics Google Analytics ID, for example: UA-XXXXXXX
204 Logo Width Width of a logo in pixels, example value 200
205 Blog Title Blog title text (below the logo), default value Blog Title
207 Blog Description Blog title text (below the logo), default value Blog Description
302 About Me Title Title of an "About me" widget in sidebar
303 About Me Text Text for an "About me" widget in sidebar
308 Custom Tag 1
309 Custom Tag 2
310 Custom Tag 3
311 Custom Tag 4
312 Custom Tag 5
Custom tag that will appear in sidebar's menu as an URL to YOUR_BLOG.tumblr.com/tagged/CUSTOM_TAG
313 Twitter Title Title for a Twitter widget in sidebar
314 Twitter Tweets Count The number of tweets retrieved to display. Default value 4
315 Instagram ID Instagram user ID, more details in "FAQ" section
316 Instagram Title Title for a Instagram widget in sidebar
317 Instagram Photo Limit The number of Instagram photos retrieved to display. Default value 4
318 Dribbble ID Dribbble username
319 Dribbble Title Title for a Dribbble widget in sidebar
320 Dribbble Photo Limit The number of Dribbble shots retrieved to display. Default value 4
321 Flickr ID Flickr user ID, more details in "FAQ" section
322 Flickr Title Title for a Flickr widget in sidebar
323 Flickr Photo Limit The number of Flickr photos retrieved to display. Default value 4
410 Social 1 Icon
412 Social 2 Icon
414 Social 3 Icon
416 Social 4 Icon
418 Social 5 Icon
420 Social 6 Icon
422 Social 7 Icon
424 Social 8 Icon
426 Social 9 Icon
428 Social 10 Icon
Name of the icon from icon set included with theme, more details in "Icons" section
411 Social 1 URL
413 Social 2 URL
415 Social 3 URL
417 Social 4 URL
419 Social 5 URL
421 Social 6 URL
423 Social 7 URL
425 Social 8 URL
427 Social 9 URL
429 Social 10 URL
Full URL address for each social icon, example value https://facebook.com/passionthemes
430 Copyright Text Text below social icons,
default value © 2014 Copyright by Passion Themes.

Sections

Header

In header section you can set your own logo image. There are two options for a logo image 202 Logo 203 Logo 2x (normal logo and high resolution image - 2x bigger) and 204 Logo Width where you put logo width in pixels (normal logo image width, not 2x).

Logo by the default redirects to the home of your blog. If logo is not set or you switched off option to show it (in 201 Show Logo), home redirection is attached into blog title (below the logo).

Here is a example logo images from demo 2:

Normal Logo High resolution Logo

You can change text/color of a blog title and blog description (options from 205 to 208).

Sidebar

In sidebar you can customize almost all elements (besides search and close button).

Sidebar can be placed on the right (by the default) or on the left side of the screen (option 012 Sidebar On Right).

First widget is a "About me". Here you can set your own title and text (options 302 and 303). If you want to hide this widget simply leave these options empty.

Next section of the sidebar is menu. Here you can toggle a home link, archive, random and RSS link. Simply use properly options from 304 to 307. "Ask my anything" and "Submit" links you can set via blog's settings on Tumblr.

In menu you can also set (up to 5) custom tags which redirects to YOUR_BLOG.tumblr.com/tagged/CUSTOM_TAG. To hide these links, simply leave options from 308 to 312 blank.

Sidebar includes four social widgets: Twitter feed, Instagram photos, Dribbble shots and Flickr photos (options from 313 to 323. Each can be customized separately: set your own title, limit how many elements from the widgets you want to show.

How to set up Twitter, Instagram and Flickr widgets please go to "FAQ" section.

You can set a hover color for all links in sidebar using option 324 Link in Sidebar.

Posts

In posts you have control to show/hide elements: Exif data from a photo in photo posts, buttons (like, reblog, comments and share) and tags (options from 005 to 010). All these options are turned on by the default.

If you turn on an option 005 Show Exif, Exif data will be shown, only if the photo contains Exif data written into it.

Share button toggles the social share buttons (Facebook, Twitter, Google Plus) and easy to copy short URL to actual post. If you switch off all of them, entire row will be hidden.

Footer

Footer can be shown as a single color background or using an image which will be automatically sized into screen width. If you do not upload a footer image (option 431 Footer), only background color will be shown.

You can set color and hover color for a "scroll to top" icon (option 433 Scroll To Top and 434 Scroll To Top Hover).

Icons

SIGNUM theme uses webfont icons which you can use in options for social buttons (options from 416 to 429). Below are listed all icons that can be used:


home

envelop

phone

location

google-plus

facebook2

instagram

twitter

facebook

feed

youtube

vimeo

flickr

picassa

dribbble

forrst

deviantart

steam

github

github2

wordpress

joomla

blogger

tumblr

yahoo

soundcloud

skype

reddit

linkedin

lastfm

delicious

stumbleupon

stackoverflow

pinterest

xing

flattr

foursquare

paypal

yelp

Support

Please register a new account and open new ticket at our support website - www.passionthemes.com/support. It will help us to quickly solve your problem(s).

Turnaround time for support replies takes up to 24-48 hours. Please describe in detail your problem(s) with a theme. Include your blog's URL and/or your current theme code in .txt or .html file format.

FAQ

How to link Twitter account to SIGNUm theme?
To link with Twitter you need to go to your blog’s Settings (not Account Settings) and find button “Sign in with Twitter” – click it. You will be redirected to Twitter, log in and authorize application. That’s all about Twitter.
How to show photos from Instagram? What is my Instagram ID?
First go to this page: http://embedagram.com. Click on “...let’s get started”, you will be redirected to Instagram. Log in and authorize Embedagram (plugin to show Instagram photos in SIGNUM theme). Next, you have to get your Instagram ID – go to http://jelled.com/instagram/lookup-user-id and write your Instagram username and press Submit. Copy-paste ID to SIGNUM theme option 315 Instagram ID.
How to show photos from Flickr? What is my Flickr ID?
In SIGNUM theme you are able to show your Flickr photos in sidebar. All you should do is to get your Flickr ID (please go here www.idgettr.com and type Flickr URL with your username, for example: http://www.flickr.com/photos/we-are-envato/ and click Find). You should get an ID similar to: 52617155@N08, which you need to put in your theme option called 321 Flickr ID.
How to rate this theme on ThemeForest?
Click Downloads tab in your ThemeForest profile page and rate our theme with 5 stars. If you want to rate our theme with less stars, first please let us know – we want to know your opinion and what things we have to improve in future.
How can I change the CSS code by myself in SIGNUM theme?
You can simply open the "Customize" panel, scroll down and click on "Advanced options". You will find there a "Add custom CSS" field - put there your CSS styles.

Changelog

v1.0 (03.02.2014)

  • initial release

Credits

JS scripts & apps:

Photos, images, videos and audios used in demos (for theme preview only):

Our themes

If you could spare some of your time, go check out the rest of the our Tumblr themes:

FLAT - Responsive Business Tumblr Theme

FRESCO - Responsive Multipurpose Tumblr Theme

PULIRE - Responsive Multipurpose Tumblr Theme