# A setting to always insert images as separate paragraphs

**URL:** https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769
**Category:** Feature
**Created:** [January 16, 2020, 4:55am UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769 "2020-01-16T04:55:30Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![meglio](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/meglio/32/71444_2.png) [@meglio](https://meta.discourse.org/u/meglio)
#### Post date: [January 16, 2020, 4:55am UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/1 "2020-01-16T04:55:30Z")

</div>

In our community, users intend to insert images on a new line most of the time.

However, they cannot understand Markdown image codes, and they get confused about it all the time. They’re on a very low level of computer user skills.

As a result, they end up inserting an image and typing on the same line, just next to it. Or insert an image right after they typed a piece of text.

This looks ugly, and I’m looking for ways to automatically solve the majority of cases by compromising and making it a more confusing for advanced users.

Can we have two settings, or at least one of it?

1. Always insert an image in a new, separate paragraph.

2. Always insert a newline (or two newlines, to make up a paragraph) after the image code that was just inserted.

Does it make sense?  
Or is there a better idea on how to tackle this problem?

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [January 17, 2020, 3:47pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/2 "2020-01-17T15:47:09Z")

</div>

I have seen this confusion on a lot of Discourse sites @eviltrout.

---

<div class="post-metadata">

### Author: ![eviltrout](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eviltrout/32/5275_2.png) [@eviltrout](https://meta.discourse.org/u/eviltrout)
#### Post date: [January 17, 2020, 6:01pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/3 "2020-01-17T18:01:14Z")

</div>

I wonder if this should even be a setting? How often do you want to paste an image without a new paragraph? Perhaps the behaviour should change to always do this.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [January 17, 2020, 6:12pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/4 "2020-01-17T18:12:01Z")

</div>

Yeah I would support that. If @sam agrees let’s change the default to make it so.

---

<div class="post-metadata">

### Author: ![tobiaseigen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tobiaseigen/32/539204_2.png) [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [January 17, 2020, 6:23pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/5 "2020-01-17T18:23:37Z")

</div>

Sometimes I like to align images right or left, or insert a bunch of images and resize them to 50% so they look like a pretty photo gallery. In these cases I would not want to have them all in their own paragraph.

Not sure how many people do this or care about this, compare to the known large number of people who get confused by how it works now. Markdown is still confusing to many folks.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [January 17, 2020, 7:02pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/6 "2020-01-17T19:02:27Z")

</div>

> [@tobiaseigen](#):
>
> In these cases I would not want to have them all in their own paragraph.

Rare use cases, we should not be optimizing for this, but the common use case.

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [January 17, 2020, 7:07pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/7 "2020-01-17T19:07:38Z")

</div>

To add, when you upload multiple images at once (on iOS at least) it inserts them with only a space between them, so I always have to go back to add new lines.

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [January 17, 2020, 7:28pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/8 "2020-01-17T19:28:07Z")

</div>

And for a while we did not even add the space!! 😱

---

<div class="post-metadata">

### Author: ![omarfilip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/omarfilip/32/208019_2.png) [@omarfilip](https://meta.discourse.org/u/omarfilip)
#### Post date: [April 25, 2021, 6:33pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/11 "2021-04-25T18:33:22Z")

</div>

I find my users often upload multiple images at once only to screw up the post when they try to add a caption below an image, or when they remove the starting `!` by mistake. Adding two new lines after each upload would be very useful. Any progress on this?

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [April 27, 2021, 5:18am UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/12 "2021-04-27T05:18:08Z")

</div>

Yes we should pick this up again. Might be an easy one we can slip into the release.. @andrei ?

---

<div class="post-metadata">

### Author: ![andrei](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrei/32/205142_2.png) [@andrei](https://meta.discourse.org/u/andrei)
#### Post date: [April 30, 2021, 9:47am UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/16 "2021-04-30T09:47:04Z")

</div>

It’s implemented as default behavior, not as a setting. When uploading images from a device:

 ![Screenshot 2021-04-30 at 13.39.07](https://global.discourse-cdn.com/meta/original/3X/a/c/ac45ee1fed49ed213de2dc72dd2ce0f9d23305e1.png)

- we add a newline before an image if a cursor is on a nonblank line
- we always add a newline after images
- we add a newline between images when uploading several images

The important detail is that we always add _one_, not two newlines.

It’s merged now:  
[https://github.com/discourse/discourse/pull/12895](https://github.com/discourse/discourse/pull/12895)

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [April 30, 2021, 1:30pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/17 "2021-04-30T13:30:38Z")

</div>

This is a nice improvement!

Quick (untested) thought: does this cause problems for theme components that try to display images in a grid? For example [Tiles Image Gallery](https://meta.discourse.org/t/tiles-image-gallery/81950) or [Masonry Image Gallery](https://meta.discourse.org/t/masonry-image-gallery/188315)?

---

<div class="post-metadata">

### Author: ![Heddson](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heddson/32/96742_2.png) [@Heddson](https://meta.discourse.org/u/Heddson)
#### Post date: [April 30, 2021, 3:53pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/18 "2021-04-30T15:53:52Z")

</div>

As far as Masonry Image Gallery, this isn’t a problem. It’s coded to handle newlines and paragraphs.

Nice merge!

---

<div class="post-metadata">

### Author: ![omarfilip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/omarfilip/32/208019_2.png) [@omarfilip](https://meta.discourse.org/u/omarfilip)
#### Post date: [April 30, 2021, 3:54pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/19 "2021-04-30T15:54:59Z")

</div>

> [@andrei](#):
>
> The important detail is that we always add _one_ , not two newlines.

I’m curious about this. From a ux perspective, a space between uploaded images makes more sense to me.

No space as uploaded:

 ![fff](https://global.discourse-cdn.com/meta/original/3X/7/0/7036f5d3b40e255474a64e052e128be5ed5d7dde.png)  
 ![fff-1](https://global.discourse-cdn.com/meta/original/3X/7/6/76b1588edf2876ea331957788b5ae5fbb4ab540f.png)  
 ![fff-2](https://global.discourse-cdn.com/meta/original/3X/4/2/42f3db4a6cbff2de774677ee2d620d6c9517f783.png)

With space added:

 ![fff](https://global.discourse-cdn.com/meta/original/3X/7/0/7036f5d3b40e255474a64e052e128be5ed5d7dde.png)

 ![fff-1](https://global.discourse-cdn.com/meta/original/3X/7/6/76b1588edf2876ea331957788b5ae5fbb4ab540f.png)

 ![fff-2](https://global.discourse-cdn.com/meta/original/3X/4/2/42f3db4a6cbff2de774677ee2d620d6c9517f783.png)

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [April 30, 2021, 5:25pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/20 "2021-04-30T17:25:05Z")

</div>

I think it’s fine as is. We can revisit later as this is exceedingly minor.

---

<div class="post-metadata">

### Author: ![andrei](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrei/32/205142_2.png) [@andrei](https://meta.discourse.org/u/andrei)
#### Post date: [April 30, 2021, 6:04pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/21 "2021-04-30T18:04:15Z")

</div>

Unfortunately, this causes problems for [Tiles Image Gallery](https://meta.discourse.org/t/tiles-image-gallery/81950). I’ve checked it, it can handle only images separated with spaces, not newlines.

I may take a look at this next week.

---

<div class="post-metadata">

### Author: ![seanblue](https://avatars.discourse-cdn.com/v4/letter/s/dc4da7/32.png) [@seanblue](https://meta.discourse.org/u/seanblue)
#### Post date: [April 30, 2021, 7:19pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/22 "2021-04-30T19:19:21Z")

</div>

> [@omarfilip](#):
>
> I’m curious about this. From a ux perspective, a space between uploaded images makes more sense to me.

Yeah, I have never uploaded multiple images without the blank line in between the images. I always add the extra line myself.

---

<div class="post-metadata">

### Author: ![omarfilip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/omarfilip/32/208019_2.png) [@omarfilip](https://meta.discourse.org/u/omarfilip)
#### Post date: [April 30, 2021, 11:16pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/23 "2021-04-30T23:16:28Z")

</div>

It’s good with a single new line. 👍 Easy to adjust with CSS.

```
.cooked img {
    margin-bottom: 3px;
}

```

---

<div class="post-metadata">

### Author: ![Heddson](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heddson/32/96742_2.png) [@Heddson](https://meta.discourse.org/u/Heddson)
#### Post date: [May 1, 2021, 10:49pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/24 "2021-05-01T22:49:53Z")

</div>

And don’t forget, if you want to adjust the preview you need to do something like this. 🙂

```
.d-editor-preview img {
    margin-bottom: 3px;
}

```

---

<div class="post-metadata">

### Author: ![andrei](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/andrei/32/205142_2.png) [@andrei](https://meta.discourse.org/u/andrei)
#### Post date: [May 7, 2021, 2:44pm UTC](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769/25 "2021-05-07T14:44:06Z")

</div>

> [@andrei](#):
>
> Unfortunately, this causes problems for [Tiles Image Gallery](https://meta.discourse.org/t/tiles-image-gallery/81950)

Here is the fix for Tiles Image Gallery

[https://github.com/discourse/Discourse-Tiles-image-gallery/pull/4](https://github.com/discourse/Discourse-Tiles-image-gallery/pull/4)

[Next page](https://meta.discourse.org/t/a-setting-to-always-insert-images-as-separate-paragraphs/138769.md?page=2)
