How to save a sequence of pictures and text?

Question

Database design

Good afternoon ! Let's say the user creates a post in which he can place pictures and descriptions in any order. I need to keep them in the same order. I will be glad to links, or the direction in which direction to look.
Post example.
picture/video
text
then picture again. It may be the other way around.
A great example is posts like on the Peekaboo site or Toaster's answers.

Answer 1

Like plain text, html code or any other markup language (markdown, for example). And on the client, already process it with scripts and display it as it should. If it is possible to upload pictures to your server, then this is done separately, and links are used in the post.

Answer 2

Pictures and videos are inserted directly into the body of the post (as links), there are no separate records for them in the database. If it is supercritical for you to keep track of their storage on the server - when adding an image on the client, put some label in the data attribute (you can even name the file right away) and when adding an article on the server, pull out all the links to the images regularly and write to the database.

Answer 3

Good day.
Create separate tables for pictures/videos/etc.
Accordingly, in the table of pictures, store the path of the picture location on the server (its parameters/etc), similarly for video.
You also create a table for linking IDs from these tables to the post ID.
When saving a post, fill in the tables of pictures / videos accordingly.
In the post itself, put "tags", for example "Not a funny picture {embed type="picture" id="123"}, which is a hundred years old."
When displaying a post, select all these dependencies from the table accordingly, enter (for example) into arrays by type, where the ID from the table will be the key, and when parsing the post (with regular expressions, for example), replace the labels with the pictures / video / etc. For example, if you find the label {embed type="picture" id="123"}, then take pictures[123] from the array and replace this label with img src="pictures[123]" ....