RPC has moved! These pages have been kept for historical purposes

Kage · **07-23-2014, 03:27 PM**

Yeah I'm in a pickle for that ; ;

Nyx Ashkala · **07-23-2014, 03:52 PM**

(07-23-2014, 03:27 PM)ExKage Wrote: Yeah I'm in a pickle for that ; ;

Haha, I just told my fiance I wanted throw my computer through the window. My images are skewing my entire layout now x.x...I think I'm just done for the day.

Argent Wren · **07-23-2014, 05:08 PM**

(07-23-2014, 03:12 PM)A'ria Wrote:
(07-23-2014, 03:05 PM)ExKage Wrote: 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:

Code: (Select All)

[[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:

Code: (Select All)

{| 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

Code: (Select All)

{| 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:

Code: (Select All)

<br clear=all>

Hope that helps a little.

Nyx Ashkala · **07-23-2014, 05:13 PM**

(07-23-2014, 05:08 PM)Argent Wren Wrote:
(07-23-2014, 03:12 PM)A'ria Wrote:
(07-23-2014, 03:05 PM)ExKage Wrote: 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:

Code: (Select All)
[[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:

Code: (Select All)
{| 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

Code: (Select All)
{| 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:

Code: (Select All)
<br clear=all>

Hope that helps a little.

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

Erik Mynhier · **07-23-2014, 06:56 PM**

I just started updating mine today. I am behind six months. Frustrated

LiadansWhisper · **07-23-2014, 07:16 PM**

(07-23-2014, 06:56 PM)Erik Mynhier Wrote: I just started updating mine today. I am behind six months.

I see everyone else's wiki and I'm just like, "WELP I CAN'T ACCOMPLISH THAT" and give up. Â lol

Raz · **07-23-2014, 09:27 PM**

I'm updating mine at the pace of a sentence a day. Suffice it to say, I have a lot more to do. :dazed:

Argent Wren · **07-27-2014, 12:57 AM**

Woohoo, I've managed to get something respectable up with words & formatting: Elsa's Wiki

It only took... *glances at clock* Way too long. Why does this stuff always take 4x the amount of time you expected?

Warren Castille · **07-31-2014, 11:09 AM**

My current arcs are all wrapped up. Warren's in a good place. I should be working on my wiki.

...I'm not, though. I could be, but...

Dazed

LiveVoltage · **07-31-2014, 02:25 PM**

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

Argent Wren · **07-31-2014, 03:31 PM**

(07-31-2014, 02:25 PM)LiveVoltage Wrote: 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:

Code: (Select All)

[[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.

Code: (Select All)

{{Infobox-character

| name = Character Name

| image = IMAGE_NAME.EXTENSION

| imagewidth = ###

FreelanceWizard · **07-31-2014, 03:39 PM**

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. Smile

LiveVoltage · **07-31-2014, 04:42 PM**

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

Argent Wren · **07-31-2014, 04:57 PM**

(07-31-2014, 04:42 PM)LiveVoltage Wrote: 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:

Code: (Select All)

{{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....ial: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:

Code: (Select All)

{{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.

LiveVoltage · **07-31-2014, 06:21 PM**

Okay, that worked though im defiantly going to need to get a better image for my character.Â Â ._.

Thanks again.

« Next Oldest \| Next Newest »
Pages (30): « Previous 1 … 9 10 11 12 13 … 30 Next » Jump to page:

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

RPC has moved! These pages have been kept for historical purposes