WA Toolbox

WA users' tips & tricks on how to do stuff


 

Quickly set visibility on articles


  Go to https://www.worldanvil.com/world/article/list?order=access. You can toggle all the important flags from this page.
 

Images only visible to players


  You want to embed images into articles, but you have them from a campaign you bought or somewhere else and don't want to make them visible to everyone:
 
    • Go to your article
    • Add a secret from the "secrets" tab
    • Insert the image into the secret
    • Make the secret visible to a subscriber group that contains all your players
    • Grab the secret ID and insert it into the article where you want it to be shown

  You and your players will see the page including the image, everyone else will only see text but not the image. To make the image or text blocks you hide like this fit better into the page, add a following css code:
 
.user-css-secret h5 { display: none }
.user-css-secret { margin: 0px 0px 0px 0px }

  The first line hides the title of the secret, the second one removes the indent.
 

Add some border and background to a block


 
.aloud-creepy {
  margin: 10px 0px;
  padding: 0;
  color: #fff;
  background-color: #000000;
  border-style: solid;
  border-width: 30px;
  -moz-border-image: url(URLHERE) 10% 10% 10% 10% repeat;
  -webkit-border-image: url(URLHERE) 10% 10% 10% 10% repeat;
  -o-border-image: url(URLHERE) 10% 10% 10% 10% repeat;
  border-image: url(URLHERE) 10% 10% 10% 10% repeat;
  background-clip: padding-box
}

  and then write the text like this:
 
[container:aloud-creepy]
Text block here.
[/container]

 

Show links to existing and non-existing articles in different color


 
.user-css a, .user-css a:focus, .user-css a:hover, .user-css-extended a, .user-css-extended a:focus, .user-css-extended a:hover {
  color: #3368ff
}
.user-css a.text-danger, .user-css a.text-danger:focus, .user-css a.text-danger:hover, .user-css-extended a.text-danger,
.user-css-extended a.text-danger:focus, .user-css-extended a.text-danger:hover {
  color: #cd110e
}

 
 

page individual background

This requires Grandmaster Status To add a page-specific backgrounds, follow these three steps.
  1) Upload the Image to WA.
  2) Somewhere, anywhere on the page in question, add:
[container:myBackgroundImage] [/container]

  The class name is entirely yours to choose.
  3) Go to Article Editor -> Styling -> Article CSS and add:
 
.user-css .myBackgroundImage{
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100vw;
  background: no-repeat center/100% url(ImageUrl.png
  background-size: cover;
  display: block;
  z-index: -1;
}

  Where ImageUrl is the URL of the uploaded image.
  Alternatively: To do this on a world level: Put the BBCODE in the Global Copyright Footer of your world config. Pur the CSS in your world's CSS in the world config.
  Alternatively: To do this on select articles: Do the same as the above, but change the CSS selector to .user-css.showMyBackgroundImage .myBackgroundImage and on articles you want it to appear on, go to Article Editor -> Styling -> Additional CSS Classes and add showMyBackgroundImage

Comments

Please Login in order to comment!
Powered by World Anvil