Django not displaying images from blog Post - django

I have created a DJANGO blog-engine which takes my post and the template parses it for html tags. links etc.. are working but it does not load image file and instead shows the 'alternative' . I have tried the tag in separate html files and it is otherwise. Just not displaying image from inside a django blog post.
Relevant portions of the template file :
{% include 'blog/header.html' %}
</aside>
<section id ="content">
<article>
{%for post in posts %}
<h2>{{ post.title }}</h2>
<h3>{{ post.created}}</h3>
<p>
{{ post.body|safe }}<br>
</p>
<h3>By {{ post.author }}</h3>
I am copy-pasting the post in question
<---- text here ------------------>
GDCM::Directory
<img src="/home/usman/www/deejay/blog/static/images/dicomdir.png" />
This is it
Interestingly, the 'a' tag works fine but the 'img' tag is not working. I have tried many variations but i want some inline code to display simple html tag, alternatively of course i will resort to it programmatically by passing some variable to the template from inside the post to let it know where to position the image.

Your problem is here: {{ post_get_absolute_url }}. You should use {{ post.get_absolute_url }}.
The better way is to call the URL of the image directly; that way you maintain your URLs in urls.py and not in your model code. It makes your app more portable.
Take your image field name value from your model, and then {{ post.image.url }}. For example, if your model is:
class Post(models.Model):
img = models.ImageField(upload_to='images')
Then you would use {{ post.img.url }}

Problem solved when I replaced the full address with
<img src="/static/images/dicomdir.png"/>
On development server as well as on production. What helped was that I looked at the Dev-server responses on my terminal and was able to figure out the url.

Related

Javascript returns the same id for every iterated element in html

I have website which i build using Django where every visitor can leave their message or press a like button on any comment. I would like to show how many of a comment has been liked by the user.
As each comment is unique, I think to access the comment_id attribute which I wrote in the html part. I then use a simple js function to retrieve the id. The problem is, although html is showing unique id for each comment, Javascript still return the same id, that is the id of the first comment that is written on the page. Can someone tell me where is my mistake in this case?
Thank you in advance for your help.
my code in js:
function likeButton(){ let el = document.getElementById("chat-icon-thumbsup") alert(el.attributes["comment_id"].value) };
my html code, which is looping the datatable records "comment" from a datatable in Django framework:
{% for comment_ in comments %} <strong> {{ comment_.name }} - {{ comment_.date_added }} <button><i comment_id="{{ comment_.comment_id }}" id="chat-icon-thumbsup" class="fa fa-fw fa-thumbs-up" title="like this comment" onclick="likeButton()"></i></button> {{ comment_.nr_of_likes }} <br/> </strong> {{ comment_.body }} <br/> {% endfor %}
image 1: here you see when I inspect the DOM elements, it retrieves different "comment_id"
enter image description here
image 2 and image 3: every button pressed in the comment line alerting the same id, which is 16
enter image description here
I tried to google any possible same problem, but no solutions found
In HTML an ID should be unique on every page. JS will therefore only return the first field it finds with that ID. What you should be using is a class-name that defines your field, like this for example:
<i id="comment_{{ comment_.comment_id }}" class="fa fa-fw fa-thumbs-up chat-icon-thumbsup" ....>
Then you can use document.getElementsByClassName("chat-icon-thumbsup"), there is a reason why it's called getElementById as singular and not getElementsById

External URL into a iframe to embed an external url within Django

I would like to embed a pptx that is uploaded into a folder in OneDrive within a iframe tag in a Django template. I have the urls stored in a model and saved into the SQLite database. In this sense, in the views.py file, I have the following code:
context = {
'selectedunit': selectedunit,
'url_to_be_inserted': MyModel.objects.filter(unit=selectedunit)
}
return render(request, 'web.html', context)
The code for web.html is very easy:
{% extends 'base.html' %}
{% load static %}
{% block content %}
<div class="container col-lg-8">
<div class="center">
<iframe class="center" src={{ url_to_be_inserted.url }} width="100%" height="300%" frameborder="0"/>
</div>
</div>
{% endblock %}
The result is the snapshot below:
While, I would like to embed the ppt into the web site. If I directly insert the URL, instead of using the context variable, it works. That is to say:
<iframe class="center" src="https://..." width="100%" height="300%" frameborder="0"/>
In this case, the result is as follows (ppt embedded into the Web site):
The reason why doing in this sense is because, depending on the selectedunit variable, I would like to address a different pptx with a different URL and I would like to dynamically change the pointer (as you see above by filtering the model).
How could I solve it?
Many thanks in advance

Use Hyperlink and Image in a Email-friendly way

Hey almighty Stackoverflow,
i'm pretty new to Django and i'm required to write an HTML-Email Template, which includes Social-Media Icons that are also Hyperlinks. It all works fine in Preview, but when send by Email only the "Broken-Image"-icons appear.
The Images are located in the static file of the Django Module and also in the static.dist directory of the main application. A few weeks ago, it worked, but after some pause and new testing yesterday, the images are broken.
{% static 'ner_mail/YouTube.png' as yt_icon %}
{% with 'target="blank" href="https://www.youtube.com/URL"'|safe as a_attr %}
{% blocktrans %}
<a {{ a_attr }} > <img src="{{ yt_icon }}" alt="" style="alignment: left;vertical-align:middle; width: 30px; padding-right: 5px" ></a>
<a {{ a_attr }}> Social Media {% endblocktrans %}
{% endwith %}</li>
Can somebody maybe help me? Thank you in advance for any help!
Best regards,
The static template tag gives a relative url, hence when you send that in an email, the user's browser assumes it to be relative from the current website the user is on (gmail.com if suppose the user opened their email there). Hence you want to render an absolute url. To do this you can use request.scheme [Django docs] and request.get_host [Django docs]:
<img src="{{ request.scheme }}://{{ request.get_host }}{{ yt_icon }}" ...>

django cms - how to make placeholders inheritable from base.html

I made in my base.html (which will be inherited from all other templates) this:
<a href="/./">
{% placeholder "Logo-Image" or %}
There is no Logo image yet.
{% endplaceholder %}
</a>
I was in Startpage and uploaded a Logo image, worked well. but once I navigated to another pages, the uploaded logo isnot there, instead i see: There is no Logo image yet.
How can I make this placeholder also inheritable?
I tried in another page this:
{% show_placeholder "Logo-Image" inherit %}
but not a single sign of success
I solved the issue. Django CMS has since version 3.0 a new tag called:
static_placeholder
to make it work:
just do in your base.html
{% static_placeholder "logo" or %}
There is no Logo image yet.
{% endstatic_placeholder %}``
and all other pages inherit this.

Problem embedding youtube video's with with django template

I have a django template that displays a list of objects with youtube videos:
{% for obj in objs %}
<h1>{{ obj.name }}</h1>
<iframe width="425" height="349" src="{{ obj.video}}" frameborder="0" allowfullscreen=""></iframe>
{% endfor %}
obj.video is stord as a urlField. When I load the page chrome console gives me the error refused to display document because display forbidden by x-frame-options.
The problem persists if I replace {{ obj.video }} with a manually written youtube embed url such as http://youtu.be/zzfQwXEqYaI. However, if I replace it with something like www.google.com the iframes will load.
Try embedding the video like with url like:
http://www.youtube.com/embed/zzfQwXEqYaI
I guess its some kind of protection from youtube