UI field for text and picture editing - django

I have a CreateView with title, content and image fields.
I would like to allow users to put the picture where they please within the contend field. I would like to add to my site a field like this :
I don't need something so detailed but for the moment the picture position is where I have put the img html tag. And I want it to be chosen by the user as he is writing a post.
If someone could help me please to figure out how to achieve this with bootstrap and django. thx

So I need to integrate a custom rich text editor and this is how you do it

Related

How to make a drop-down that show images in Django Admin?

I spent two hours trying to find out how to customize select2 widget in Django admin to implement this simple feature.
I have a model (Article) that contains many other objects (Pictures). Every Picture has a set of FileFields representing the original image file, the thumbnail, post-processed (using Pillow) preview and some meta stuff.
What I'm going to achieve is to be able to upload new images on the Article change page, and select/deselect them in the fancy Select2 dropdown widget.
How can I do that? Should I use ImageField instead of FileField? Should I use inlines and through for ManyToMany relation between Article and Pictures? Should I make my own widget? How do Django admin uses Select2 and how could I pass parameters like "templateResult" to be able to change the look of dropdown items?
Thank you in advance.

I am trying to allow users to upload pictures via the TinyMCE editor and insert in the users post

I am trying to allow users to upload images into their TinyMCE text area as they are writing their post. I currently have the TinyMCE text widget on the website, but when you click images, you have to type in a URL. I want them to be able to pick from their computer files.
The documentation for TinyMCE has an entire section on this topic: https://www.tiny.cloud/docs/configure/file-image-upload
In particular it looks like you want to implement this: https://www.tiny.cloud/docs/configure/file-image-upload/#file_picker_callback

How to turn a Django webpage into a PDF

I would like to add a feature to my Django website where the user can click on a link saying "Save as PDF". I would like this link to 1) produce a slightly different version of the page the user is currently on and 2) generate a PDF file in a separate window that the user can then save to wherever he or she wants.
All of the PDF functions I came across related to Django assumed that you already had a PDF that you wanted to render. In this case though, I want to create a PDF based on the content of the current page. Any idea how to do this? Thank you.
You can try this tool WeasyPrint. You can use it with Django
Any webpage is just a HTML basically so any html to pdf library would work. But this one is specifically built for django. Hope this helps.
Documentation for django-wkhtmltopdf

Django: Galleries Admin Photo Upload

I have a website that is using Django's admin interface to facilitate non-developers adding content to the site. The site has an Events page (and associated model), and each Event can have an associated photo gallery.
I'm thinking that photo galleries should have their own model. There is a table in the database which associates image paths with their Event.
What I need is a way to upload images. Preferably a multiple-file upload solution since there could be dozens of images per event. I want these images to be recorded correctly in their table and added to the file system in the correct location on the server.
I was originally thinking that the upload feature should be included on the Event admin page to make it easier for content contributors, but maybe it would be easier to keep a separate photo gallery admin and have them select the Event the photos are associated with from there?
I've read through a lot of similar questions and blog posts, but nothing that seems to be quite exactly what I'm looking for. I'm currently attempting to adapt some of the information I've seen, but I'd really appreciate suggestions. Thanks for any help on this!
You can create Some model with foreign key to Event, and ManyToMany to your Images, as I understand your question.
At first upload necessary images to some Image model and than add them to Some model with some Event

Display textbox for ItemStyle and MainContentQuery customization

I have the requirement to display a textbox on the content query webpart editor pane in which a user can type the path to a custom ItemStyle.xsl and MainContentQuery.xsl and the webpart will use the provided xsl's. How can i do this? I've seen tutorials about editing the .webpart file to point to a custom xsl, but this is not the case. I need to let the user fill in the path and make the content query web part use this path.