A slight revamp with a cleaner design which includes NPF compatibility, some bug fixes, and most importantly a updated base code that was rebuilt from the bottom up for more efficiency.
Features
Dark mode option (will remain in dark mode even if you refresh)
Up to 6 custom links
6 post types between 400px and 540px
6 post padding options
6 photoset gutter options
8 font options and 4 font size options
Center & justify description text align / left & justify post text align option
Option for small cursor
Scroll to top
Grayscale and fading image option
Sidebar divided into navigation links, sideblogs / affiliates and search bar
Extra Notes
Header image is post size of you choice + 485px. For example, if you choose the 540px option you will add 540px by 485 you will get 1025px. That will be the size of your header image
Remember that by using my themes you have agreed to the terms of use
theme fifteen: magnolia — dual sidebar one-column theme with gradient accents (and gradient icons!), per the results of this survey from a few months ago.
175px wide sidebar image and an optional 100px x 100px icon image.
post styling: option for tags on click or show tags, options for rounded corners.
post sizes: 400px, 450px, 500px, 540px, 600px.
hide or show captions on index.
up to four custom links and an unlimited number of Tumblr pages.
ten body font options, five title font options, font sizes from 12px to 18px, and all colours customizable.
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 toggle options on and off to get them to work properly.
this was going to be an npf-friendly theme where npf and legacy posts were styled to look exactly the same. I got most of the way there, but then Tumblr changed the npf styling on me and I gave up. so this is a much more npf-friendly theme than my other ones, but I’m not making any guarantees, and please do not message me about npf posts on this theme because I have officially given up on npf.
likewise, please don’t message me about removing the coloured letter/period in the title; it’s a design choice!!! I like it!! (also I’m not responding to customization questions anymore)
a simple, responsive blog theme perfect for photo-oriented blogs and gifmakers. rounded corners for a soft look and room for a large sidebar image to emphasize photo content.
features:
225px sidebar image
540px posts
rounded corners
3 custom links as icons
custom google font choice and size
npf compatible, especially for images!
responsive on all desktop devices and mobile as well (posts will resize automatically)
sidebar: display your tracking tag/name at the top, show/hide blog title, customized description (especially if you want it to be different from your mobile description that includes links)
reblog button: emphasized to attract more attention, customized hover text (default is ‘do it’)
hide the like button (optional) to push the #reblognotlike agenda /hj
click to show tags (to hide the long #userblog #sourceblog and #edit tags)
post notes at the top of post for easy checking
updates tab (optional)
day/night mode
change cursor on hover (optional)
up to three custom links
responsive for mobile (make sure ‘use default mobile theme’ isn’t selected under advanced settings on customize page)
TO THE USER
don’t delete the credits please
base code from @seyche ily (full credits in theme code)
customize page kinda buggy so i recommend having your blog opened in another tab and refresh after every edit to check
this is my second first theme so feel free to send me an ask if you’re having any problems with it
A simple sidebar theme with not-too-soft rounded corners. Suitable for all kinds of blog types but will particularly do well for image-heavy blogs.
Features:
Customizable post size and font size. Post size can be entered on the post size field and the font size can be entered on the font size field. The live preview uses 600px post size and a font size of 14px.
Customizable photoset gutter. The live preview uses 5px photoset gutter.
Three custom links.
One accent color and 7 color options.
Built-in lightbox for photoset posts.
Mostly NPF-friendly.
A 200px x 200px sidebar image.
Scroll-to-top button that appears when you scroll down the page.
Fade in effect on load
Notes:
I tried my best to make this theme NPF friendly, but until the usual, expect things to break or look weird.
Keep your description and your blog title short, otherwise the sidebar may be too long and it may look a little bit out of place.
Customizable icons, chosen from Cappuccicons: 1 blog-wide icon, and up to 8 individually customizable links (see under the cut for how to add custom links)
Text options: choose between upper/lowercase for special text, Google and Tumblr fonts, and font sizes
Appearance options: customizable post widths and sidebar width, and a variety of color options, including an (optional) light/dark mode toggle
Optional title/avatar/description, search bar, like/reblog buttons, date/timestamps, tags, and Archive/Random links
Responsive
Supports new post types/pinned posts
And more!
See more about how to customize this theme and theme credits under the cut. For additional help, feel free to send me an ask.
Customization of icons in general:
Icons are taken from Cappuccicons. To customize them, find an icon you like from the Cappuccicons page; then, insert the text name of that icon into an icon field, following the pattern of the pre-filled icons.
For example, the screenshots above use “flash-o” and “paw” for “Main Theme Icon”. They’re visible just under the navigation (and in place of the color mode toggle, if it’s disabled).
Make sure you DON’T include quotes around the name! Write flash-o and not “flash-o” in the relevant fields.
Customization of custom pages/navigation:
For the navigation under the description box, you can choose to use either (1) the inbuilt Tumblr pages or (2) manually enter links using the fields provided in the theme options.
To use option 1, turn “Standard navigation icons” on., then add links using Tumblr’s “add a page” option (see here for a guide).
This method technically allows for infinite links; however, I strongly recommend you have only 8 or fewer links, so that they don’t overflow the sidebar.
All links will use the same icon, the one listed in the “Standard navigation icon” text field (“link” by default).
The text entered in “Show a link to this page” will appear as a tooltip on the link when it’s hovered on.
To use option 2, turn “Standard navigation icons” off, and add links using the “Page # link/label/icon” fields in the Customize menu.
This method lets you add only up to 8 links, but you can give each one its own icon using the corresponding “Page # icon” field.
The text in “Page # label” will appear as a tooltip on the link when it’s hovered on.
Navigation items only appear if the “Page # link” field is filled in.
Comic focused options: Comic navigation (option for image or text links), home/“read chronologically” buttons
Option for header image and two background images
Option for tall/fixed-on-scroll header
Custom colors, fonts (Google/Tumblr fonts), font sizes, and post sizes
Optional title/avatar/description, search bar, like/reblog buttons, tags, Archive/Random links
Responsive
Four special tag links, plus unlimited custom links (see my theme installation guide for how to add these)
Supports new post types/pinned posts
And more!
My first ever comic theme, and an entry for the Opposites Attract challenge! Features some special scripting to ensure chronological page navigation works smoothly regardless of your pagination choices.
See more about how to customize this theme (especially for comic usage) and theme credits under the cut.
Customization in general:
Use either all images or no images for page navigation (first/previous/next/last), as the styles for text navigation are only activated when no images are present.
If you’d like, you can change the four custom tag links to redirect to other non-tag pages. To do this, search for “TAG LINKS” in the theme code, and remove “/tagged/” from the href attributes (href=“/tagged/{text:Tag 1 name}” -> href=“{text:Tag 1 name}”). You will now be able to add any link in the “Tag 1 name” field; this can be repeated for Tag 2, Tag 3, and Tag 4.
Customization for webcomic blogs specifically:
For the page navigation (first/previous/next/last) to lead to the appropriate pages, set your blog to display only one post per page. Do this by going to Advanced options on the Customize page, then setting Posts per page to 1.
For the “First” navigation link, add the link to your first comic page under the “First comic page URL” field. To accommodate for future blog URL changes, you might want to write the link simply in the format “/post/1234567890”, deleting all other parts of the URL.
To use the default newspaper title font in the header, disable the “Use Tumblr fonts for title” toggle, then leave the “Google font for title” field empty.
Appearance options (show/hide header image/avatar/title/description, title font options, and background/text/accent colors) synchronize with mobile settings
Optional:Featured posts section, updates section, andblog member list in sidebar (require some HTML editing; see under the cut for instructions)
Unlimited custom links, plus a highlighted link under the title
Optional second palette
Customizable post width and font size
Optional search bar, like/reblog buttons, date/timestamps, tags (plus a show tags on click option), and Archive/Random links
Responsive
Supports new post types/pinned posts
And more!
For help, check my theme guide, or feel free to send me an ask. Theme credits and an HTML editing guide for the special sections are under the cut.
All of the below instructions assume that you’ve gone to your Customize page, then opened the “Edit HTML” menu.
Again, if you have trouble making your edits work, feel free to send me an ask or a DM for help.
Note for HTML beginners
Every bit of text or code is wrapped inside “tags”, which have arrow brackets on either side. For example, a paragraph is placed inside <p> tags. Every element has an “opening” and “closing” tag; the closing tag looks just like the opening tag, with a / after the opening bracket. The content inside one section is bracketed by these; for example, a paragraph would look like this:
<p>Text here!</p>
In the above line, <p> is the opening tag, and </p> is the closing tag. Tags of this sort can be placed inside each other:
<p>Some <span>special</span> text.</p>
Note that the “span” tags, both opening and closing, are both inside the “p” tags. You don’t want a misordered set, like “<p>Some <span>special text.</p></span>”. The opening tag nearest to the start should also have its closing tag nearest to the end.
It is extremely important that while editing the HTML for your theme, you make sure all opening tags have a matching closing tag. If you have a <div> tag, but no matching </div> tag, this might break the theme.
Featured posts
This section fetches the 3 most recent posts from a chosen tag on your blog. To select the tag:
Ctrl+F to “EDIT YOUR TAG HERE”.
On that line, there will be a link inside quotation marks, ending in “tagged=featured”.
Changefeatured to the tag of your choice; for example, “tagged=photo”. This tag can include spaces, such as “tagged=my writing”.
Save and ensure your posts show up as intended.
By default, the tagged posts are fetched from your blog, but you can change this so that the featured posts are from a different blog:
Ctrl+F to “EDIT YOUR TAG HERE”.
On that line, there will be a link inside quotation marks, starting with “https://{Name}.tumblr.com”.
Change{Name} to the blog username of your choice; for example, “https://starlightthemes.tumblr.com”.
Save and ensure your posts show up as intended.
Be careful not to change any other parts of that section. The code for fetching the posts from blogs is easy to break.
Updates section
The updates section has two editable parts: the title, and the actual updates.
To edit the title:
Ctrl+F to “EDIT HERE: UPDATES”.
Scroll a few lines down, until you find the line reading “<h2>Latest updates</h2>”.
Change “Latest updates” to say whatever you want. Make sure the text stays inside the <h2>…</h2> tags. For example, if you want the heading to read “My activity”, that line of code should read “<h2>My activity</h2>”.
To edit updates:
Ctrl+F to “EDIT HERE: UPDATES”.
A little under this line, you’ll see a template, with the outermost tags reading <div class=“update”>…</div>. If you’re adding a new update, copy this template.
Scroll a few lines down, until you find the line reading “<!– all updates below this line –>”.
Now, for each update, paste the template once over (two updates are present for you to start with), and edit three things: -> “3-LETTER MONTH HERE”: The first three letters of the update month, e.g. “Jan”. -> “2-DIGIT DATE HERE”: The two-digit version of the update date, e.g. “01” or “31”. -> “UPDATE TEXT HERE”: The actual text that’ll show up as the update.
Make sure that all the updates are separate- the starting <div class=“update”> and the ending </div> of two updates shouldn’t overlap.
Make sure all your updates are above the line reading “”<!– all updates above this line –>“.
Save and make sure things look how you want them to.
Members list
To change the title of the members section:
Ctrl+F to "EDIT HERE: MEMBERS LIST”.
Scroll a few lines down, until you find the line reading “<h2>Blog members</h2>”.
Change “Blog members” to say whatever you want. Make sure the text stays inside the <h2>…</h2> tags. For example, if you want the heading to read “The gang”, that line of code should read “<h2>The gang</h2>”.
Scroll further down, until you find the line that reads “<h2>{lang:Group members}</h2>”. Again, change this to your chosen title, such as “<h2>The gang</h2>”.
The actual members list can be customized in two ways. One, for group blogs, you can have it automatically fetch the blog members’ main blog names/titles/icons. To do this, turn on “Members list” and turn off “Custom members list” in the main theme settings.
The other option is to manually add any group members and their icons/links. This will also allow you to add customized names and descriptions for each member. To use this option, turn on BOTH “Members list” and “Custom members list”. Then:
Ctrl+F to “EDIT HERE: MEMBERS LIST”.
A little under that, you’ll see a template with the outermost tags reading <a class=“member” href=“//BLOGNAME.tumblr.com”>…</a>. If you’re adding members, copy this template.
Scroll a few lines down, until you find the line reading “<!– all members below this line –>”.
Now, for each member, paste the template (two members are present for you to start with) and edit three things: -> “BLOGNAME”: Next to “href” in the <a> tag, and next to “src” in the <img> tag. Change this to your member’s username, such as “starlightthemes”. -> “MEMBER NAME”: Takes the place of the username. This will show up in bold at the top. -> “MEMBER DESCRIPTION”: Takes the place of the blog title. This will show up at the bottom.
Make sure that all the members are separate- the starting <a class=“member” href=“…”> and the ending </a> of two members shouldn’t overlap.
Make sure all your members are above the line reading “”<!– all members above this line –>“.
Save and make sure things look how you want them to.
There’s no need for you to go through the code as everything that you need to key-in shall be provided via the Theme Options.
This theme is requested by King-Boo-Newdle as a celebration for my 100 followers in Tumblr. I will create a theme/page for free as an appreciation for my followers every time I reach another hundred.
Please like, reblog, and follow Phantasy Reign for more themes related matters!
different tab options: single muse, multimuse, rules. multiple images. different font size + fonts options. visible source link. best viewed on chrome.
— INFO:
by clicking the source link u’ll find the theme’s preview, sizes & links to get the code. if there’s any issue with the code please send me an im to help u with it. this is a PREMIUMTHEME.
— TERMS OF USE:
please don’t remove the credit. this is not a base code. do not take parts of the code without my permission. do not buy / use if i have u blocked. do not repost.
Edit and customise to your liking. Don’t repost/redistribute and/or claim as your own. Do not use as a base code. Leave the credit, thank you.
As always, explanations are in the code. I’ll be updating them from time to time. If you are having issues, take a look at this themes FAQ, or my general FAQ. Not finding anything? Shoot me a message. Please report any bugs to me.
An ‘all in one’ theme with tabbed links, profile, ask/faq and submit sections, featuring an optional ‘featured tags’ section with post count for 6 tags. It includes fully customisable colours, images, fonts & sizing.
The preview, customisation guide, credits & code can be found in the source of this post.
Pleasereblog/like if you use this theme! If you have any issues please don’t hesitate to message me!
The title of this theme as well as the images & lyrics in the preview are all from Uncover by Seulgi (Red Velvet)
![sheathemes:[ Ludic ] - preview | code [alt]Updated: 4/2/2022A slight revamp with a cleaner design wh](https://64.media.tumblr.com/a01b69ac5cdc0e46ca21e7e61996b6d5/da4510fca41973f4-84/s540x810/8ff658cd7f77562694ce124f1d9eea7b0950d1f4.png "sheathemes:[ Ludic ] - preview | code [alt]Updated: 4/2/2022A slight revamp with a cleaner design wh")
![sheathemes:[ Ludic ] - preview | code [alt]Updated: 4/2/2022A slight revamp with a cleaner design wh](https://64.media.tumblr.com/96b6db5b1d780f3b65bd83345c2ee03a/da4510fca41973f4-26/s540x810/a8e497a04a2cc702808667d103971e9dfbe80845.png "sheathemes:[ Ludic ] - preview | code [alt]Updated: 4/2/2022A slight revamp with a cleaner design wh")
![vitaminholland:[Premium] Theme — Crumble by vitaminhollandPreview/(7$) Payhip or Ko-FiFeatures:210x2](https://64.media.tumblr.com/506083281dd98581b67822b6abeedb33/a4f97c27abd8f9e8-a9/s1280x1920/798c511f0f9d1390e974b26c1bbd0fc9e62f5c76.png "vitaminholland:[Premium] Theme — Crumble by vitaminhollandPreview/(7$) Payhip or Ko-FiFeatures:210x2")
![vitaminholland:[Premium] Theme — Crumble by vitaminhollandPreview/(7$) Payhip or Ko-FiFeatures:210x2](https://64.media.tumblr.com/b3170b9b299ca5118fa6f095a7a0b66a/a4f97c27abd8f9e8-b4/s1280x1920/91a6a05bc1c24ac608916eeb0cbb18e16e2c8305.png "vitaminholland:[Premium] Theme — Crumble by vitaminhollandPreview/(7$) Payhip or Ko-FiFeatures:210x2")
![vitaminholland:[Premium] Theme — Raindrops by vitaminhollandPreview/Payhip (7$)Features:250x200px si](https://64.media.tumblr.com/3bd141b4e2acff145c1c1c0c9003bd2e/7ca471b9adb62241-b4/s1280x1920/228fd15f36fe23ed1a12f1124796a9acc429df3a.png "vitaminholland:[Premium] Theme — Raindrops by vitaminhollandPreview/Payhip (7$)Features:250x200px si")
![vitaminholland:[Premium] Theme — Raindrops by vitaminhollandPreview/Payhip (7$)Features:250x200px si](https://64.media.tumblr.com/3d15e73f39b707f0c45af360ee1e0673/7ca471b9adb62241-80/s1280x1920/2b594472a9ce22fc149b3973e3e119be016a43f6.png "vitaminholland:[Premium] Theme — Raindrops by vitaminhollandPreview/Payhip (7$)Features:250x200px si")
![vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature](https://64.media.tumblr.com/6f95c937dd1a8ac101b18d49cba879d0/1d3b33a479183bc8-bf/s1280x1920/b0baba707c796d60928e8315e746668bb6b90bc6.png "vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature")
![vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature](https://64.media.tumblr.com/fc94c1cf934f89aa0c0ac971ad11f288/1d3b33a479183bc8-2f/s1280x1920/8a16b8d6db850690a370c863c486aee22f57a504.png "vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature")
![vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature](https://64.media.tumblr.com/fe4af2e373f2092caecb74b73300c759/1d3b33a479183bc8-a6/s1280x1920/031a11a42366b08d77e57a6bf8d6e84f2afa86af.png "vitaminholland:[Premium] Theme — All These Flowers Bloom by vitaminhollandPreview/Payhip (5$)Feature")
![nonspace:Theme #09 : Spotlight [Preview] Blog. Good for text-heavy blogs.↳ [GITHUB] | [THEME GARDEN]](https://64.media.tumblr.com/7d6249226aed321af98a83bbd7989b86/ac108271cafcc7c2-ec/s1280x1920/ed066600456f490b1f98236ba4d06f328e980d88.png "nonspace:Theme #09 : Spotlight [Preview] Blog. Good for text-heavy blogs.↳ [GITHUB] | [THEME GARDEN]")
![vitaminholland:[Premium] Theme — A Little Too Soon by vitaminhollandPreview/Payhip (5$)Features:260x](https://64.media.tumblr.com/6e8c91fe8421332211bce668cf779255/ffc8129a102da14a-10/s1280x1920/ffd1d0cc0b7d229e54b2cc91050fac71c46b44e7.png "vitaminholland:[Premium] Theme — A Little Too Soon by vitaminhollandPreview/Payhip (5$)Features:260x")
![vitaminholland:[Premium] Theme — A Little Too Soon by vitaminhollandPreview/Payhip (5$)Features:260x](https://64.media.tumblr.com/f469d4420e67a2abfe39089796711430/ffc8129a102da14a-0d/s1280x1920/7e125aa63d741cbb0ea999de68b5e3a7d2df0940.png "vitaminholland:[Premium] Theme — A Little Too Soon by vitaminhollandPreview/Payhip (5$)Features:260x")
