More in depth guide to CSS styling | World Anvil

More in depth guide to CSS styling


Remove these ads. Join the Worldbuilders Guild
Go back to the Voting Board

More in depth guide to CSS styling

Feature Upgrade · Access management (subscribers/authors) · Created by Elisa R
accepted
CSS Tutorial

What functionality is missing? What is unsatisfying with the current situation?

It takes a long time for people who have access to the CSS features (but who haven't used them before) to figure out what they are doing. It would be really helpful if there were more, concrete examples, maybe even a video tutorial, that walks people through the basics. The tutorial page on CSS simply isn't enough to figure out how to do most of what we want to do.   For example, I spent probably 2 hours working on the CSS for my campaign page for one character before figuring out how to change the font color in different boxes. It really is a cool feature that I want to be able to make use of, but it's highly unwieldy for those who are not experienced.  

How does this feature request address the current situation?

An additional tutorial that goes more in depth into the CSS on specific pages, or even on how to find certain blocks and change them would help everyone better style and improve their world anvil! Dramatically more people will take advantage of the CSS and their pages will become much more individualized.  

What are other uses for this feature request?

CSS tutorial can be applied to any section of the content that has custom CSS options.

The Team's Response

Hello! Thanks for submitting this idea (which is not technically a feature request!), and to all who considered and voted on it. The community team are excited to take on this challenge, but please be aware we cannot teach you all of CSS that exists ever - it's just too much! We will be happy to provide resources for styling on World Anvil both without CSS, and a beginners guide to broaching some simple CSS styling on World Anvil. Janet
Login to Vote
Current score

56/300 Votes · +11108 points

Votes Cast

  • +300

    by Hatwolf
    on 2023-08-01 09:27

  • +300

    by puerknight
    on 2023-07-31 21:29

  • +100

    by morganarcher
    on 2023-07-30 21:46

  • +100

    by Gaëlle S.
    on 2023-07-30 20:41

  • +300

    by CozyChicken
    on 2023-07-30 06:34

  • +300

    by AveioA
    on 2023-07-29 22:44

  • +300

    by Tome2Table
    on 2023-07-29 16:27

  • +300

    by epicname
    on 2023-07-29 14:07
    A complete documentation of the CSS would be extremely helpful, to include the CSS for pop-up windows / tooltips.

  • +300

    by NerisGray
    on 2023-07-28 12:20

  • +300

    by RueMarr
    on 2023-07-28 10:20

  • +300

    by BenScerri
    on 2023-07-27 08:25
    Even just examples of / templates for different organisational styles would be great. There are so many stunning WAs out there, but I have no idea where to even begin looking at how they've been made, and the Discord is as folks in the comments have said...

  • +300

    by worlds-of-wicker
    on 2023-07-27 08:03

  • +1

    by SebGreg732
    on 2023-07-27 03:39

  • +300

    by A Wild Mimic
    on 2023-07-27 01:37

  • +300

    by that_guy04
    on 2023-07-27 01:31

  • +300

    by A Glamorous Elf
    on 2023-07-26 11:35
    I am 100% in support of having more availability and community supported guides / tutorials on how to personalise our worlds to make them as beautiful as we envision them to be. Having tried to seek help and advice from the official discord on a number of occasions and being either ignored or pointed to the one official guide that (is great for the bare basics but not much more) it has left the feeling resources like this are being gate-kept by individuals who want to monetise CSS and customisation, especially for those who already pay for the tiers it would be really beneficial to provide active support so more people feel they are able to fully utilise what they are paying for without having to pay third parties just for advice.

  • +300

    by Hasmed
    on 2023-07-26 09:28

  • +1

    by SerSkywell
    on 2023-07-26 03:26

  • +100

    by Jherden
    on 2023-07-25 20:29

  • +300

    by Rayna Fairbell
    on 2023-07-25 16:14

  • +300

    by ampharosy
    on 2023-07-25 00:17

  • +100

    by SyntaxChick
    on 2023-07-24 17:22
    CSS is bigger than WA, that being said I think it would be great to have a list of common/useful element types people can grab and drop in their own worlds.

  • +300

    by DRMDStory
    on 2023-07-24 00:03

  • +300

    by Zyquis
    on 2023-07-23 18:07

  • +100

    by restlessGalaxy
    on 2023-07-23 07:18

  • +1

    by Blossom Tree Art
    on 2023-07-23 03:58

  • +300

    by Fizzybrat
    on 2023-07-21 22:37

  • +300

    by A Adorable Mlem
    on 2023-07-21 15:29

  • +300

    by prestonthedm
    on 2023-07-19 15:32

  • +100

    by R. R. LoreCastle
    on 2023-07-19 03:10

  • +300

    by HunterChristmas1247
    on 2023-07-18 20:35
    I believe that CSS inside and outside WA are two different things.   If video(s) showed what was possible for CSS on WA, then maybe we could ask people on Discord or on Reddit.   Discord has a CSS channel I think.

  • +100

    by ClarissaGosling
    on 2023-07-18 09:57
    Not sure it is really WA's role to teach us CSS, but as another newbie I'd love to see examples of what is possible. Showcasing other people's worlds/articles to demonstrate how things can be done.

  • +300

    by namako
    on 2023-07-18 08:04

  • +100

    by PoppaeaSabina
    on 2023-07-18 01:39
    @A Mischievous Mlem -- No, technically WA doesn't have an obligation to teach anyone CSS -- but CSS is a big part of what makes the higher subscription tiers worth the money, and more people would PAY for those tiers if they felt confident in using the feature. I think it would benefit WA in the form of more higher-tier subscriptions.

  • +300

    by Slylock
    on 2023-07-16 15:46

  • -100

    by A Goodhearted Kobold
    on 2023-07-16 12:55

  • +1

    by Vibeca
    on 2023-07-15 23:28

  • +300

    by joshallentaylor
    on 2023-07-15 22:19

  • +100

    by GreeneDragon
    on 2023-07-15 18:59

  • +100

    by calsemplowski
    on 2023-07-15 12:00

  • +300

    by iSUKatKnives
    on 2023-07-15 04:52

  • +1

    by A Glamorous Elf
    on 2023-07-14 09:18

  • -1

    by A Mischievous Mlem
    on 2023-07-13 19:12
    you can't expect WA to teach you CSS

  • +1

    by tjtrewin
    on 2023-07-13 18:50

  • +300

    by lkmorris
    on 2023-07-13 18:15

  • +300

    by TheREALHayster
    on 2023-07-13 11:10

  • +100

    by A Filthy Orc
    on 2023-07-13 10:14

  • +100

    by Willow H.R. Harper
    on 2023-07-13 09:14

  • +100

    by TheArchitectSol
    on 2023-07-13 05:45

  • +300

    by Ratha
    on 2023-07-13 03:58

  • +1

    by rmckey
    on 2023-07-13 03:54

  • +1

    by A Glamorous Cthulhu
    on 2023-07-13 03:45

  • +1

    by Nuria-age
    on 2023-07-12 23:56

  • +300

    by ss2020
    on 2023-07-12 21:03
    I'd really like to see a list of how to address all the different article elements. F12 is only slightly helpful.

  • +300

    by A Revolutionary Skeleton
    on 2023-07-12 20:36
    A more in-depth tutorial for specifics on World Anvil pages would have been (and would still be) very helpful to me. Looking at CSS information off-site was only so helpful to be honest, because of how unfamiliar I am with all of it... transferring the principles from off-site to World Anvil specifically felt like 100% guesswork with constant trial and error, and I still don't really understand why some things I did worked as intended and others didn't, which means I'll struggle to change them in the future. I'm not expecting World Anvil to teach me CSS, but more so what OP's suggestion mentions: Concrete examples of how to change specific things on World Anvil pages, how to find certain blocks and what you'd do to change those specifically, etc.

  • +300

    by A Wild Dragon
    on 2023-07-12 16:19

  • +300

    by Elisa R
    on 2023-07-12 13:28

Find your way!

Resources

WHO WE ARE

LEGAL

Get the news

Listen to our Podcast

Our Allies

Dungeon Fog
Gold Ennie 2019 for Best Digital Aid
by 3 Armored Kittens · Prodromos v.1.1 - World Anvil 0.9.15.009 © 2017-2024 [en] | Anvil Time: 12:27, May 2 2024