Jump to content

"Ugh I need to update my character's Wiki"


Recommended Posts

  • Replies 441
  • Created
  • Last Reply

Top Posters In This Topic

I did a quick update on Kage's wiki but I can't figure out how to aesthetically keep the artwork nice and pretty ; ; while still not making the page ginormous.

I'm having a similar problem in that the layout is in such a way that when I add photos, it knocks the layout around in weird places x.x...

 

Getting images to lay properly is really frustrating on wiki pages sometimes. There's a couple ways of doing it though, that give you a bit of control. The simplest is:

 

[[File:Garlemald_Flag.jpg|thumb|left OR right|frame OR frameless|Text below image]]

 

But this doesn't give you a lot of control. So another option is to use the class toccolours on a table. Rather than a lecture on code, I'll just post helpful examples. The following creates a table with a title, a picture, & text.

 

The stuff you'll want to change is in the "style" line. "Float" lets you choose alignment, "Margins" are the margins, "background" is the color (either of the box or the bar) in hex code (look up hex colors), font-size is self explanatory, & the 200px after the image is the image size. Other ones that work, for example for text, are "font=" and "color=". Just separate them by a semicolon as shown. This table is horrible looking, to show some of the styling:

 

{| class="toccolours" style="width: 25em; float: right; margin-left:2em; margin-right:0em; margin-bottom:2em; background:#ffcccc" cellspacing="2"
! colspan="2" style="font-size:110%; background:#8DB6CD" | '''Image Box Title'''
|-
! colspan="2" align="center" | [[image:Garlemald_Flag.jpg|200px]]
|-
! colspan="2" align="center" style="font-size:130%" | ''Text Regarding Image''.
|-
|}

 

Here's another example that places just an image, without a background box or border. You can see in the first "style" line where I added border:none & background:transparent

 

{| class="toccolours" style="width: 0em; border:none; float: right; margin-left:2em; margin-right:0em; margin-bottom:2em; background:transparent" cellspacing="2"
! colspan="2" align="center" | [[image:Garlemald_Flag.jpg|200px]]
|}

 

Finally, images like this can be moved, but the text will just wrap around it. But most people want the next section to fall completely below the image (instead of the image overlapping sections on the side). To do that, at the bottom of a section with an image, place the line:

 


 

Hope that helps a little.

Link to comment

I did a quick update on Kage's wiki but I can't figure out how to aesthetically keep the artwork nice and pretty ; ; while still not making the page ginormous.

I'm having a similar problem in that the layout is in such a way that when I add photos, it knocks the layout around in weird places x.x...

 

Getting images to lay properly is really frustrating on wiki pages sometimes. There's a couple ways of doing it though, that give you a bit of control. The simplest is:

 

[[File:Garlemald_Flag.jpg|thumb|left OR right|frame OR frameless|Text below image]]

 

But this doesn't give you a lot of control. So another option is to use the class toccolours on a table. Rather than a lecture on code, I'll just post helpful examples. The following creates a table with a title, a picture, & text.

 

The stuff you'll want to change is in the "style" line. "Float" lets you choose alignment, "Margins" are the margins, "background" is the color (either of the box or the bar) in hex code (look up hex colors), font-size is self explanatory, & the 200px after the image is the image size. Other ones that work, for example for text, are "font=" and "color=". Just separate them by a semicolon as shown. This table is horrible looking, to show some of the styling:

 

{| class="toccolours" style="width: 25em; float: right; margin-left:2em; margin-right:0em; margin-bottom:2em; background:#ffcccc" cellspacing="2"
! colspan="2" style="font-size:110%; background:#8DB6CD" | '''Image Box Title'''
|-
! colspan="2" align="center" | [[image:Garlemald_Flag.jpg|200px]]
|-
! colspan="2" align="center" style="font-size:130%" | ''Text Regarding Image''.
|-
|}

 

Here's another example that places just an image, without a background box or border. You can see in the first "style" line where I added border:none & background:transparent

 

{| class="toccolours" style="width: 0em; border:none; float: right; margin-left:2em; margin-right:0em; margin-bottom:2em; background:transparent" cellspacing="2"
! colspan="2" align="center" | [[image:Garlemald_Flag.jpg|200px]]
|}

 

Finally, images like this can be moved, but the text will just wrap around it. But most people want the next section to fall completely below the image (instead of the image overlapping sections on the side). To do that, at the bottom of a section with an image, place the line:

 


 

Hope that helps a little.

You are seriously the best. After my chores tonight I might tinker with this. Thank you so much!

Link to comment

My wiki page updates are a bit sporadic but they tend to update whenever Inessa develops a significant connection with another character or something big happens and things about her change.

 

Either way, my wiki is up-to-date at any rate, partially because whenever im ready to start RPing for the day, everyone is off doing trials and stuff. Note that I am ready to RP at about 9:30pm and finish RP at 11:30 so if anyone wants to involve me in something then send me a /tell because im not doing anything yet apparently RP wise in my FC.   ._.

 

EDIT: Also, if anyone can help explain to me on how to paste a picture of my character on my wiki without it taking it 500% of the entire screen then that would be helpful. I tried it on my own and failed miserably. Dx

Link to comment

EDIT: Also, if anyone can help explain to me on how to paste a picture of my character on my wiki without it taking it 500% of the entire screen then that would be helpful. I tried it on my own and failed miserably.   Dx

 

Use the following:

 

[[File:IMAGE_NAME.EXTENSION|###px|left OR center OR right|frame OR frameless|Text underneath image]]

 

The ###px section (ie 100px) will control size of the image. If you want something more complicated, but with more control, I posted some examples a few posts up.

 

If you're using the infobox template, and trying to put it in there, add the image lines shown below.

 

{{Infobox-character
| name = Character Name
| image = IMAGE_NAME.EXTENSION
| imagewidth = ###

Link to comment

That's a convenient reminder for everyone working on pages -- the "image" parameter of the Infobox template just wants a file name. Don't put a full image link there or you'll mess it up. If you want to resize the image from its basic 250px wide setting, put the number (and just the number) of pixels in the "imagewidth" parameter.

 

Other than moving pages out of the user namespace into the main namespace, "infobox image correct" is like... the number 1 minor edit I make on pages when I'm doing RC patrol. :)

Link to comment

Thats still pretty confusing and im having alot of trouble with it. Mind giving a cleaner and more thorough example?   :o

 

Sure, no problem. I just took a look at your page. You have the following right now:

 

{{Infobox-character
| name = Inessa Hara
| image = 
| imagewidth = 440x353

 

So, first thing is the "image" field is blank. You need to place an image to display in that field, one that you have uploaded to the wiki. There is an "Upload New Image" button on the sidebar on the wiki (just below the link to RPC Forums). For ease of use, here's a link straight to image upload:

 

http://ffxiv-roleplayers.com/wiki/index.php?title=Special:Upload

 

Browse for the image and enter a final name. For example, "Inessa_Hara.jpg". Remember the file name!

 

The second issue with the above is the "imagewidth" field. You've put the resolution there; you only need to put the width of the image, so the first value (440). Reworked, the initial part of your infobox should be:

 

 

{{Infobox-character
| name = Inessa Hara
| image = Inessa_Hara.jpg (or whatever you name your file)
| imagewidth = 440

 

Adjust the imagewidth (the 440 value) to the size you want. I suggest somewhere between 250 and 350.

Link to comment
  • 2 weeks later...

Started Kroe's a week-ish ago. I've got more than enough wiki experience, so I don't need too much help, but darn does it need to be worked on.

 

(Like half the others I need to do for certain other OCs.)

Link to comment
  • 3 months later...

REVIVING THIS THREAD BECAUSE I DID IT, I UPDATED MY WIKI

 

ALSO I DON'T WANT TO HIJACK THAT GUY'S THREAD

 

Yay Warren! And it only took 12 pages. :P I enjoyed reading through it.

 

I'm yet to make one for Aris or Nimimi. Probably should get on that, it would help get my ideas in order. xD

Link to comment

My Wiki page has always been what it is. Rather unremarkable style-wise, but...that also makes it generally easy to keep updated.

 

Seeing some of the more stylish wikis out there makes me want to do a re-style though. Also, maybe fill it with some art of my character. If I can claw past my disgust with my "art" "style".

 

Blurgh....

Link to comment

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...