Use Hyperlink and Image in a Email-friendly way - django

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 }}" ...>

Related

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

problem with passing parameter between two django template using include

I have created a 'more_btn' component like this.
<div>
<a href='{% url link %}' >{{ text }}</a>
</div>
and I want to reuse this component in two-parent components like bellow.
{% include "util_components/more_btn.html" with link="job1" text="s1" %}
{% include "util_components/more_btn.html" with link="job2" text="s2" %}
The problem is that the URL block in the 'more-btn' component wants an ID, not a string.
How can I solve this?

Django not displaying images from blog Post

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.

Can't Embed YouTube Link Within Django Template Tag, Twitter Bootstrap

I'm currently attempting to embed a user-submitted YouTube link via a Django form within a Twitter Bootstrap layout.
The space for the video is appearing and the source code reflects the correct information and link, but neither the video nor the player appears. I'm also using the "flex-video" class from this link for a responsive layout http://poslavsky.com/blog/2012/04/01/responsive-video-in-twitter-bootstrap/ but it doesn't work when that class is changed to another name such as "video" either.
This is the code:
<div class="row">
<div class="span12">
<span>{{story.author}}</span><br>
<span>{{story.zip_code}}</span><br>
<span>{{story.date}}</span><br>
<p>{{story.copy}}</p>
<div class="image">
{% if story.pic %}
<img src="{{ story.pic.url }}" alt="some_image_alt_text" />
{% endif %}
</div>
<div class="flex-video">
{% if story.video %}
<p> <iframe width="460" height="250" src="{{ story.video}}" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</p>
{% endif %}
</div>
</div>
Any insight greatly appreciated.
I guess {{story.video}} gives Youtube video Url something similar to this http://youtube.com/watch?v=ASO_ypdnsQ which is direct youtube url, and not embed url.
Embed URL for same video is different than direct url, like this http://youtube.com/embed/....
I created a custom template tag, here is how.
import urlparse
...
#register.inclusion_tag('video_embed.html', takes_context=True)
def youtube_embed(context, url):
url_data = urlparse.urlparse(url)
query = urlparse.parse_qs(url_data.query)
video_id = query["v"][0]
context['embed_url'] = ('http://youtube.com/embed/%s' % video_id)
return context
Then, in templates just load the tag, and pass the youtube url. It will give embed url from normal url.

Django Caching - Not caching for certain part of the page

I have a problem with django caching for login area using Safari.
When I use memcache and have 'django.middleware.cache.FetchFromCacheMiddleware' on, the login part of the page is always cached, showing "Welcome username" even after I press Logout.
It should change back to "login/sign up" link after logout is clicked. This seems to happen only in safari. Is there any way to not cache a part of the HTML page? I used #never_cache when it comes to view functions, but this login information is part of the base.html which gets extended throughout other site template htmls.
Thank you.
Code
In base.html
{% if user.is_authenticated %}
<div class="login">
<a id="login_dropdown_link" title="Login_nav">Welcome {{ user.username }} ( <span id="total_count"> {% total_count %}</span> )</a>
</div>
{% else %}
<div class="login">
<span class="spaced">Log In | Sign Up</span>
</div>
{% endif %}
This is most likely due to a header issue where Safari is being instructed to cache the page for a certain amount of time.