Themes Resource

theme 06: plastic hearts (preview + code in the source)

a fansite theme inspired by miley cyrus’ new album, plastic hearts.

features and options:

(optional) full width header

275px sidebars: about, six links navigation, projects, updates, affiliates, members and statistics. all optional

540px

one accent color

credits:

photosets by eggdesign and annasthms

honeybee icons by suiomi

tumblr controls by magnusthemes

video resize script by nouvae

tooltips by malihu

header preview by Shiva (edited by me)

full credits

notes:

you will have to manually input most of the content into the HTML editor, so basic knowledge is recommended.

the customization page is bugged, so be sure to toggle the options on and off, as well as save and view on your blog before sending me any asks about problems.

you may:

edit as much as you please / to your liking

you may not:

use as a base

claim as your own

miranda: cosmic-with-frosted-glass-effect revamp of an unreleased theme.

preview // code

features:

responsive

infinite scroll or simple pagination

5 custom links

Theme 14: Caelestis by kuzuriha

“The future of our star rests with you now, my king.”

LIVE PREVIEW / VIEW CODE / STATIC PREVIEW [1] [2]

1 accent color, 4 color options

Most of the widgets can be toggled on and off from the Customize page.

Optional dual or single sidebar layout.

Optional header image.

5 navigation links and 8 additional links.

Variable post widths ranging from 500 - 700px.

Instructions on how to edit the widget are in the code. Please read them first before sending me an ask!

This theme is compatible with NPF.

Old photoset fix, customAudio.js: @annasthms

Honeybee icon font: @suiomi

Flexible video player: @nouvae

PXU photoset by @shythemes and fix by @bychloethemes

I honestly forgot who made the icons, please hit me up if you make the icons and I will tag you accordingly!

This…is somewhat intended for a fansite theme but can also be used on personal blogs. As you can see, I procrastinated two whole months on this before pulling my head out of my ass and finished this. This is my first time coding a fansite theme, so I’m pretty sure there will be a lot of bugs – don’t hesitate to hit me up if something’s off. Instructions to edit the sections/widgets are in the code, so please read them first before dropping me an ask! 

Pastel Summer Mochi - Submitted by Bts-colorpalettes

Fresh Air

preview / permalink + code

This is the 2nd revamp of Fresh Air. I didn’t alter the post styles a whole lot, but I completely redid the sidebar by turning it into a header that transitions into a sidebar when you scroll down.

Features:

Header / sidebar

Custom colors

Custom links using “show a link to this page”

Like and reblog buttons

Jump pagination

Dashboard captions

Credits: 

icon font is by @saturnthms

header image in preview  by asoggetti on Unsplash

CSS-only URL tooltips tutorial

I’ve been asked a few times how I’ve made these tooltips on my blog:

To do this, we need to use this:

a[href*="http"]{ position: relative; }

This line selects every anchor tag (link) that contains http. This will include any link with http or https, and ignore any links that are just pages (like /about), so keep that in mind.

I added position: relative; just to make sure that our tooltip will appear next to the link, since we will be using position:absolute; for this.

Now, for the tooltip

[ Theme #04: From Home ]

Static Preview + Code

Features:

Responsive

Day and night mode (will stay in night mode until you turn it off!)

Dropdown tags

Popup menu (10 custom links)

Searchbar

Like and reblog buttons

Supports page links

Options:

Post size: small, medium and large

Custom description

Hover on Tumblr controls

Social media links

The font size and font family are customizable. To change the font family, please refer to this site!

Credit:

Day and night mode: @eggdesign

Icons: boxicons

NPF photosets: @annasthms

Photosets: @annasthms and @eggdesign

Popup: @odeysseus

Tippy tooltips: atomiks

Tumblr redirects: @magnusthemes

mosa lisa : preview / download

simple, minimalist theme.

features:

header or sidebar.

full screen dropdown menu.

up to 10 custom links.

like, reblog buttons.

optional search bar, scroll to top button.

pagination, manual load, infinite scroll.

notes:

the first 2 links you put in the theme options will be the first 2 icons placed on your header / sidebar.

both of these 2 icons can be changed within the theme options.

please keep the number of header / sidebar icons to 4 only.

01. moon song 

a minimalistic sidebar theme that features customizations such as:

post width

font size

font

sidebar width

option to have tags on hover

regular pagination

base code originally by @seyche​

theme nine: lilac — one-column sidebar theme with an optional header inspired by social media post dashboards. made to commemorate the one-year anniversary of when i started this blog. it’s been a crazy year and i can’t believe how much this blog has grown, so thank you to all of you!

previews: static preview / live preview

install: theme garden / pastebin / github

features and options:

sidebar with a 100px by 100px circular image and up to three custom links

optional header with a search bar, optional header image, and up to seven custom links. header image can be any height and is the same width as whatever post size you choose.

posts sizes: 400px, 450px, 500px, 540px.

option to show or hide captions, show tags or tags on click, optional post dropdown menu with extra post info.

options include: post margin, photoset gutter, drop shadows, rounded post and photo corners.

first npf photoset in a post will be converted to a regular photoset, thanks to this script by annasthms and codematurgy’s npf photoset script.

responsive for both desktop and mobile devices.

notes: 

tumblr’s customize page is very buggy and when you first install the theme, you have to toggle the options on and off to get them to work properly. if something doesn’t look right or the post captions disappear, save and exit because 99% of the time it will look fine on your blog.

icons are from Feather Icons and if you want to change them, go to the site, find the name of the icon you want, and enter it in the space in the customization panel.

there are only three custom links in the sidebar. links four to ten are in the header. if you do not toggle the header on, none of the links in the header will show up.

matches hyacinth about page and narcissus tags page

✿ THEME 001 ✿

simple & centered one column theme static preview // download // support me on ko-fi?

>> features

base code by @seyche!

header menu with home, ask, archive and nav buttons

dropdown menu with three custom links

hidden tags that appear on hover

customization for font, font size, post margin & colors

check out the static preview for all features!

>> notes

list of credits in the code! please do not remove it, thank you :)

this is my first theme, so customization is still limited!

please dm me or send me an ask if you have any questions or run into problems :D

(source)

Unsplash -  photography, illustration, and art

Pixabay - same as unsplash

Pexels - stock photos and videos

Stockvault.net - stock photos

Veceezy - vectors and clipart

Getdrawings - simplistic images and drawing tutorials

Gumroad - photoshop brushes (and more)

Canva - needs login but has lots of templates

Library of Congress - historical posters and photos

NASA - you guessed it

Creative Commons - all kinds of stuff, homie

Even Adobe has some free images

There are so many ways to make moodboards, bookcovers, and icons without infringing copyright! As artists, authors, and other creatives, we need to be especially careful not to use someone else’s work and pass it off as our own. 

theme 219      static preview     code: pastebin / google docs     my ko-fi <3 base code @eggdesign  & captions/audio @seyche

i recommend that you reset defaults before using it, so the new settings won’t have conflict with your current theme, but it will work if you don’t do it anyway

sidebar settings in the appearance

as default, you can change: font type (you can pick any from google fonts. just type their name in the appearance. ex: Open Sans), color, size, font weight, font style, text transform, and position regarding the text mostly for posts and sidebar

4 sidebar links, option to use them or not

option to use title or not. you can also edit font style, size, position, text transform

option to use sidebar image (size 268px)

position sidebar content top, center or bottom

change the background of the sidebar: scroll down until you find the box with its name. you can also add a gradient, you can pick one on this site and copy the second background code

how to change the icons on sidebar!

in the appearance, you’ll see boxes with Icon on their names: Index Icon, Ask Icon, Sidebar Link 1 Icon, etc

enter here on feathericons and choose an icon. you’ll only need their name, then add that in the appearance. it’s done!

posts settings

540px,       500px,       400px

you have to use only one of the sizes of posts available. i recommend you to enable/disable all of them and then enable only the one you desire.

tumblr dashboard captions or regular captions (with blockquote). also have an option to use custom icon in front of the username

posts borders

box-shadow, and customize color and opacity

other options

you can disable the underline on links if you don’t want them

custom controls with hover or use tumblr’s default

option to use images black and white with opacity

add background image

ALL-IN-ONE: HELIOS

Live Preview Code: Pastebin

This page combines your about, navigation, and blogroll pages in one! In Customize, add a Custom Layout page and enter the coding there.

A Page Pack by extasisthemes

Tears Of Gold  Preview/Download

Features:

50x50px icon image

page title

page subtitle

three custom links

info section

about section

Can’t Let You Go Preview/Download

Features:

page title

three custom links

faq section title

question and answer section with two 70x70px icon images

ask form

Notes:

Please like or reblog if using. Message me if you found coding bugs aka a mistake caused by my sleepiness.

Page — Sweet Surrender by extasisthemes Preview/Download

Features:

924x300px header image

page title

page subtitle

two custom links

filters section

item section (item title, item description, item warnings, item ratings and item links)

Notes:

Please like or reblog if using. Message me if you found coding bugs aka a mistake caused by my sleepiness.

Blogroll Page #3

Based on Tumblr’s following with functional search feature.

Preview | Code ( pastebin , github )

Note: