search

neutronX / django-markdownx

Comprehensive Markdown plugin built for Django
https://neutronx.github.io/django-markdownx/
Other
854 stars 153 forks source link

Need help customizing {{ form.media }} display #197

Open vladyslavnUA opened 3 years ago

vladyslavnUA commented 3 years ago

I'm not sure if I missed a closed issue on how to solve this but I am trying to have my {{ form.media }} render out the same way as in the README gif for this repo.

My code is pretty much the same as everyone else's:

<div class="row">
     <div class="col-md-6">
           <form method="POST" action="">
                {% csrf_token %}
                {{ form|crispy }}
            </form>
     </div>
     <div class="col-md-6">
           {{ form.media }}
     </div>
</div>

What I am trying to do here is have them be side by side, but all this renders out is the media right below the form

P.S. I'm happy to be the first issue opener of 2021 :)

jagaudin commented 3 years ago

I think you're misunderstanding what form.media is. It's actually the <script> tag for the plugin. I put it my js block.

{% block js %}
{{ block.super }}
{# MarkdownX js #}
{{ form.media }}
{% endblock %}
jagaudin commented 3 years ago

What you are looking for is a div with class markdownx-preview. To have panels side by side you need to customize the default template below.

<div class="markdownx">
    {% include 'django/forms/widgets/textarea.html' %}
    <div class="markdownx-preview"></div>
</div>
vladyslavnUA commented 3 years ago

Ahh I see.

Thanks for your swift response, I will try this out later tonight.