I have problem for displaying img, i saved images with name of book and now to access them need to concatenate .jpg extension. So my problem is how to concatenate variable and string inside twig template ?
<img src="{{ path({{ book.name ~ '.jpg' }}) }}"/>
here is full code:
{% for book in books %}
<a href="{{ path('AppBundle_Book_detailsBook', {'bookId': book.id}) }}"
class="col-2 white kartica">
<img src="{{ path({{ book.name }} ~ '.jpg' ) }}"/>
<h4>
{{ book.name }}
</h4>
</a>
{% else %}
No books.
{% endfor %}
Based on your comments, I think this is what you need:
<img src="{{ asset( '../app/Resources/images/covers/' ~ book.name ~ '.jpg') }}"/>
You might need to adjust the path slightly. Assets start from the web/ directory. I think you should get the idea.
By the way, thank you for making a detailed post!
Why donĀ“t you try these:
<img src="{{ path( book.name ~ '.jpg' ) }}"/>
Related
Trying to do "if homepage hide " a button.
Current code is here...
<div class="mobile-bar sticky-bar">
{% if j3.settings.get('mobileCustomMenuStatus1') %}
<a class="mobile-custom-menu mobile-custom-menu-1" href="{{ j3.settings.get('mobileCustomMenuLink1.href') }}" {{ j3.linkAttrs(j3.settings.get('mobileCustomMenuLink1.attrs')) }} style="margin-left:10px; margin-right:-30px">
{{ j3.countBadge(j3.settings.get('mobileCustomMenuLink1.name'), j3.cache.update(j3.settings.get('mobileCustomMenuLink1.total')), j3.settings.get('mobileCustomMenuLink1.classes')) }}
</a>
{% endif %}
{% if j3.settings.get('mobileCustomMenuStatus2') %}
<a class="mobile-custom-menu mobile-custom-menu-2" href="{{ j3.settings.get('mobileCustomMenuLink2.href') }}" {{ j3.linkAttrs(j3.settings.get('mobileCustomMenuLink2.attrs')) }}>
{{ j3.countBadge(j3.settings.get('mobileCustomMenuLink2.name'), j3.cache.update(j3.settings.get('mobileCustomMenuLink2.total')), j3.settings.get('mobileCustomMenuLink2.classes')) }}
</a>
{% endif %}
You can store the current page within a $data variable in your menu controller just like this:
$data['current_url'] = $_SERVER['REQUEST_URI'];
Within your twig file you can check it's value against whatever you want. This can be achived using a small vqmod or ocextension.
I'm using the twig function sort in my symfony template, this one work when my APP_ENV=devbut not when APP_ENV=prod.
This is how I use it :
{% for site in app.user.bailleur.sites | sort %}
<li>
<a href="{{ path('site', {'slug':site.slug}) }}">
{{ site.adresse }}
</a>
</li>
{% endfor %}
Did someone know why it's doing this ?
I have problem with accessing by the link. I am using easy-thumbnail framework, and I created simple view for user list to list all existing users.
Error message:
django.template.exceptions.TemplateSyntaxError: Variable
'user.profile.photo' is an invalid source.
Django Traceback throws me to this view.
views.py file:
#login_required
def user_list(request):
users = User.objects.filter(is_active=True)
return render(request,
'account/user/list.html',
{'section': 'people',
'users': users})
urls.py file:
path('users/', views.user_list, name='user_list'),
template list.html:
{% extends "base.html" %}
{% load thumbnail %}
{% block title %}People{% endblock %}
{% block content %}
<h1>People</h1>
<div id="people-list">
{% for user in users %}
<div class="user">
<a href="{{ user.get_absolute_url }}">
<img src="{% thumbnail user.profile.photo 180x180 %}">
</a>
<div class="info">
<a href="{{ user.get_absolute_url }}" class="title">
{{ user.get_full_name }}
</a>
</div>
</div>
{% endfor %}
</div>
{% endblock %}
sample code from base.html:
<li {% if section == "people" %}class="selected"{% endif %}>
People
</li>
models.py:
class Profile(models.Model):
user = models.OneToOneField(settings.AUTH_USER_MODEL,
on_delete=models.CASCADE)
date_of_birth = models.DateField(blank=True, null=True)
photo = models.ImageField(upload_to='users/%Y/%m/%d/',
blank=True)
def __str__(self):
return f'Profile for user {self.user.username}'
Thank you for the helping in advance.
Reviewed the documentation https://easy-thumbnails.readthedocs.io/en/latest/usage/#templates. Creates a thumbnail from an object (usually a file field). I tried it and it helped solve my problem:
<img src="{{ user.profile.photo.url }}">
I had this problem too. You can solve the problem with the following solution:
Instead of users = User.objects.filter(is_active=True), use profiles = Profile.objects.all()
Change as follows: return render(request,'account/user/list.html',{'section': 'people', 'profiles': profiles}).
In the list.html file, change as follows:
{% extends 'base.html' %}
{% load thumbnail %}
{% block title %}People{% endblock %}
{% block content %}
<h1>People</h1>
<div id="people-list">
{% for profile in profiles %}
<div class="user">
<a href="{{ profile.user.get_absolute_url }}">
<img src="{% thumbnail profile.photo 180x180 %}" alt="{{ profile.user.last_name }}">
</a>
<div class="info">
<a href="{{ profile.user.get_absolute_url }}" class="title">
{{ profile.user.get_full_name }}
</a>
</div>
</div>
{% endfor %}
</div>
{% endblock %}
I have a a list of entries.
Each entry has a related person.
Each related person has an avatar.
On my index page I am looping over the entries and creating a <div> with the persons details. Eg
{% set person = entry.relatedPerson[0] ?? null %}
<p>{{person.firstName}} {{person.lastName}} </p>
I need to access the picture related to the person.
Have tried this which displays a list of every asset that is an image in its own div.
{% set person = entry.relatedPerson[0] ?? null %}
{% for image in craft.assets.kind('image') %}
<li>
<img src="{{ image.getUrl }}" alt="{{ image.title }}">
</li>
{% endfor %}
I have also tried this which shows nothing
{% set person = entry.relatedPerson[0] ?? null %}
{% for image in person.assets.kind('image') %}
<li>
<img src="{{ image.getUrl }}" alt="{{ image.title }}">
</li>
{% endfor %}
How can I add the relatedPerson image to each card?
Also it would be great if you could explain as I'm not understanding templating. The docs aren't sufficient for me
I think you missed the parenthesis after getUrl "()" in your code to fetch the image. The getUrl is a method.
{% set person = entry.relatedPerson[0] ?? null %}
{% for image in craft.assets.kind('image') %}
<li>
<img src="{{ image.getUrl() }}" alt="{{ image.title }}">
</li>
{% endfor %}
Use the getUrl as I used in the above code.
I hope it will work for you.
Thanks.
If you want to get the image, Try the below code:
{% for block in entry.relatedPerson.all() %}
{% set image= block.<image-handle>.one() %}
<li>
<img src="{{ siteUrl }}<image-path>/{{ image.filename}}" alt="{{ image.filename }}">
</li>
{% endfor %}
I have a page whose structure is somewhat like this
---
layout: contents
title: contents
description: Contents of the posts.
permalink: contents/
---
<ul class="posts">
{% for post in site.posts %}
{% if post.categories != "tips" %}
<h2><a class="post-heading" href="{{ post.url }}">{{ post.title }}</a></h2>
<p> {{ post.description }} </p>
<p class="date">{{ post.date | date_to_string }}</p>
<hr class="hr-color"></hr>
{% endif %}
{% endfor %}
</ul >
Currently the URL of this page is set according to permalinks(BASE_URL/contents). I want that when a user clicks on an option( Android,Java,Web are the options) in the previous page, i get the URL of this page as BASE_URL/android or BASE_URL/Java and also display the contents of that category.
Is this possible using jekyll?
Two solutions :
1 - Using a plugin
You can use this category archive generator
2 - Using hand crafted pages
If you cannot use plugin (gh-pages) you can make a page per category, like this :
android.html
---
layout: category
title: Android
permalink: android/
---
_layouts/category.hmtl
---
layout: default
---
<ul class="posts">
{% for post in site.posts %}
{% if post.categories contains page.title %}
<h2><a class="post-heading" href="{{ post.url }}">{{ post.title }}</a></h2>
<p> {{ post.description }} </p>
<p class="date">{{ post.date | date_to_string }}</p>
<hr class="hr-color"></hr>
{% endif %}
{% endfor %}
</ul >