I created a custom field and assigned it to the products and I want to display that custom field value on the listing page. On the description.html.twig page, I add this below variable and the value is showing on the detail page.
{{ page.product.translated.customFields.custom_events_dates }}
The same variable I placed on the box-standard.html.twig, but the value is not showing.
{% sw_extends '#Storefront/storefront/component/product/card/box-standard.html.twig' %}
{% block component_product_box_info %}
{{ parent() }}
<div class="test">
<p>{{ page.product.translated.customFields.custom_events_dates }}</p>
</div>
{% endblock %}
How can I display the custom field value on the listing page?
You need to use product.translated without the page. The page object only contains the product data on a product detail page, on listing pages it is not set.
Related
To my understanding, by using twig's extends method, it should be possible to add code to the footer from within a template that is included anywhere else.
Like if we render the main page and have a <form> there in a template edit_form.html.twig and we know we need special javascript here (only for that form) so we decide to add this javascript tags in the footer at the end of the page like this:
edit_form.html.twig
{% block edit_form %}
<form id="editForm">
<!-- form html here -->
</form>
{% endblock edit_form %}
{{ include('edit_form_js.html.twig') }}
We want this javascript to be at the end of the page:
edit_form_js.html.twig
{% extends "footer.html.twig" %}
{% block js %}
{{ parent() }}
<script>
// special js code only needed for the <form>
</script>
{% endblock js %}
footer.html.twig
{% block js %}
<script src="jquery.js"></script>
{% endblock js %}
But doing this does not add the custom form javascript at the end after the jquery inclusion but results in the block js being twice on the page (after the form and in the footer)
Is my understanding of twigs extends wrong?
Q: Is there any way to add code from anwywhere to the footer?
Included templates don't know anything from the template it's being called from. There for an included template cannot alter a block from that said template. You might want to have a look at the deferred extension
I am using django-el-pagination package and trying to implement digg-style pagination on my home template. I am displaying it with..
{% get_pages %}
{{ pages.get_rendered }}
and it is showing like this <1234567> which is fine but
I want to add some css or class to change the way it look.
If you have any other way to achieve this. Please suggest..
please tell how can I customize it.
You can change it to make it looks something like this or like whatever you want:
Here is an example:
{% get_pages %}
<div class="pagination">
{% for page in pages %}
<li class="page-item">{{ page.number }}</li>
{% endfor %}
</div>
You can check the documentation here: https://django-el-pagination.readthedocs.io/en/latest/templatetags_reference.html#get-pages to check all the available options for get_pages
I am trying to work out the correct way to created a Twig component that has sections that are nested 3 deep.
I have a twig file that just creates a header with a class:
header.twig
<h2>{% block content %}{% endblock %}</h2>
and then a twig file that is mid level that consumes that header along with other low level twigs:
section.twig
<div class="section">
{% block header %}
{% embed "components/header.twig" %}
{% block content %}
{{ header }}
{% endblock %}
{% endembed %}
{% endblock %}
</div>
and then finally, page high level component that consumes the section twig:
page.twig
<div class="page">
{{ include("mid/section.twig", { header: fields.header }) }}
</div>
Now as you can see in the section.twig I'm able to override the block I create but in the highest level page.twig I can't override a block twice so I have to use an include instead of an embed.
To me this doesn't feel right and it feels very verbose. To clarify, I am using ACF so that's where fields.header comes from and yes I know that the header.twig can access that value directly but I am trying to create a structure in which the low and mid level components are "dumb" and the high level component controls the data.
For my given situation, am I going about this the best way that I can or is there another cleaner way that doesn't involve mixing embeds and includes?
I need to generate a menu that lists all pages (like the sitemap sample) but if a page has childs it should become only a toggle for its submenu, not linking to any page. Only the innermost childs will be pages.
E.G.:
about (link)
portfolio (no link - only toggle)
work01 (link)
work02 (link)
contacts (link)
As I said, the summentioned sample creates and links a page also for "portfolio".
My site is here andrearicci.it (subpage) and the menu item "projects" now toggles the submenu, but I can't get rid of its link - so I had to format an unwanted 'projects summary' page.
On that page the menu is
<nav>
<ul class="projlist">
{% for project in site.get('/projects').children %}
<li{% if this == project %} class="active"{% endif
%}>{{ project.name }}</li>
{% endfor %}
</ul>
</nav>
I wish an automatic solution, that could work also adding other page groups (e.g. paintings/web design/whatever) without the need of changing it every time.
Is it maybe more a question about Jinja other than Lektor?
Thank you for any help.
A.R.
Idea: just test if the page contains children, if so - do not link the page.
The test should be as easy as
{% if project.children %}
{# no link #}
{% else %}
{# link #}
{% endif %}
I am trying to hide CRUD elements in TWIG so that it only appears for the specified ROLE_USER.
Right now I am using IS_AUTHENTICATED REMEMBERED which works against anonymous users but other logged in users are still able to see this.
{% if is_granted('IS_AUTHENTICATED_REMEMBERED') %}
<li>
<a href="">
Create a new entry
</a>
</li>
{% endif %}
I want to only show this to the specific ROLE_USER that I have set in the access_control in security.yml and the controller. For instance the code above should only be shown to ROLE_USER1.
What is the command to do this in Twig?
Use is_granted('ROLE_USER1')
{% if is_granted('ROLE_USER1') %}
<li>
<a href="">
Create a new entry
</a>
</li>
{% endif %}