Post formatting using   for tab indentations

[hipp0]

I had tab indentations for my paragraphs using 8         

They were working until I added a center align image using this code:

Which messed up the formatting of the post. Tabs, paragraph/image alignment, and a quick underline with CTRL+U similar to Microsoft Word would really make writing quick articles much less of a pain.

I am looking for other writing tools that I can import into Discourse. Because writing clear long article style post is just not really doable.

[Canapin (Coin-coin le Canapin)]

@hipp0

Tabs, paragraph/image alignment, and a quick underline with CTRL+U similar to Microsoft Word would really make writing quick articles

Understood, but Discourse is not meant to write articles. It’s a forum, not a blog
In some Discourse forums, articles are published on a dedicated WordPress blog which uses WP Discourse – WordPress plugin | WordPress.org.

That said, have you had a look at Formatting toolbar and Composer Button Bonanza?

[hipp0]

Understandable.

Wordpress sucks if you’ve never used it, I have it setup for my blog right now and its just the most janky app.

Discourse could reach a wider audience with a few tweaks for writing articles. Since most nice blog writing platforms cost a lot of money per month.

Writing on X.com = $30 per month.

Tumblr limits articles to around 40,000 characters.

Blogger is outdated and lacks features (I can’t even copy markdown articles I’ve written into there).

To write good articles on Discourse is literally just a tab indentation + aligning text/images.

I also don’t want to direct people away from my forum. I want to keep them inside the forum reading.

Going to Wordpress is not ideal for my needs.

I am in the process of modifying Discourse so I can use it as a blogging tool.

[Lilly]

@hipp0

I had tab indentations for my paragraphs using 8

They were working until I added a center align image using this code:

Which messed up the formatting of the post.

            This works for me. Also, why would you want to indent? virtually nobody has done indenting since online documents and text blocks became a thing. Text blocking looks better and is the contemporary standard for online publishing. Indenting even looks weird and there is a reason it isn’t easy to do in markdown formatting.

[hipp0]

That code works until you add other code into the post then it breaks everything. If you want to recreate it, add   8 times for paragraph indents then add that code above. It changes the formatting on everything.

Book/manuscript formatting is definitely better than this web format style, especially for reading long articles. Blocks are helpful when a point comes for them.

My work around with Tumblr was to use blocks and many photos to break up the paragraphs. Since reading a lot of text with no indents is really not enjoyable.

[Lilly]

@hipp0

That code works until you add other code into the post then it breaks everything. If you want to recreate it, add   8 times for paragraph indents then add that code above. It changes the formatting on everything.

that isn’t what your OP said.

@hipp0

They were working until I added a center align image using this code:

please make your posts clearer if you want help.

I would recommend reading some of the Documentation topics. if you want to learn how to use markdown, html and other allowable formatting, this is a start:

Formatting posts using markdown, BBCode, and HTML

This reference guide details all the formatting options available in Discourse posts, including markdown, BBCode, and HTML. It specifies what is supported and provides resources where you can see examples. Required user level: All users Understanding supported formatting in posts While plain text is sufficient for most replies, Discourse allows users to enhance the formatting of their posts by using markdown, BBCode, and HTML. This guide explains what types …

[hipp0]

All I added to my post

        

to create the indentation for the paragraphs.

Then I added the code:

Which then messed up the formatting of the entire post.

It basically turned all the paragraph indents into 4 spaces

[Lilly]

I’ll give you some quick CSS formatting tips you can use for blog-style posts.

you’re doing indentation wrong. the proper way to do it with CSS is like this (indentation standard is 2em):

in common.scss

[data-theme-indent="indent"] {
    text-indent: 2em;
}

in your post:

<div data-theme-indent="indent">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam 
</div>

Also, if you want to do some other formatting with images and alignment:

in common.scss:

[data-theme-image="left"] {
    float: left;
    img {
      margin: 0 1em 0 0;
      border-radius: 6px;  
    }
}

[data-theme-image="right"] {
    float: right;
    img {
      margin: 0em 0em 0em 1em;
      border-radius: 6px;
    }
}

in your post:

<div data-theme-image="left">

![image|330x314, 50%](upload://8zsmHfqxlU5IrqSywrinvyDfhOx.png)

</div>

result using all of the above:

[Lilly]

Here’s something I just whipped up. This adds buttons to the composer toolbar, including indenting.

GitHub - Lillinator/images-and-text-alignment: adds composer buttons to align images and text,...

note: the indent function can apply to multiple blocks with a single click of the button. so you can type multiple paragraphs and then select all of them and indent all at once. ^[1]

---

1. btw, this component is meant to be demonstrative for how to make custom toolbar changes for css formatting - if you’re going to use this component, please fork it because i will likely not maintain it and archive it at a later date. ↩︎

[hipp0]

Thanks for this it works well.

The Indent I think is off by one space:

top line is using your indent and bottom is         

Any chance to add an Underline to this component? Pretty much solves everything I need so I am thankful for this.

[Lilly]

as the footnote says, please fork it and do your own dev on it. i have no actual use for it and only made it to show you how to do these sort of customizations yourself.