GENERAL BASICS OF SA CODING:
YOU CANNOT USE BBCODE WITHIN PARSEHTML TAGS OR VICE VERSA. IT WILL BREAK YOUR ENTIRE CODE.
The first rule above all is that if you can do it just in BBCode, do it just in BBCode. It'll be way easier on you, and have way less compatibility issues. Plenty of things can be done without BBCode, and pure BBCode is more likely to be compatible with phones and other out of date browsers. Similar thing with drawers - really, try and avoid them if at all possible (spoilers can now be nested, so use those instead).
That said, if you want to do fancy things, here we go!
First of all, absolutely don't do any coding in the default WYSIWYG editor. Before you do ANY coding, you're going to need to head into the default BBCode editor. To swap over, click 'use BBCode editor' in the top right.
From there, you need to wrap your HTML in parsehtml tags.
So, rather than:
<span style="font-weight: bold;"><span style="color: crimson;">P</span><span style="color: tomato;">l</span><span style="color: goldenrod;">o</span><span style="color: lightgreen;">t</span><span style="color: cornflowerblue;">s</span></span>
[parsehtml]<span style="font-weight: bold;"><span style="color: crimson;">P</span><span style="color: tomato;">l</span><span style="color: goldenrod;">o</span><span style="color: lightgreen;">t</span><span style="color: cornflowerblue;">s</span></span>[/parsehtml]
CENTERING A WHOLE TEMPLATE:
This is a bit of a tricky thing. Essentially, wrapping a parsehtml inside another tag will cause issues. You can't, for example, wrap the whole thing in center or align=center tags, as it'll just break the parsehtml.
Instead, make the first thing inside the parsehtml a <center> tag, and wrap the whole template in it.
RANDOM TIPS AND TRICKS:
- Don't use hard numbers for width. If you set the width of a table to, say, 400px, than anyone on a mobile browser will have the contents extend off the screen, making it impossible to read. Stick to % instead for mobile-compatibility.
- If you have a header and a footer but don't have any code effecting the middle, you can use more than one parseHTML. Just end the one at the top and start a new parseHTML at the bottom, allowing you to type in the middle without line breaks.
- Don't feel the need to get fancy. People have made some really nice looking plotters and trackers, all without touching parseHTML at all.
SWAPPING FROM JCINK:
Jcink is pretty similar to how we do things here. Basically, just swap dohtml tags with parsehtml tags, and the overwhelming majority will work with only slight edits needed.
SWAPPING FROM PROBOARDS:
A bit trickier than jcink, because proboards uses an expanded form of BBCode rather than parsing HTML. The absolute easiest way is using the inspect element feature. I'm using google chrome, and I'll use that to explain how to do it. Pull up your proboards post template, and right click the template itself (the text is probably the best) and choose 'inspect element' on the dropdown.
From there, the inspect window will pop up, either along the bottom of your window or as a separate window. The part of the HTML that makes up your post text should be selected (grey highlight in the picture). Running your mouse over the different elements will highlight them on the template. Find the part of the code that includes all elements of the template but not the site itself, and right click that.
Please click this link for an example, because it's a pretty large screenshot.
From there, right click and choose edit as HTML. This will bring you up a selection of your entire template - just copy paste the whole thing. From there, you're basically done. Slap it into a parsehtml tag on SA, and the template should be mostly converted. Some small things might need tweaking, but this takes the majority of the work out of recoding a template for SA.
In my example template, I just need to change the indent on the tag section at the top, and revert it to a normal tag.
ALT: Do I use HTML or BBCode? Do I need to use DOHTML? How do I make post templates?