#gfont

Theme 11 customization

Regarding the simpler fields:

"Secondary title" refers to the title just above the posts, under the header and navigation. This defaults to "[Total posts] Works in [Username]" when the field is left empty.

"Filtered tags" takes a comma-separated list of tags, entered exactly as they'd be written in the Tumblr post editor but without the hashtag. E.g. the tags #politics, #red and blue, and #green would be entered as "politics, red and blue, green" (make sure there's spaces, and no comma after the last item!). The filtering plugin will then put a warning message over any posts with those tags, along with a button letting you show the post.

"[Section] title" act as the headers for the corresponding section, if provided. "Custom links title" defaults to "Pages" if nothing is entered, and is used when the custom links are displayed on the navbar.

"Featured tags" takes a comma-separated list of tags, in the same format as Filtered tags. This field will display links to those tags, along with the number of posts in that tag on your blog, in the left sidebar.

The Recent posts section displays the 5 most recently posted/reblogged posts on your entire blog, displaying in the left sidebar. If you enter a tag under "Recent posts tag", it'll instead display the 5 most recent posts in that tag on your blog. Only 1 tag is allowed.

Rules and FAQ

Both these sections work the same way. Each new item, a rule or a question, consists either of one statement, or a statement and some more text, usually as an answer or additional note. E.g. the screenshot below shows three rules, where the last one has more text in the dropdown.

To create an item, prefix it with <li> . To add more text, create a <li> item and add a [more] label underneath, then write your extra text after that. To illustrate, here's the Customize page code for the above:

Updates

This section is similar to Rules/FAQ, though it flips the order around. After each <li>, first list the date, then add the [label] marker, then add your actual update. Again, here's an example:

And here's the Customize page code that created that:

Toggles

This section displays checked/crossed-out items, and uses a simpler version of the formatting for the above sections. Use <li> for each new item, then add [on] or [off] at the end, depending on whether you want it checked or crossed off. Here's an example:

And here's the corresponding Customize code:

Progress bars

This section also uses <li> items, where each item has two parts: the text label, and the number(s) for the progress percentages, put inside square brackets like with the other sections. Here's an example (note how the top two use fraction values while the bottom one uses a percentage):

And here's the code that made these. In short, the format is <li> Text here [##/##], or <li> Text here [##%], where ## refers to any number.

Social links in footer

The footer links, aside from the email and personal website fields, take usernames or user IDs for various websites. Be sure to check you're not entering a username in a user ID field!

The Email address field takes a standard email in the format [email protected] and adds a link to let people mail that address.

The Personal website fields will generate a link in the footer's Follow section. Personal website name is the human-readable text label for the generated link, and Personal website URL is the URL that will open when the generated link is clicked. Make sure to add https:// to the start of the personal website URL so the generated link doesn't just redirect you to a different part of your blog.

Credits

Layout and design by Archive of Our Own

Style My Tooltips by malihu

Phosphor Icons

Expanded Tumblr localization and NPF photosets plugin by codematurgy

Custom audio posts by annasthms

Tag filtering by glenthemes

Palette toggle by eggdesign

Image options

There are various options for avatar and background images. For avatars:

No avatar: Turn off "Show Avatar" and remove the LM Avatar image.

Single avatar on both light/dark modes: Turn on "Show Avatar" and upload a default avatar.

Different avatar on light and dark mode: Turn on "Show Avatar", upload a default avatar, and upload the LM Avatar image.

Avatar only on one color mode, but not both: Turn off "Show Avatar" and upload the LM Avatar image. (The avatar will only show on "light" mode.)

And similarly, for background images:

No background images: Remove the Background image and remove the LM Background image.

Single background image on both light/dark modes: Upload the Background image.

Different background image on light and dark mode: Upload the Background image and the LM Background image.

Background image only on one color mode, but not both: Remove the Background image and upload the LM Background image. (The background image will only show on "light" mode.)

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 NOT to 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.

Tag filtering

In the Customize menu, scroll down until you find the text input field labelled "Filtered tags". By default, this is set to "spoiler, spoilers" (without the quotation marks). In this list, you can enter whatever tags you want to filter exactly as you'd write them in the Tumblr post editor, without the hash. Separate each new tag with a comma and a space.

For example, if I wanted to filter the tag #politics, i would simply write "politics". If I also wanted to filter #red and #green, I would now write "politics, red, green". Note that the last tag does not have a comma after it, and that spaces must be included!

Credits

Layout inspired by stuffandsundry, with permission

Style My Tooltips by malihu

Phosphor Icons

Custom like buttons by Demirev

NPF photosets plugin by codematurgy

Palette toggle by eggdesign

Custom audio posts by annasthms

Tag filtering by glenthemes

Scroll to top script by Fabian Lins

Images used in the preview:

Tiles: Green (title tape), pink (tape 1), yellow (tape 2), blue (tape 3)

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.

Credits:

Tippy.js tooltips by atomiks

Cappuccicons by Suiomi

Dark/light mode toggle by eggdesign

Scroll to top by Fabian Lins

Tag filtering

In the Customize menu, scroll down until you find the text input field labelled "Filtered tags". By default, this is set to "spoiler, spoilers" (without the quotation marks). In this list, you can enter whatever tags you want to filter exactly as you'd write them in the Tumblr post editor, without the hashtag. Separate each new tag with a comma and a space.

For example, if I wanted to filter the tag #politics, i would simply write "politics". If I also wanted to filter #red and #green, I would now write "politics, red, green". Note that the last tag does not have a comma after it, and that spaces must be included!

Credits

Layout inspired by stuffandsundry, with permission

Style My Tooltips by malihu

Phosphor Icons

Custom like buttons by Demirev

NPF photosets plugin by codematurgy

Palette toggle by eggdesign

Custom audio posts by annasthms

Tag filtering by glenthemes

Scroll to top script by Fabian Lins

Images used in the preview:

Dark mode: Avatar, header, sticker, red (tape 1), orange (tape 2), pink (tape 3), magenta (accent tape)