I'm learning Django by making a news / blog web app. On my home page i would like to list my articles so i made a simple template with this :
{% for article in last_articles %}
<div class="article">
<h3>{{ article.title }}</h3>
<p>{{ article.content | truncatewords_html:80 | safe }}</p>
<p>Read More </p>
</div>
<br/>
<hr/>
{% empty %}
<p>Nothing for the moment</p>
{% endfor %}
The problem is that I have some pictures on my article.content so my question is : Is there a way to remove them like truncatewords but for picture. I didn't find solutions on official doc.
Thanks
Related
I have a blog created on Github Pages using Jekyll Now
The default Index.html looks like this
---
layout: default
---
<div class="posts">
{% for post in site.posts %}
<article class="post">
<h2>{{ post.title }}</h2>
<div class="entry">
{{ post.excerpt }}
</div>
Read More
</article>
{% endfor %}
</div>
This creates a landing page where the titles of all the posts you have made in the _posts directory are displayed with a link.
Looking at the {% for ... %} & {% endfor %} & the final static HTML, it seems as if when building the page, the for tag is actually iterated & the final HTML contains a list of actual titles.
I want to change this so that not all posts are listed. I do not want to list any post whose title contains the string "BEINGWRITTEN"
I tried stuff like
{% for post in site.posts %}
{% if (post.title.indexOf('BEINGWRITTEN') == -1) %}
<article class="post">
...
</article>
{% endif %}
{% endfor %}
Also tried with includes instead of indexOf, that also doesn't work. Both cases, I don't see any posts linked at all on the landing page.
How do I do this?
I did this by adding a category in the front matter of the page I don't want included.
i.e.
category: noshow
Then changed the index.html to
{% for post in site.posts %}
{% unless post.category == "noshow" %}
.....
{%endunless}
{%endfor}
I'm using Wagtail for a blog site with auto-populating blog links on a listing page.
However, when I click the link for the blog page, it adds a '#' to the address bar.
So, for example, I am working on localhost with the blog address of http://127.0.0.1:8000/blog/ and once I click on the blog link, with slug blog-slug, I get http://127.0.0.1:8000/blog/#/blog-slug. I am not sure why it is adding the hash tag at a location even behind the parent page 'blog'.
This is the code I have on the blog listing template:
{% for post in all_posts %}
<figure class="item standard" data-groups='["all"{% for tag in post.tags.all %},"{{tag}}"{% endfor %}]'>
<div class="portfolio-item-img">
{% image post.blog_image max-350x200 as img %}
<img src="{{img.url}}" alt="{{img.alt}}" title="">
<!-- Blog slug -->
<br>
<i class="{{post.icon}}"></i>
<p>{{post.gallery_text|safe|truncatewords:30}}</p>
</div>
<h4 class="name">
{{post.title}}
</h4>
<div class="post-info">
<div class="post-date">
<strong>Tags:</strong>
{% for tag in post.tags.all %}| {{tag}} |{% endfor %}
</div>
<div class="post-date">{{post.published_date}}</div>
</div>
</figure>
{% endfor %}
Any ideas what could be going wrong?
You likely have some Javascript that does that to links that have the (rather telltale named) ajax-page-load class.
This question already has an answer here:
How to load more content in django application?
(1 answer)
Closed 3 years ago.
In the profile page, I want to display posts of a user. Each post might have several comments, I don't want to display all the comments to the post instead I want to display only few comments and add load more comments option. If a user clicks load more comments then I want to display some more comments. What is better way to do this? I am already using infinite scroll using pagination for posts. I think this may not work for comments.
My currents code looks like below
{% for post in post_queryset %}
<div class="title">
{{ post.title }}
</div>
{% for comment in post.comments.all %}
</div>
{{ comment.text }}
</div>
{% endfor %}
{% endfor %}
Above code simplified version of original to make things easier.
For dynamic page content, the best way to go is to use jquery and bootstrap.
When rendering the template, you could add the class "d-none" (which hides the content of the element) in the 10th or latter element:
{% for post in post_queryset %}
<div name="comment-block">
<div class="title">
{{ post.title }}
</div>
{% for comment in post.comments.all %}
<div {% if forloop.counter > 9 %} class="d-none" {% endif %} >
{{ comment.text }}
</div>
{% endfor %}
<button type="button" name="more_comments" class="btn btn-primary" > more comments </button>
</div>
{% endfor %}
This way, all the comments will be rendered, but only the first 10 will be on display.
After that, a jquery function triggered by the button click should do the trick
$("[name='more_comments']".click(function(){
var hidden_comments = $(this).parent().find('.d-none'); // selects all hidden comments
$(hidden_comments).each(function(){$(this).removeClass('d-none')}); // removes 'd-none' class
})
Keep in mind that your original code, neither my answer, does not comply with bootstrap, which is highly recommended. You can learn more about bootstrap in https://getbootstrap.com/.
I am creating a Django blog app and I was wondering if it was possible to have the first blog post as pictured in this design.
What I have done so far is that I have been able to get the bottom three articles but I have been confused on how to approach the top post.
This is my template code so far:
<div class="row">
<!-- Blog Entries Column -->
{% for article in articles %}
<div class="col-lg-4 mt-4 ">
<div class="card mb-4">
<div class="card-body">
<h2 class="card-title">{{ article.title }}</h2>
<p class="card-text text-muted h6"> <img class="image-size radius-of_image" src="article/{{ article.upload_image }}"> | {{ article.author }} | {{ article.created_on | date}} </p>
<p class="card-text">{{article.content|slice:":200" }}</p>
Read More →
</div>
</div>
{% if forloop.counter|divisibleby:"3" and not forloop.last %}
<div class="row">
{% endif %}
</div>
{% endfor %}
</div>
</div>
This is how my views look like
def home(request):
if request.method == 'GET':
queryset = Post.objects.filter(status=1).order_by('-created_on')
articles = {
"articles": queryset
}
return render(request, 'home.htm', articles)
django has several template filters which are easy to use and avoid headache of developers. You can use {{ value|first }} to display the first model instance in your template from your query set
I'm making a site for which I use cmsplugin-articles 0.2.2. That means that there's a page on the site (News) which has nested child pages which are the news. In the parent page you view a list of news teasers. (This is the way the plugin works.)
Looking into the template of the article teaser that the plugin provides:
{% load article_tags i18n %}
<div class="article">
{% block teaser_head %}
<time datetime="{{ article|published_at|date:"Y-m-d" }}">{{ article|published_at|date:"d.m.Y" }}</time>
<h2>{{ article|teaser_title }}</h2>
{% endblock %}
{% block teaser_body %}
{% with article|teaser_image as image %}
{% if image %}
<img src="{{ image.url }}" />
{% endif %}
{% endwith %}
<p>
{% teaser_text article %}
{% trans "More" %}
</p>
{% endblock %}
</div>
you can see the templatetag {% teaser_text article %} that should show some kind of text in the news teaser when rendering the News page.
I've published some news with some text for each one and when I go to the News page I can see the teasers list ok, but not any text, only the title, date, paginator and the "more" link, that proceed from other templatetags different than {% teaser_text %}.
Now the question is: does anybody knows how I can show each news text into each teaser (better an extract) when rendering the News page?