I really want my post to pop, but I’m unsure how to do it. Any information on how to format a post would be useful. Maybe there’s a guide or something? Here are a few of the things I want to be able to do:
Any ideas?
Edit: This thread is now for general questions on formatting journal posts. Got crazy!
You can use HTML markup, for instance:
<h1>Text</h1>
makes (conveniently the forum also accepts HTML):
Text
For subheading levels you can use h2, h3, etc.
The markup for tables is a bit more complex, so I’ll let this tutorial explain.
Here’s a tutorial for anchor links (links within a page). For headers, for example, it boils down to this:
<h1 id="intro">Introduction</h1>
Will create a “Introduction” title text, with an invisible anchor for links to direct to, like this:
<a href="#intro"> Link to the introduction</a>
You can also link to tables, div (basically the basic building blocks for HTML layout, but I have no idea how much functionality iNat supports and div-wrangling is its own can of worms) or images the same way, just adding an id within the relevant HTML tag.
Edit: When creating a journal post, you can see the list of accepted HTML tags just above the “Disable comments” checkbox. You can just google HTML + the name of the tag to find tutorials/documentation.
I write my text in a wordprocessor and paste it into iNat’s journal entry box. Initial editing is faster and easier that way.
Used this trick, works like a charm!
if you’re writing on the fly, Markdown is probably the easier thing to use than HTML to achieve most of the things you’re describing. here’s iNat’s blog post about their Markdown implementation: https://www.inaturalist.org/posts/38475-less-agreeable-observations-more-agreeable-text-formatting.
here are a few additional comments of my own related your your specific use cases:
i assume you’re talking about a horizonal rule. this would be <hr> in HTML, but it’s just --- on its own line in Markdown.
#heading would be the Markdown equivalent of HTML’s <h1>heading</h1>.
##heading would be the Markdown equivalent of HTML’s <h2>heading</h2>.
… and so on.
some Markdown implementations such as in the forum even automatically create named anchors that you can link to, although iNat’s journals do not. to create an anchor in iNat’s journals, i think you would have to explicitly add one using HTML, like so:
#<a name="link-to-heading"></a>heading
(note: i would use the name attribute in the anchor rather than id to created named anchors. some modern JavaScript frameworks don’t play well with id. so you’re probably going to have more consistent results using name.)
[go to my heading](#link-to-heading) would be the Markdown equivalent of <a href="#link-to-heading">go to my heading</a> in HTML
in addition to the syntax noted in the iNat blog post, i would just point out that you can right-, left-, and center-justify the column values by using a colon or two. for example:
|left|center|right|
|:--|:-:|--:|
|1|2|3|
|1|2|3|
you could also copy a small table into the forum post editor, and it will do some basic translation into Markdown, and there are other translators available on the web that will handle more complex translation.
Back in my day, we didn’t need no fancy JS frameworks, we just tortured an archaic version of Dreamweaver until we got something that somehow worked on all versions of Netscape.
Traumatic memories aside, Markdown is indeed almost certainly a better option, which I should get used to!
Slightly off-topic question - what would be a typical use of the journal function on here? I’ve been using iNat for about 1.5 years now, but I can’t say I’ve seen or written a journal post so far. I’m interested to know what common uses people here have for it?
I’ve seen people use them for all sorts of things; talking about a trip they went on, an identification guide, progress in projects, etc. Basically, for long-form communication. iNat currently lacks a way to search through all journal posts, which makes it hard to find relevant posts. It’s unfortunate as the journal function could be so much more useful! I’ve written one before detailing the field marks of the hybrid Mule Duck.
Mallard x Muscovy Duck - Way-out Waterfowl
I’m currently working on an ID guide myself but it’s tough. I don’t really know how to make pictures smaller. I want to make it so 2 different horizonal pictures can fit side by side on the same row for my guide exactly how it looks when I’m in the preview mode… Whenever I leave preview mode the pictures look larger… I want to ensure the pictures are as big as possible while doing this. Haven’t figured it out yet. The pictures are probably the worst part of my formatting as they’re just two giant pictures stacked on top of each other.
If you want to link to certain parts of the post you can do it like this:
As for the h1 thing you can also upgrade the 1 to a 2 etc to change to even more sizes.
Make sure you add some nice images at the bottom.
I’ve code this page to write journal posts with project stats and add some markups:
https://kildor.name/react/inat-converter/
Unfortunately it has no English localization, but at least you can try it)
You can copy some information from project pages (like species, observers or experts) and paste it to the page to transform them to html code.
So, you can put pictures into journal posts? How? I didn’t think copy-paste worked. What does?
You have to use the HTML img src tag (https://www.w3schools.com/tags/tag_img.asp) to pull in a picture already uploaded elsewhere on the web.
karoopixie had some guidance on how to do this kind of thing using HTML image attributes here: https://forum.inaturalist.org/t/adding-outside-photos-to-journals/7395/4
you can also use a table structure to achieve this kind of thing in all Markdown, although you will have much less precise control over formatting than is available in HTML. for example, the following Markdown produces the output below it:
|||
|---|---|
|||
Would there be a way to include one photo but make it smaller?
i don’t think you can generally rely on Markdown to have much control over styling. so you’d have to accomplish that in HTML. karoopixie’s thread that i linked to in my earlier post explains how to do that.
In my experience, the journal tool is not well suited for creating complex content. For simple posts that can be written with little more than links and lists, the journal markdown implementation is fine, but content that requires sections, tables, or images is generally not worth the effort. My rule of thumb is: if I have to spend more time formatting than creating the content itself, there’s something wrong.
For complex journal articles, I write an executive summary with the journal tool and then link to a googledoc for the details. I suspect most people prefer a brief summary anyway, so this division of labor works well for everyone.
As an aside, the best content creation tool I’ve used is wikipedia. I’ve been spoiled by its powerful template mechanism. Coding in raw HTML is no longer an option for me.
Well, for the post I’m creating at least, it’s pretty much a glorified list of links and resources. I just like having things formatted nicely :) Part of this thread was just seeing how formatting on iNat works since I’ve seen us use quite a bit here. Frankly, I was a bit jealous!
I do agree though that a Google Doc would be much faster and easier to work with.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
