Story Cheat Sheet
Jump to navigation
Jump to search
Below are various stylings that are used on the Full Story Pages.
For stylings used on normal pages, check Cheat Sheet.
Text
Left-sided conversation.
<div class="storyconvo">
{{ConvoLeft|name=NAME|image=IMAGE
|0=
|1=
|2=
|3=
|4=
}}
</div>
<br style="clear:both;"/>
<br />
Right-sided conversation.
<div class="storyconvo">
{{ConvoRight|name=NAME|image=IMAGE
|0=
|1=
|2=
|3=
|4=
}}
</div>
<br style="clear:both;"/>
<br />
Checkpoint.
{{Checkpoint|num=NUMBER}}
Quote Explanations.
<div class="quoteBit"> <div class="quoteBitTop"><img src="IMAGE_GOES_HERE"><p>QUOTE_GOES_HERE</p> </div> <div class="quoteBitText"> <p>EXPLANATION_GOES_HERE</p> </div> </div> <div class="quoteSummary"><b>Summary</b> <p>SUMMARY_GOES_HERE</p> </div>
Character summary.
<p>
{{storyCharSum|name=NAME_HERE|image=IMAGE_URL_HERE
|desc=<b>Status:</b> STATUS_HERE
TEXT_TWO_HERE
TEXT_ONE_HERE
}}
</p>
New page URL.
"<span class="urls"><nowiki>URL_MAIN</nowiki><b>NEW_PAGE_NAME_NO_SLASH</b></span>"
Tool-tip text.
<span class="altTooltip2">TEXT_HERE<span class="tooltiptext2">TEXT_HERE</span></span>
Block of text.
<div class="storyscript"><poem>TEXT_GOES_HERE</poem></div>
Block of text for Youshouldnthavedonethat.net.
<div class="storyscriptyshdt"><poem>TEXT_GOES_HERE</poem></div>
Within Hubris posts.
<div class="storyWHholder">
<div class="WHpost">
{{WHEntry
|user = NAME
|image = IMAGE
|group = Players
|count = JOIN_NUM
|joined = JOIN_DATE
|posted = POSTED
|postnum = POST_COUNT
|post = <poem></poem>
}}
</div>
<br style="clear:both;" />
</div>
Transcript
<div class="transcript mw-collapsible mw-collapsed" style="width: 90%; margin-left: auto; margin-right: auto;"> <p style="display:inline;"> <b> TEXT_HERE </b> </p> <div class="mw-collapsible-content"><poem>COPIED_TEXT_HERE</poem> </div> </div>
New Page Box
{{StoryNewPage
|imageName = CANON_FILE_NAME
|fileName = FILE_NAME_ON_WIKI
|URL = <i>WEBSITE_URL</i><b>PAGE_HERE</b>
|info = INFO_GOES_HERE
|audioName = CANON_AUDIO_NAME
|audioFile = FILE_NAME_ON_WIKI
}}
New Page Connector
<div class="pageConnector"> <div class="pageConnectorLine"></div> <p>Remaining on the page above for too long would redirect players to...</p> </div>
ID Moment
<div class="IDmoment"><div class="IDleft"><html><img src="https://johnisdead.withinhubris.com/images/9/93/Idlogo1.png" class="IDicon" onclick="IDmem()"/><audio src="https://johnisdead.withinhubris.com/images/f/fd/IDmoment.mp3" ID="IDsoundMoment" style="display: none;"></html></div><div class="IDright"><p>TEXT_GOES_HERE</p></div></div><br style="clear:both;" />
Audio file by itself.
<div class="storycenter">[[File:AUDIO_NAME]]</div>
Astral Observatory Post
<div class="storyAOholder">
<div class="AOTitle"><h2>TITLE_HERE</h2></div>
<p style="margin: 0px 0px 4px 0px;"><img src="https://johnisdead.withinhubris.com/images/6/6b/Aothreadheader1.png" style="height: 32px; cursor: pointer;" /></p>
<div class="AOthreadHolder">
<div class="AOpost">
{{AOEntry
|user = <span style="color: #COLOR_HERE;">NAME_HERE</span>
|image = IMAGE_HERE
|postcount = POST_COUNT
|joindate = JOIN_DATE_HERE
|postdate = POST_DATE_HERE
|title = Re: TITLE_HERE
|post = <poem>TEXT_GOES_HERE</poem>
}}
</div>
</div>
</div>
Pages
Single Page Pod
Place multiple inside "<div class="PagePodRow">" for a row.
{{PagePod
|prevURL=URL_WITH_SLASH
|newPage=NEW_PAGE
|imageName=NAME_OF_IMAGE_FILE
|imageCanonName=CANON_FILE_NAME
|pageDesc=PAGE_DESCRIPTION
|audioName=NAME_OF_AUDIO_FILE
|audioCanonName=CANON_FILE_NAME
}}
Page Pod Break
{{PagePodBreak
|prevURL=URL_WITH_SLASH
|newPage=NEW_PAGE
|imageName=NAME_OF_IMAGE_FILE
}}
Page Line
{{PageLine
|text1=
|text2=
|text3=
|line_two=true
|line_three=true
|break_one=
|break_two=
|break_three=
|one_to_three=
|three_to_one=
|one_to_two=
|two_to_one=
|three_to_two=
|continue=
}}
Explanation:
{{PageLine
|text1=Method of accessing first branch.
|text2=Method of accessing second branch.
|text3=Method of accessing third branch.
|line_two=If a second branch exists.
|line_three=If a third branch exists.
|break_one=If the first branch is broken / empty.
|break_two=If the second branch is broken / empty.
|break_three=If the third branch is broken / empty.
|one_to_three=Splitting from one page into three branches.
|three_to_one=Merging three branches into one page.
|one_to_two=Splittong one page into two branches.
|two_to_one=Merging two branches into one page.
|three_to_two=Merging three branches into two pages.
|continue=Lines continuing straight down into the same number of pages.
}}
Path Entry
<div class="StoryPaths">
<p style="display: inline-block; width: 250px; margin: 0px 0px 5px; text-align: center;">Page and Image</p><p style="display: inline-block; width: 350px; margin: 0px 0px 5px; text-align: center;">Description</p><p style="display: inline-block; width: 200px; margin: 0px 0px 5px; float: right; text-align: center;">Progression</p>
<div class="PathHolder">
{{PathEntry
|page=PAGE_NAME
|file_name=IMAGE_NAME
|description=PAGE_DESCRIPTION
|progression=PAGE_PROGRESSION
}}
</div>
</div>
Redirect Page
<div class="redirectHolder">
{{RedirectPage
|site=SITE_URL_WITH_SLASH
|page=PAGE_NAME
|image_url=COMPLETE_WIKI_URL
|image_name=CANON_FILE_NAME
|audio_url=AUDIO_FILE_NAME
|audio_name=CANON_FILE_NAME
|description=DESCRIPTION
}}
</div>
<br style="clear:both;" />
Videos
Embedded video with details.
{{StoryVideo
|link=<youtube>LINK_GOES_HERE</youtube>
|description=
|tags=
|transcript=
|summary=<ul>
<li>
</li>
</ul>
}}
Embedded video by itself.
<span class="storysmallvid"><youtube>YOUTUBE_LINK_HERE</youtube></span>
Images
Single centered image.
{{storyImage|url=IMAGEURLHERE}}
Quote with image.
<div class="quoteblock"> <div class="quotefullimg "> <img src="IMAGE_GOES_HERE" alt="" /> </div> <div class="quotetextholder"> <div class="quotename"> NAME_GOES_HERE </div> <div class="fadediv" style="margin-left: -10px; height: 3px;"></div> <div class="quote"> <p>"QUOTEGOESHERE"</p> </div> </div> </div><br />
Image gallery.
<gallery mode="slideshow"> File:FILE_NAME|DESCRIPTION File:FILE_NAME|DESCRIPTION File:FILE_NAME|DESCRIPTION File:FILE_NAME|DESCRIPTION </gallery>
Side-hanging image with quote.
<div class="storyimg" style="margin-top: 0px;"><img src="IMAGE_URL_HERE"><p>CAPTION_HERE</p></div>
Other
Janus Overview
{{JanusOverview
|map=NAME_OF_MAP
|map_canon_name=VISIBLE_NAME_OF_MAP
|num=NUMBER_OF_OBJECTS
|mapbase=URL_TO_MAP_IMAGE
|1=URL_TO_OBJECT_IMAGE
|1_name=OBJECT_NAME
|1_info=OBJECT_INFO
|1_xpos=DECIMAL_POSITION
|1_ypos=DECIMAL_POSITION
|2=URL_TO_OBJECT_IMAGE
|2_name=OBJECT_NAME
|2_info=OBJECT_INFO
|2_xpos=DECIMAL_POSITION
|2_ypos=DECIMAL_POSITION
|gal1_img1=FILE_NAME
|gal1_img2=FILE_NAME
|gal1_img3=FILE_NAME
}}