Tech tip - Sharing dA tags and html source code

4 min read

Deviation Actions

JRWenzel's avatar
By
Published:
5.5K Views
  This is the least hideous approach I've been able to come up with without altering the appearance of the test and without running into problems with dA's online text editors software due to the fact that they process the text bracketed in the html … tag sequence.  The following formatting workarounds will breakᴺ¹ the interpreters involved to get the desired results.  Normally most of this would be achievable by using html escapes &lt; [<], &amp; [&] and &#104; [h] however while these substitutions can be entered into the editor and do work, they only work one-way as should you need to do an edit on the post the online editor converts them back to <, & and h when it opens the saved text.
Enclose code examples within a <code>…</code> tag sequence to display them in a monospaced font.
Display :dalogo: tags: replace the leading : with :<i></i>
:dalogo:   ‌ I do Backgound Art stamp by JRWenzel:thumb333162401:   ‌:iconllamatruckplz::iconllamatruckplz:  

—Works with all dA tags {predefined emotes, thumbicon, etc.}
Display url addresses without auto-conversion to a hyperlink: replace the h in http with h<i></i>
http://www.deviantart.com/
:)
Still Clickable:
<a href="http://www.deviantart.com/">​h<i></i>ttp://www.deviantart.com/</a>
http://www.deviantart.com/
;)
Display html escapes: replace & with &<i></i>
Display html tag source by replacing every < with <<i></i>
—This only needs to be done for the tags, non-tag < characters will be processed normally and converted to escapes by the interpreter.
Example:
<a href="http://fav.me/d5iayno">
 <img src="http://fc06.deviantart.net/fs70/f/2012/292/2/d/widescreen_films_stamp_by_jrwenzel‑d5iayno.gif"
  alt="widescreen films stamp" height="56"/>
</a>
Would be written:
<code>
<<i></i>a href="http://fav.me/d5iayno">
 <<i></i>img src="h<i></i>ttp://fc06.deviantart.net/fs70/f/2012/292/2/d/widescreen_films_stamp_by_jrwenzel‑d5iayno.gif"
  alt="widescreen films stamp" height="56"/>
<<i></i>/a>
</code>
i⃝  For listings > 40 characters wide in Journals add a horizontal scroll bar.  To make code in these scroll boxes useable delete all Zero‑Width Joiners [&zwj;] and convert all: Em Spaces [&emsp;] to "  " [Space]‍[Space], Non‑Breaking spaces [&nbsp;] to " " [Space] and Non‑Breaking Hyphen [&#8209;] to "‑" [Hyphen].
Display embedded indentation ("whitespace") for readabilityᴺ².
Single leading space: replace with an En Spaceᴺ³ [&ensp;].
Multiple leading spaces replace the first 2 spaces with an Em Spaceᴺ³ [&emsp;].
—This is to reduce the impact of these 6 character long codes, even if it is by only 1 character.
Example: 1 space — "&ensp;My text"
 My text

Example: 2 spaces — "&emsp;My text"
 My text

Example: 5 spaces — "&emsp;   My text"
    My text
. . . and so on . . .
Alternatively
To override line-breaking for display in a scroll box:
For indentation:
Replace the first Space in all indents with a Non‑Breaking space [&nbsp;].
After the indent replace all:
2 Space Pairs with Em Spaces [&emsp;],
remaining Single Spaces with a Non‑Breaking space [&nbsp;]
and any "‑"(s) not bracketed with Non‑Breaking Spaces with a Non‑Breaking Hyphen [&#8209;].
Any remaining breaks should be resolvable by using the Zero‑Width Joiner [&zwj;]

NOTICE!: This should only be used for short snippets of code/text if it's something large link to it.

N1 Break as in "interrupt a process" not break as in "to damage".
N2 Don't abuse it!  System administrators get real weird when it comes to superfluous whitespace.
N3 Monospaced fonts usually have a ~1:2 aspect ratio at low resolution so En Space and Em Space work as substitutions.

© 2013 - 2024 JRWenzel
Comments5
Join the community to add your comment. Already a deviant? Log In
tragicallyhipster's avatar
I think I was about to pull out my hair.