#npf posts | Explore Tumblr Posts and Blogs

eggdesign · 7 months

Text

A lot more progress on my npf friendly blog playlist thing

I'm sure other similar ones are out there (or old ones being updated hopefully) but it's nice to do a little react project for fun again.

#audio posts #npf posts #i dont really know if i want to tag this as anything but #egg updates

52 notes · View notes

eossa · 7 months

Text

Tutorial: Fixing Photosets

A problem I was facing with the base code* by @eggdesign (thank you very much for providing us with the code!) was that sometimes NPF photosets would not behave the way I wanted them to.

After consulting with members of the w3schools discord sever, Alexander kindly provided me with a script solution for wrapping the individual rows (.npf_row) into a container. The demo of the solution can be found here.

I will place the full tutorial after the read more so it will not clog up people's dashboards.

Wrap the following code into <script> tags and add it at the bottom of the base code, I put it after the script that initializes the posts.

const content = document.querySelectorAll(".reblog-content"); let sections = []; // initialize empty array it'll be useful later ! let temp_array = [] // will also be useful

// We will re-create all the div "reblog-content". function removeAndReplace(content_div){ content_div.replaceChildren(); let idx = 0; for(const array_containing_the_arrays_of_child_nodes of sections){ const div = document.createElement("div"); array_containing_the_arrays_of_child_nodes[0].classList.contains("npf_row") ? ++idx : null; for(const child_nodes_array of array_containing_the_arrays_of_child_nodes){ if(!child_nodes_array.classList.contains("npf_row")){ content_div.appendChild(child_nodes_array); } else { div.appendChild(child_nodes_array); } } div.classList.add(`npf_photoset`); div.children.length <= 0 ? null : content_div.appendChild(div); } sections = []; }

y();

This solved the issue with NPF photosets consisting of multiple rows.

However, there were two issues that were not fixed by this solution: (1) Photosets with just one row and (2) photosets where Tumblr broke the set into a photoset and a single figure remained unaffected by changes made to the wrapper class .npf_photoset.

For the single row sets, the solution is to pick only the row using CSS

.npf_row:only-of-type

and giving this the same style you would give to the .npf_photoset wrapper.

For the second case, the issue can be resolved by using the following CSS (example with border radius):

.npf_photoset:has(+figure) { border-radius: 1rem 1rem 0 0; } .npf_photoset + figure { border-radius: 0 0 1rem 1rem; overflow: hidden; max-width: fit-content; }

Make sure to add the "overflow: hidden;" and "max-width: fit-content;" to your photoset container class so that images that do not fit the whole width of the post are targeted as well.

And that's it! This should solve the issues with the NPF photosets.

---------

* I'm using the reverse compatible base code that also supports legacy style posts.

A big thank you to @mournstera as well for checking out the photosets with me and pointing me towards issues I had not considered!

#eossa #tutorials #npf posts #coding #theme maker #blog #my tutorials #tut: fixing photosets #i hope this is helpful for some of you out there!

25 notes · View notes

april · 6 months

Text

This... is a Tumblr post.

Dear god.

There's more.

No!

#TF2 #recycled from a post i made on 13th July 2014 #recreated in NPF for your interactive viewing pleasure

4K notes · View notes

cal-kestis · 7 months

Text

gojo being so unserious ¯\_(◕–◕¬)_/¯

1K notes · View notes

glenthemes · 10 months

Text

🎧 NPF audio player ⋆

On Tumblr's process of changing everything to NPF, staff has added metadata (details) to NPF audio inserts to reflect what was originally entered when it was posted. Unfortunately, they're unstyled for now, so I wrote a plugin that mimics the appearance of Tumblr's legacy audio player.

☆ Features:

functional play/pause buttons with customizable sizes and colors

[optional] preceding labels, e.g. "Track:" / "Artist:" / "Album"

[optional] placeholder text for empty fields, e.g. "Untitled Track"

shows album cover image if its comes with one, with customizable dimensions

customizable player padding and background color

☆ How to install:

https://gitlab.com/tmblr-npf-audio/s#preview

#tumblr bullshittery #npf #tumblr update #audio #resources #utility #my addons #also I have gotten the forced NPF editor now. this post was unfortunately made with NPF

877 notes · View notes

userbru · 1 year

Text

With staff’s plans to remove the legacy editor and make the beta editor default, I know there’s been a lot of gifmakers like myself stressing out over how that’s gonna make our gifsets look on desktop. BUT thankfully since this is kind of a thing theme makers have been aware of for a while now and with a fix created by @glenthemes, here are some of my themes that support gifsets made with the beta editor:

theme 34

theme 33

theme 32

theme 31

theme 30

theme 29

theme 28

theme 27

theme 21

theme 20

theme 19 (both versions)

theme 18

theme 17

theme 16

theme 14, theme 10, theme 7 (links and previews on my masterpost for the terminated blog)

I hope this is a helpful list!

please consider supporting me on ko-fi!

i am also open for commissions <3

#theme #tumblr themes #masterpost #npf fix masterpost #*#considering remaking some of my old themes since i need to make a new personal base code #so!!! will keep yall posted on what i decide #but for now these themes are good to go :)

581 notes · View notes

wip · 1 month

Note

One of the things I enjoyed about the mobile app was how it used to let you format posts through HTML or Markdown coding. Would it be possible to bring it back? It's kinda weird that the NPF Editor is used on all different platforms, but HTML and Markdown are exclusive to desktop and the mobile website.

Answer: Hey there, @violetganache42!

Sadly, we are not going to bring it to the mobile apps. While we understand that it can be handy to a few people, we are sorry to say it is not handy enough, to not enough folks, to warrant prioritizing that work now.

Should this ever change, however, you will find this at the usual channels: here or over at @changes.

#feature #posting #HTML #markdown #NPF #mobile #your suggestions

50 notes · View notes

ktzart · 11 months

Text

sadie outfits :)

#oc #sadie #art #adding a :) to conceal the fact that i am so fucking furious about having to make my first NPF art post on this blog lol #they took the legacy post editor from me.#original #unseelie #character uses she/her

232 notes · View notes

demo · 11 months

Text

12 surprising clickbait titles that work

Gotcha! While you’re here, check out some of this text formatting.

Bigger text ✨

This is bold, and this is italics. This is strikethrough. (I'm whispering this in small text.) This is not a suspicious link at all. This text is colourful!

This is a bulleted list.

I can add text formatting here too.

We take a break here to enjoy Lucille.

This is a numbered list.

It’s where you list items.

And numbers appear next to them.

Groundbreaking.

As one person once said:

Look at me, I'm an indented block!

I'm a quote block! Someone definitely said this at some point.

Juliet: What is this? Romeo: I think we've been summoned for an example chat post again. Juliet: Not again...

We have reached the end. Or have we?

Remember to stay hydrated, and follow @changes for Tumblr updates! 💖

You're a curious one, aren't you. Enjoy this potato as a reward.

#npf post #text #gif #read more #chat #quote

196 notes · View notes

lesbianashleywilliams · 1 year

Photo

文豪ストレイドッグス - DEAD APPLE

「 Do you know when it's all right to chicken out and go home? There is no such time. 」

#*posts #*bsdeps #bsdedit #hyeahbsd #Bungou Stray Dogs #Bungou Stray Dogs Dead Apple #Bungou Stray Dogs: Dead Apple #anisource #flashing gif cw #usergojoana #useradrienne #my crap #this isn't very good but i HAVE to get season 3 done before the 4th of next month #i almost uploaded this in the new post format but omg i hate NPF for photosets!!!!!

473 notes · View notes

a-dream-seeking-light · 4 months

Photo

sick fucking blade runner half-sheet style poster edit from ultrakillblast’s twitter.

tried to find their tumblr post of this locally @ultrakillblast cuz they’re a fave follow but only found the screencap post they worked from which i’ll be reblogging at some point later.

#blade runner #movie poster #fan edit #harrison ford #rick deckard #daryl hannah #pris #cyberpunk #tech noir #ridley scott #screencap #ultrakillblast #looks like they’re sadly semi-active on here these days #even if this were posted on here #it’s likely i would have reposted it anyway #cuz it would be in npf #as this is a legacy post format blog

30 notes · View notes

eggdesign · 1 year

Text

If anyone has any NPF posts that usually get really messed up for them on their themes, please send them to me so I can test them! This would mainly apply to photosets, posts with a lot of different blocks, or with heavy formatting like with rp blogs.

I intend for the code I'm working on to be completely compatible with old and new posts (and maintaining the old photo post styling with the caption underneath the main photo or photoset) and I don't want to miss any scenarios.

#npf posts #hmmm what do i tag this with #custom themes #?#rp theme #??#just to get the word out there

63 notes · View notes

eossa · 4 months

Text

Calliope

Theme 46 by @eossa

A responsive and minimal theme with text-heavy blogs in mind. Comes with a featured posts section, dark mode, options to disable right click and copy+paste, and many other features.

This theme has been updated to support Tumblr's new post format (NPF) and some new post types.

See a live preview here.

→ Get the code: buymeacoffee | ko-fi | payhip

For more information, especially regarding customization and resources, please follow the source link or click here.

96 notes · View notes

burningblake · 11 months

Text

whoah whoah ok, I just fixed my blog theme to properly show both new editor, old editor, reblogged and original photoset posts properly. I used the fix by @glenthemes but unfortunately that only fixed reblogged posts for me. To fix original posts, I tried a very unorthodox trick, but it works so, here:

Search for {block:Text} in your theme.

Within {block:Text} and under {block:NotReblog}, add source-head class to the wrapper, just like in the case of reblogged posts. I know, "but there's no source in original posts", you'll say, except we won't put a source, simply trick the code to think that there is one, and then instead of adding a source icon and url, we'll—

Add an img-src of a thin transparent line before the caption body, that is between the > sign and {Body}. I uploaded one here if you wanna use mine, but you can always simply upload your own on an image hosting site (I used imgbb): https://i.ibb.co/Ry1HdN2/transparentline.png

Example code:

edit: I realized that not everyone might understand what I'm going on about here since all themes are different, but essentially what this fixes is the photoset margins. Basically, if your theme has a special layout for photosets, new-editor photosets will mold into that layout, instead of appearing as they would in text posts, hope that helps

#new editor #themes #legacy editor #npf post #new post format #new post editor #i'm not aware if there have already been fixes to this so let me know if there are #userbulbul

94 notes · View notes

bluesroleplay · 11 months

Text

CSS Code for those who run photo/image/aesthetic blogs

If you’re concerned about the image quality of image posts created in the NPF editor being distorted on your blog theme (particularly if it’s important for you for small/medium images to remain being in the original size resolution), then be sure to add this CSS code to your theme HTML:

.npf_col:only-of-type img { height:auto!important; }

.tmblr-full img { width:auto!important; } </style>

Thanks to @glenthemes for the assistance. For a more comprehensive code that also includes having image posts created in the NPF editor be rendered as image posts on your blog theme (among other stuff), check out their post here. If you need further assistance, their Discord channel is located at the bottom of that post. They are very helpful.

Note: This probably only works on single-column themes.

#theme help #npf #npf post #css #css help

49 notes · View notes

komanda · 7 months

Text

Внимание: разработчикам тем и настройщикам блогов в веб-версии

Мы существенно обновили нашу справочную документацию по пользовательским темам, чтобы помочь вам в создании тем, поддерживающих формат NPF и пользовательский интерфейс невложенных реблогов.

Что нового:

Пример разметки темы, включающий наш пользовательский интерфейс невложенных реблогов.

Обновлённый раздел "Реблоги" с объяснениями и примерами, как использовать в темах интерфейс невложенных реблогов в поддержку старого представления в виде блочных кавычек.

Разъяснение, как поддерживается NPF с помощью переменных темы.

На случай если вы пропустили: мы пополнили нашу коллекцию тем NPF-совместимыми темами (они помечены красной звёздочкой).

Хотите узнать больше о настройке темы блога в веб-версии? Ознакомьтесь с нашей справочной статьёй.

Узнайте больше о том, как отправить собственные ��емы в нашу коллекцию тем, чтобы другие могли приобретать их и использовать. Не забудьте перед этим ознакомиться с нашими Правилами отправки тем! Мы с нетерпением ждём ваши творения.

Чтобы сообщить об ошибке или запросить функцию, отправьте заявку в нашу службу поддержки.

#служба поддержки tumblr #обновление tumblr #обновление документов #пользовательские темы #neue post format #формат npf

40 notes · View notes