Formatted JSON Data in a Topic

[sds]

Our developers have asked me to move their API development guide into MadCap so we can publish it to the same destination as our program guide. For response samples, we're wanting to style the text like you would see in a JSON output program like Postman. I found a JSON formatter where I'm able to take some response text and format it into the JSON style (with the collapse and expand buttons even) but it's not copying/pasting correctly in my topic. The collapse/expand buttons aren't required, but I'd like it to at least be formatted like true JSON. I did some quick searches and am not coming up with anything.

For an example, you can go to https://jsonformatter.curiousconcept.com/ and copy paste:

{"result":[[{"type":"LiveDataTypes.TFL_RESPONSE","id":1,"fields":{"FResponseCode":0,"FResponse":"1 Rows Affected"}},{"type":"LiveDataTypes.TFL_RESPONSE","id":1,"fields":{"FResponseCode":0,"FResponse":"3 Rows Affected"}},{"type":"LiveDataTypes.TFL_RESPONSE","id":1,"fields":{"FResponseCode":0,"FResponse":"0 Rows Affected"}}]]}

Click Process to see the formatted JSON.

Any suggestions short of styling each and every word?

[techwriter31]

Here is the method we use:
1. Within the XML Editor for the topic (and not the Text Editor), select pre from the Style list to insert a pre tag into the topic.
2. Copy the code.
3. Paste the code inside the pre tag. When pasted, each line will be pasted as separate paragraphs.
4. To change the paste format, click the clipboard icon that appears and select Paste Inline Text. The text is then moved back into the original pre tag and the white space (indent, line break, etc.) is maintained.

Note: If you view the code in the Text Editor, the format will not match what is displayed in the XML editor. For example, angle brackets < and > will be replaced by < and >

We also have span.pre tags with different color fonts that we can use. If particular lines in the source code use syntax highlighting, we highlight only that line of code and select the appropriate span character tag (e.g., span.pre_Blue, span.pre_Green or span.pre_Red).

[sds]

Wow thanks so much. This is one of those times where I feel silly because during my googling, I'd read briefly about <pre> but dismissed it for some reason. This works out great. I don't mind styling some of the content as long as I can format it that easily. Thanks again!

[techwriter31]

Glad to help! I don't find the Paste Inline method to be very intuitive, so I eventually created a topic in our internal "How To" documentation for it, and I always have to refer back to it!

[Chicago_HPT]

You may also want to check out these topics/articles, which discuss using prism and prettify for syntax highlighting within Flare:
(Prism) viewtopic.php?f=13&t=30396
(Prettify article with links and screen shots) https://www.madcapsoftware.com/blog/syn ... by-google/

[techwriter31]

It's been a while since we investigated Prettify. At the time, we decided it wasn't a good fit for us, since we use multi-channel publishing, and Prettify wasn't supported in PDF.