this one's from option 3 (the javascript toggle) in the view more button tutorial! the original code snippet used document.querySelector(".vm-post"), and querySelector (singular) always grabs the first matching element on the whole page and stops there, it has no idea you have more than one .vm-post. so no matter which button you click, it's always the very first post's .vm-more that gets toggled.

the fix is to loop over every .vm-post on the page instead of grabbing just one, so each post finds and controls only its own button and its own hidden content:

document.querySelectorAll(".vm-post").forEach(function (post) {
  const more = post.querySelector(".vm-more");
  const toggleBtn = post.querySelector(".vm-toggle");

  toggleBtn.addEventListener("click", function () {
    const isOpen = more.style.maxHeight;

    if (isOpen) {
      more.style.maxHeight = null;
      toggleBtn.textContent = "view more ↓";
    } else {
      more.style.maxHeight = more.scrollHeight + "px";
      toggleBtn.textContent = "view less ↑";
    }
  });
});

querySelectorAll(".vm-post") collects every post into a list, and .forEach then repeats the same setup once per post in that list. inside the loop, post.querySelector(".vm-more") and post.querySelector(".vm-toggle") are called on that one post rather than on the whole page, so each post's button only ever finds the .vm-more that's nested inside that exact same post, never a different one further down the page. i've updated the tutorial itself with this version plus an explanation, so copying the code from there now will already have this fixed ♡

that's such a great question! thank you for valuing my opinion on this matter and seeking advice with me. i thought about just writing a quick guide for this topic, but i do find it very important and decided that it deserve its own page, delving deeper into the subject instead of just giving you a generic list of do/don't. here is all the advices i would like to give to any beginner that has just joined this world ♡ i'll probably update it later if i think of anything else to add, but i tried covering all of your concerns + everything i would've liked to known when i was also just a beginner. i hope that helps!

my go-tos are pinterest and tumblr! just search for "{color you want} background", so something like "pink background" or "blue background", and you'll get tons of results to scroll through.

i also recommend searching "sozai" right here on neocities itself. a lot of artists share their own f2u materials under that term, backgrounds included, so it's a great way to find stuff made specifically for personal sites like ours ♡

you can, technically! but i'd actually recommend the opposite: instead of merging your css into one file, put your css files into their own folder, something like /styles. that alone cleans up your dashboard just as much, without any of the downsides of one giant combined file.

a single huge css file gets hard to search through, and once it gets long enough it can even get slow to open and edit in the neocities editor. splitting it into a few smaller files (one for layout, one for colors, one for animations, etc) keeps each one focused and easy to find your way around.

i wrote a full tutorial on this exact setup, folders for every file type, how to link more than one css file to a page (and why the order you link them in matters), plus how to use comments to organize sections within a single css file: organizing your files. hope that helps, thank you for asking! ♡

it does loop here on my end, so nothing's broken! this is almost always because of a reduce motion accessibility setting turned on somewhere on your device. i actually go over this in the news ticker tutorial itself, at the very end (which is easy to miss, so i got you!): the ticker (and every other animation on this site) respects prefers-reduced-motion, a setting the browser reads straight from your operating system. if it's turned on, the animation is intentionally switched off instead of scrolling anyway.

that's also why it varies per device! it isn't a browser bug or a screen size thing, it's tied to a personal accessibility preference, so it can be on for one visitor and off for another even on the exact same page.

you can check/toggle the setting here:

• windows: settings → accessibility → visual effects → animation effects
• macos: system settings → accessibility → display → reduce motion
• ios: settings → accessibility → motion → reduce motion
• android: settings → accessibility → remove animations

so it's working as intended! if a visitor has that setting on, respecting it (instead of forcing the ticker to scroll anyway) is the whole point ♡