WHAT: An expanded version of a biosheet originally created by 10billionghosts, which you can use the linked Google Sheets document to generate! WHY: Because I put this together for myself and friends wanted it. ;)
w/Stats + Image = short blurb, one or the other = medium blurb, Blurb Only = as long a blurb as you want.
Abilities
Background
This can be as long as you want! Go nuts. :) As much or as little detail! As many or as few words! Blah blah blah blah blah blah blah blah blah. Remember to add BR tags for new paragraphs!
- Open the Google Sheets document! (You can see which VERSION it is by checking the title; the current version is also preserved on the INSTRUCTIONS sheet for future reference.)
- FILE > Make a copy - You will want one copy for each character you plan to use this code for. - Review the INSTRUCTIONS sheet if necessary. (You can then RIGHT-CLICK the INSTRUCTIONS SHEET and choose "Hide Sheet" to hide it, or delete it if you're sure you won't need it again.) - Fill out each sheet you intend to use. - From the SETTINGS sheet, select which sections to use and in which order, and set your colors. - Also available on this page: quick-copy HTML that might be useful to you. Feel free to add more snippets. - HIDE sheets for sections you're not using to make updates easy!
NOTE: You can create line-breaks in any Google Sheets cell by hitting CTRL/CMD+ENTER.
- Font: The font family you want to use. - Header Font Size: The font size for each section header. - Body Font Size: The font size for everything else. - Color: #ba4f59 - Accent Color: #f5909a - Outline Color: #242424 - Main Text Color: #ffffff
If you want to swap your colors around so that you're using a light COLOR and a dark ACCENT, you should also swap the values of OUTLINE and MAIN TEXT COLOR.
- Sections: As many or as few as you like. You can leave lines blank (e.g., clear out Summary from this example, and it will go directly from NAV to Personality with no empty space between).
- Just a bank of HTML code you might like to use! Paste in your chosen link color here.
Summary style is LONG BLURB. Bio is on the LEFT, with Bio Title on the RIGHT. First stat is set to FULL-WIDTH. Three stats are set to 1/3rd width, while two are set to half-width.
Summary style is W/STATS + SHORT BLURB. Bio is on the RIGHT, Bio Title on the LEFT. First three stats are set to 1/3rd width, causing them to float beside the profile pic. ALIGNMENT is also set.
- Nav Title: The title of the link that will appear in the NAV section for this, if used. - Style: w/Stats + Short Blurb or w/Long Blurb. (See PREVIEWS.) - Image: URL of your profile pic. - Image Position: top or center will usually work, but any valid value for background-position can be entered. - Image Size: cover will usually work, but any valid value for background-size can be entered.
- Title: The text that appears above the bio. - Title Align: Left/center/right alignment for the title. - Align: Whether the bio should be on the LEFT side or the RIGHT side, coming before or after the profile pic section. - Stats: Optional stat weights for your characters, saving throws, etc. "STR", "CHA", etc can be whatever text you want, provided that it's SHORT. You can have more or fewer options by continuing to fill in both columns, or deleting data from both columns. - Alignment: Optional alignment for your character.
- Label: The LEGEND value for each data row. - Value: The FIELDSET value for each data row. - Width: 1/3rd, half-width, or full-width. If the first three are set to 1/3rd, they will float beside the profile instead of appearing below it. - Explainer: This text pops in to explain the meaning of the width keywords. Don't edit, or you'll break it! You can add as many rows here as you want.
- Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title. - Positive/Neutral/Negative/Spicy Indicators: The extremely short text, HTML entity, or emoji that will appear next to the list of traits. If you only want two or three, clear the Indicator fields for the extras, like so:
NOTE: It isn't necessary to delete the related columns, although you can.
- Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title. - Style: w/Image + Stats for all three sections, w/Image for only the image and blurb, w/Stats for only the stats and blurb, Blurb Only for... only the blurb. - Image: URL of your appearance pic. - Image Position: top or center will usually work, but any valid value for background-position can be entered. - Image Size: cover will usually work, but any valid value for background-size can be entered.
- Blurb: The main text. Add HTML as desired. - Stats: You can add more fields here, but if using IMAGE, be aware that the image has a max height of 150px.
- Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title. - Ability Name Align: Left/Center/Right for each ability name.
- Name: The name of each ability to go in the LEGEND. - Description: The description of each ability to go in the FIELDSET. Add HTML as you like.
- Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title.
- Blurb: Can contain whatever HTML you like.
- Title: Text that appears above the section. - Title Align: Left/Center/Right for the title. - Alignment: Left or Right for the interstitial block's position. - Style: Data, Blurb, or Hidden.
If using DATA-style, fill in the fields below, including an optional indicator/symbol to prefix each line. You can add as many fields as you like.
- Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title. - Width: Width for every image as a number. (Defaults to 100px if not set.) - Width Units: Percent or Pixels. - Height: Fixed height for every image. (Defaults to 100px if not set.)
Then, you can add as many rows as you want of images, with the following columns: - Image: URL of your appearance pic. - Image Position: top or center will usually work, but any valid value for background-position can be entered. - Image Size: cover will usually work, but any valid value for background-size can be entered.
This is another Background-style section that can be used for anything. It lacks the interstitial option. - Title: Text that appears above the section. - Nav Title: Link text for the NAV section, if used. - Title Align: Left/Center/Right for the title. - Blurb: Can contain whatever HTML you like.
Showing a MIXTURE of settings: Backtag has a Note and a Permission drop-down value set, so it shows the "Yes" indicator with an * after "Backtag"; hovering over it will show the note as hover text.
Meanwhile, Fourthwall, which also has a Note set, does not have a Permission drop-down value set, so it shows its note text directly as the value of the field.
- Nav Title: Link text for the NAV section, if used. - Yes Indicator: Replace this with a different symbol, or simple English. - No Indicator: See "Yes Indicator". - Maybe Indicator: See "Yes Indicator".
- Name: The name of each permission. - Permission: A drop-down of options that match the indicators on the previous screen. If set, the indicator for that permission type will appear in the field. - Note: Either hovertext or, if the permission drop-down isn't set, the direct value that will appear in the field.
If you're not planning on using the hovertext option, a nice natural thing to do is to replace your indicators with "Yes." / "No." / "Maybe.", so that you wind up with fields like this:
For best results, keep values short! Or consistently long; they don't look bad multi-line, but they look better if all four are multi-line in the same way 🙂
You can also put <user name="YOUR_NAME_HERE" site="plurk.com"> into the contact field. It won't display correctly when previewing the code, but it will work just fine when you paste it into a journal entry.
GENERATOR INSTRUCTIONS
(frozen comment) USAGE
- FILE > Make a copy
- You will want one copy for each character you plan to use this code for.
- Review the INSTRUCTIONS sheet if necessary. (You can then RIGHT-CLICK the INSTRUCTIONS SHEET and choose "Hide Sheet" to hide it, or delete it if you're sure you won't need it again.)
- Fill out each sheet you intend to use.
- From the SETTINGS sheet, select which sections to use and in which order, and set your colors.
- Also available on this page: quick-copy HTML that might be useful to you. Feel free to add more snippets.
- HIDE sheets for sections you're not using to make updates easy!
NOTE: You can create line-breaks in any Google Sheets cell by hitting CTRL/CMD+ENTER.
SETTINGS
- Font: The font family you want to use.
- Header Font Size: The font size for each section header.
- Body Font Size: The font size for everything else.
- Color: #ba4f59
- Accent Color: #f5909a
- Outline Color: #242424
- Main Text Color: #ffffff
If you want to swap your colors around so that you're using a light COLOR and a dark ACCENT, you should also swap the values of OUTLINE and MAIN TEXT COLOR.
- Sections: As many or as few as you like. You can leave lines blank (e.g., clear out Summary from this example, and it will go directly from NAV to Personality with no empty space between).
- Just a bank of HTML code you might like to use! Paste in your chosen link color here.
SECTION EXPLANATIONS
NAV
PREVIEWS
With more than 4 sections:
CONFIG
SUMMARY
PREVIEWS
Summary style is LONG BLURB. Bio is on the LEFT, with Bio Title on the RIGHT. First stat is set to FULL-WIDTH. Three stats are set to 1/3rd width, while two are set to half-width.
Summary style is W/STATS + SHORT BLURB. Bio is on the RIGHT, Bio Title on the LEFT. First three stats are set to 1/3rd width, causing them to float beside the profile pic. ALIGNMENT is also set.
MOBILE:
CONFIG
- Nav Title: The title of the link that will appear in the NAV section for this, if used.
- Style: w/Stats + Short Blurb or w/Long Blurb. (See PREVIEWS.)
- Image: URL of your profile pic.
- Image Position: top or center will usually work, but any valid value for background-position can be entered.
- Image Size: cover will usually work, but any valid value for background-size can be entered.
- Title: The text that appears above the bio.
- Title Align: Left/center/right alignment for the title.
- Align: Whether the bio should be on the LEFT side or the RIGHT side, coming before or after the profile pic section.
- Stats: Optional stat weights for your characters, saving throws, etc. "STR", "CHA", etc can be whatever text you want, provided that it's SHORT. You can have more or fewer options by continuing to fill in both columns, or deleting data from both columns.
- Alignment: Optional alignment for your character.
- Label: The LEGEND value for each data row.
- Value: The FIELDSET value for each data row.
- Width: 1/3rd, half-width, or full-width. If the first three are set to 1/3rd, they will float beside the profile instead of appearing below it.
- Explainer: This text pops in to explain the meaning of the width keywords. Don't edit, or you'll break it!
You can add as many rows here as you want.
PERSONALITY
PREVIEWS
Using all of the sections.
Using only two.
MOBILE:
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Positive/Neutral/Negative/Spicy Indicators: The extremely short text, HTML entity, or emoji that will appear next to the list of traits. If you only want two or three, clear the Indicator fields for the extras, like so:
NOTE: It isn't necessary to delete the related columns, although you can.
APPEARANCE
PREVIEWS
Title align is RIGHT, align is LEFT, blurb style is w/Image + Stats.
LEFT, RIGHT, w/Image.
CENTER, Blurb Only (turns it into another 'background'-type section).
MOBILE:
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Style: w/Image + Stats for all three sections, w/Image for only the image and blurb, w/Stats for only the stats and blurb, Blurb Only for... only the blurb.
- Image: URL of your appearance pic.
- Image Position: top or center will usually work, but any valid value for background-position can be entered.
- Image Size: cover will usually work, but any valid value for background-size can be entered.
- Blurb: The main text. Add HTML as desired.
- Stats: You can add more fields here, but if using IMAGE, be aware that the image has a max height of 150px.
ABILITIES
PREVIEWS
Title align set to CENTER, ability name align set to LEFT.
As many abilities can be added as are desired.
MOBILE:
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Ability Name Align: Left/Center/Right for each ability name.
- Name: The name of each ability to go in the LEGEND.
- Description: The description of each ability to go in the FIELDSET. Add HTML as you like.
BACKGROUND
PREVIEWS
Title align on the RIGHT, interstitial style set to BLURB with both interstitial title and alignment set to LEFT.
Title align still on the RIGHT, interstitial style set to DATA with both its title and alignment set to RIGHT.
Title align on the LEFT, interstitial style set to HIDDEN.
MOBILE:
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Blurb: Can contain whatever HTML you like.
- Title: Text that appears above the section.
- Title Align: Left/Center/Right for the title.
- Alignment: Left or Right for the interstitial block's position.
- Style: Data, Blurb, or Hidden.
If using DATA-style, fill in the fields below, including an optional indicator/symbol to prefix each line. You can add as many fields as you like.
If using BLURB-style, fill in the blurb box.
STATS
PREVIEWS
When open:
CONFIG
VISUALS
PREVIEWS
Title align set to LEFT, width of images set to 25%, height of images set to 100px, five images included (creating two rows).
A third row of images will cause the area to scroll.
MOBILE:
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Width: Width for every image as a number. (Defaults to 100px if not set.)
- Width Units: Percent or Pixels.
- Height: Fixed height for every image. (Defaults to 100px if not set.)
Then, you can add as many rows as you want of images, with the following columns:
- Image: URL of your appearance pic.
- Image Position: top or center will usually work, but any valid value for background-position can be entered.
- Image Size: cover will usually work, but any valid value for background-size can be entered.
MISC
PREVIEWS
CONFIG
- Title: Text that appears above the section.
- Nav Title: Link text for the NAV section, if used.
- Title Align: Left/Center/Right for the title.
- Blurb: Can contain whatever HTML you like.
PERMISSIONS
PREVIEWS
Showing a MIXTURE of settings: Backtag has a Note and a Permission drop-down value set, so it shows the "Yes" indicator with an * after "Backtag"; hovering over it will show the note as hover text.
Meanwhile, Fourthwall, which also has a Note set, does not have a Permission drop-down value set, so it shows its note text directly as the value of the field.
MOBILE:
CONFIG
- Nav Title: Link text for the NAV section, if used.
- Yes Indicator: Replace this with a different symbol, or simple English.
- No Indicator: See "Yes Indicator".
- Maybe Indicator: See "Yes Indicator".
- Name: The name of each permission.
- Permission: A drop-down of options that match the indicators on the previous screen. If set, the indicator for that permission type will appear in the field.
- Note: Either hovertext or, if the permission drop-down isn't set, the direct value that will appear in the field.
If you're not planning on using the hovertext option, a nice natural thing to do is to replace your indicators with "Yes." / "No." / "Maybe.", so that you wind up with fields like this:
PLAYER
PREVIEWS
For best results, keep values short! Or consistently long; they don't look bad multi-line, but they look better if all four are multi-line in the same way 🙂
MOBILE:
CONFIG
You can also put <user name="YOUR_NAME_HERE" site="plurk.com"> into the contact field. It won't display correctly when previewing the code, but it will work just fine when you paste it into a journal entry.
DIVIDERS
PREVIEWS
CONFIG
- Align: How to align the images/text on the divider — to the LEFT, to the RIGHT, or in the CENTER.
- Text: Leave blank for image dividers.
The image-dividers can have up to three images, each with a different URL, background-position, and background-size.
Each row here represents a different DIVIDER.