Why twig code in craftcms can't generate new code on localhost? - twig

In craftCMS I've created a field to load content but this field is not showing up when i change my code in the template. I've checked if I used the correct folder
At first i thought it was the cache but when i go to utilities to clear the cache the same error still occurs. Also when I write any new character other than twig code the browser gives an error with the new code but when I delete it, it's still the same old code
Here is my code:
{% extends "index" %}
{% block content %}
This is not generate on my local
<div class="can't load new code below and new class right here"
{{ entry.headingDescription }}
{{ entry.headingTitle }}
</div
{% endblock %}
My structure:

Related

How to output an uploaded SVG as code in Timber

I'm building a site with Wordpress + Timber and need to output an uploaded SVG image as code.
Here's what I've got, but it's not working:
{% for block in section.blocks %}
<img src="{{ Image(block.icon).src }}"> <!-- this works as exptected -->
{{ function('file_get_contents', Image(block.icon).src) }} <!-- this fails -->
{% endfor %}
The error generated is "failed to open stream", but the URL that Image(block.icon).src provides is a full, valid URL (ie I can go to it in my browser and it loads).
What am I missing? Or is there a better approach?
{{ function('file_get_contents', Image(map.flag).src) }} works for me. Should work for you if you are using advance custom fields in WordPress.
There is two way to load external code in twig file.
Include method :
{% include 'my.svg.twig' %}
Twig source function :
{{ source(my.svg.svg) }}
Also, you can try WP_PLUGIN_DIR constant with file_get_contents + your file url.
{{ function('file_get_contents', 'WP_PLUGIN_DIR'.Image(block.icon).src) }}
PS. Source function works like include.
More info about twig source function is here : https://twig.symfony.com/doc/2.x/functions/source.html

Render a link field inside a paragraph template drupal 8

I have a paragraph called link. In this paragraph there is a single link field that allows multiple values. In the paragraph-link.html.twig file I want to render all of the links added to the paragraph. Instead I get the same link duplicated as many times as the number of link values. So if I add two links, it renders the first link twice. I also need it to work with external and internal links. Currently it only renders the external links properly (but only ever renders the first one).
{% for item in paragraph.field_link %}
{{ paragraph.field_link.title }}
{% endfor %}
Thanks for the comments, the following is working for external links but not internal ones. Internal link URI renders as "internal:/"
{% for item in paragraph.field_link %}
{{ item.title }}
{% endfor %}
With the help of the comments I was able to get this working as I wanted within the paragraph template. Below is the working code for a Link field that allows multiple values within a paragraph field.
{% for item in paragraph.field_link %}
{{ item.title }}
{% endfor %}

How to push values to array in templates and partials to output them in layout?

We are using Twig as our templating engine but I'm stuck with a problem of the rendering order now. See - https://straightupcraft.com/articles/twig-processing-order
We are using amp for our new site and with amp and web components in general it is necessary to import the components (once) to use them. So the idea was to create a Twig Extension to accomplish exactly this. Everytime a component is used it is called via this twig function call. The function is checking the component, adding it to a stack and you can use it from now on. The stack then is transformed into a list of imports for the head of the page.
The problem here is Twigs top to bottom rendering. When I call said function in a partial or a template the rendering of "layout.twig" already took place and all function calls below/after are not affecting the stack.
Is there an option to change the rendering to inside out, so that the rendering is first using the lowest partial and "bubbles" up to templates and finally layout without them rendering before?
Another way to get the values in layout would nice as well.
Desired behavior:
Layout.twig
{{ getAllComponents() }}
{# should output component1 and component2 #}
{% block content %}
Page.twig
{% extends Layout.twig %}
{{ addComponent('component1') }}
{% include partials.twig %}
<component1>...</component1>
partials.twig
{{ addComponent('component2') }}
<component2>...</component2>
Actual behavior:
Layout.twig
{{ getAllComponents() }}
{# is empty #}
There is no option to change this behavior. However you can use a trick to archive this:
Render your content to a variable before you call getAllComponents()
layout.twig
{% set mainContent %}
{% block content %}{% endblock %}
{% endset %}
{{ getAllComponents() }}
{{ mainContent }}
There actually is a magical solution to this problem -- some genius wrote this Deferred Twig Extension which lets you run some code (output a variable, call a function, etc) in a block near the top of your layout, but wait until the rest of the twig templates have parsed before executing them. There's an example on that github page showing how you can achieve this.
As far as I know, no you cannot switch the rendering of a TWIG template.
However, I would recommend possibly looking at the {% embed %} or {{ render }} tags.
Embed allows specific TWIG files to be placed within others with variables, so you could pass each component into their relevant partials.twig file.
Render allows the use of embedding a separate controller action, so you create a ControllerAction that took in a component variable and renders its own TWIG file.
Documentation on Embed: https://twig.sensiolabs.org/doc/2.x/tags/embed.html
Documentation containing Render: https://twig.sensiolabs.org/doc/2.x/api.html

symfony3 override fields theme from vich bundle

I have installed VichUploaderBundle into my Symfony app and would like to have better control of the appearance of the upload buttons. I have taken the contents of fields.html.twig located in the bundle itself, and copied them into the same file at the path app/Resources/views/myControllerName/fields.html.twig This is also where all the other twig templates are for that set of controllers.
I can not seem to affect anything on the page through this method. Yes I have cleared the cache, I have even removed the cache directory.
Am I placing the file in the wrong place?
You can override that form theme in many ways, just when you customize vich_file_widget and/or vich_image_widget e.g.:
{% extends 'base.html.twig' %}
{% form_theme form _self %}
{% block vich_file_widget %}
{# some content… #}
{% endblock %}
{% block content %}
{{ form(my_form) }}
{% endblock %}
Thanks for the effort #jkucharovic, I was already using the 3rd method you were suggesting. My question was whether or not I put the fields.html.twig file in the correct place. Turns out I did not. For others that come along with this question, to override the fields file in the VichUploaderBundle for twig you must put a copy of the fields.html.twig file at the following path so that Symfony can override what comes with the bundle.
the fields file is found here and should not be edited...
vendor/vich/uploader-bundle/Resources/views/Form/fields.html.twig
a copy of that file should be placed here in Symfony 3. This file is editable.
app/Resources/VichUploaderBundle/views/Form/fields.html.twig

Combining optional block with element in twig

In defining a base template in twig, I want to reserve an area for special notifications, using a block. It could be an extra sidebar that may contain all kinds of things (calendar, or some extra information, whatever.) The default should be emtpy, but any child template may extend and fill it.
Now I want to have all those extensions be included in a <div class='special-sidebar'> if the block is extended, and not show anything if it is not included. Is there any way to define the containing element in the base template?
{# Base template #}
Content etc...
{% block special %} {# may be overridden by child template #}{% endblock %}
{# child template #}
{% block special %} Here, the special sidebar is filled! {% endblock %}
The base page should show just the content:
// base template:
Content etc...
And the child page:
// child template
Content etc...
<div class"special-sidebar"> Here, the special sidebar is filled! </div>
Where and how do I put the html for this? I could define it in every child, but that means you have to remember to use the correct html each time, I'd rather set this in the base template and not bother with it. But I don't want empty elements in my page if the block is not overridden.
You can solve it like this, if you want to display a certain block only if it has content. Hope, this is what you're looking for.
Example index.html.twig
{% set _block = block('dynamic') %}
{% if _block is not empty %}
{{ _block|raw }}
{% endif %}
Example part.html.twig
{% extends "index.html.twig" %}
{% block dynamic %}
Block content goes here.
{% endblock %}
Source: How to check if a block exists in a twig template - Symfony2

Resources