New answers tagged theming
1
Here is how I've been able to display the label of a Single Choice Text List inside a custom Entity referenced on a node with an EntityReference field :
{% for entity_ref_item in node.field_my_entity_ref_field %}
{% set my_choice_key = entity_ref_item.entity.field_my_list_field.value %}
{% set my_choice_label = entity_ref_item.entity.field_my_list_field....
1
The "connected" exposed sorting criteria is implemented in the Facets module and Search API.
Here's a tutorial that can help get you started: Creating a Faceted Search View in Drupal 8 using the Search API Modules
Before you start testing new modules maybe the "ordinary" Exposed Sort criteria in Views can help. Create only one Page display, but add all 3 ...
0
Use the Empty Page module and create an empty page.
Just like node content types, you can create a custom block type in /admin/structure/block/block-content/types
Add fields to your block type, and then in /admin/structure/block/block-content create a block of your block type.
Place block in content region and for Visibility > Pages put the URL for your ...
0
For flag count to make it work in AJAX workflow:
Use Dev version of Flag which has the flagcount function exposed to
twig template.
In flag.html.twig Add: {% set count = flagcount(flag, flaggable) %}
use {{ count }} to display the counter.
0
The comments in this question were helpful, but I can't credit both people so I will post the answer.
My default views-view-unformatted.tpl.php had an extra closing tag inside of it somehow. Not sure how since it's a default views display. Removing the tag fixed the issue.
0
Joery Lemmens posted an answer to a similar question on Drupal's forums:
use Drupal\block\Entity\Block;
/**
* Implements hook_preprocess_HOOK().
*
* Pass block region value to content so this can be used in
* MYTHEME_theme_suggestions_menu_alter.
*/
function MYTHEME_preprocess_block(&$variables) {
if (isset($variables['elements']['#id'])) {
$...
0
The following does also work when twig debugging is enabled:
{% set sidebarLength = page.sidebar_first|render|trim|striptags|length %}
{% if sidebarLength > 1 %}
{% set has_sidebar_first = page.sidebar_first %}
{% else %}
{% set has_sidebar_first = null %}
{% endif %}
0
I think your easiest approach would be to modify the field template and add a wrapping span with classes you need.
field--field-name.html.twig:
{% for item in items %}
<span{{ item.attributes.addClass('my-class') }}>{{ item.content }}</span>
{% endfor %}
or replace span and content with to add class directly to <a> tag:
<a href="{{ ...
0
You can change the favicon with MYTHEME_page_attachment_alter.
First you should remove the favicon added by the theme with.
unset($attachments['#attached']['html_head_link'][0]); as mentioned here then add you favicon here is a code sample works for me.
/**
* Implements hook_page_attachments_alter().
*/
function MYTHEME_page_attachments_alter(array &$...
0
If its not a browser cache issue perhaps you should try modifying it with a hook called later namely THEMENAME_preprocess_html
function THEMENAME_preprocess_html(array &$variables) {
$test = "";
$variables["page"]["#attached"]["html_head_link"][0][0] =
array(
'rel' => 'shortcut icon',
'href' => '/themes/fu/favicon_urbana.png',
...
0
Might be able to do a toString and if it's not actually a link that will come back empty
{% if item.below and item.url and item.url.toString|length > 0 %}
0
Ok. It's resolved. I cleared the browsers cache in Safari under: Preferences/Privacy/Manage Website Data and there I searched for my site name, selected it and hit "remove all". Therefore I presume it was my Safari browser's cache.
0
In the "Custom Text" field, {{ name }} is only available to render the "Product Name" field inside the "Custom Text" field (in the view UI), not in a twig template.
You should try to access your fields in the twig template like this {{ row.content.name }} (check the available fields using devel/kint).
0
This code will be work properly for printing separate URL and Title of the link field in twig.
{{ content.field_link[0]['#url'] }}
{{ content.field_link[0]['#title'] }}
5
There's an interesting development going on regarding themes and OOP. Look at Allow themes to provide services.yml which finally got closed as Won't Fix. From Mark Carver's closing comment:
I really don't think we should be opening up themes to services
anymore.
A lot has changed (for the better) in the 5 years I've been following
this issue (...
1
I believe it should but looking at bootstrap they seem to be needing a fix
https://git.drupalcode.org/project/bootstrap/blob/8.x-3.x/autoload-fix.php
3
Drupal offers a helper function for building URLs in Twig templates.
{{ url('entity.node.canonical', {node: nid}, {query: {foo: 'bar'}}) }}
1
I think this is the problem, you are trying to get the node from the route, only, you are not on a node route, you are on an entity_print route, so node is not available.
As a side note, you should always check that the field exists before trying to get the value. Before you try something like this:
$vars['field_name'] = $entity->get('field_name')->...
0
If you want to use a field value in child paragraph within the parent paragraph, you can use this (replace of course field_with_paragraph_childs and field_name_field with the actual fieldnames):
{% for key, item in paragraph.field_with_paragraph_childs if key|first != '#' %}
<div class="some_additional_markup">
{{ item.entity....
0
I combined Classy's field.html.twig with Rene's suggestion, in the file field--node--field-tags.html.twig:
{%
set classes = [
'field',
'field--name-' ~ field_name|clean_class,
'field--type-' ~ field_type|clean_class,
'field--label-' ~ label_display,
]
%}
{%
set title_classes = [
'field__label',
label_display == '...
3
my variable was rendered through
\Drupal::service('renderer')->render()
Don't do that - Drupal sets Twig up to understand render arrays. Just use:
{{ original_description_render_array }}
0
If hook_element_info_alter() doesn't go far enough for you, there's a core issue to add a hook_element_plugin_alter() to directly alter the plugin class for an Element (of which RenderElements are a subset): https://www.drupal.org/project/drupal/issues/2987208
The core patch is a one-line addition of $this->alterInfo('element_plugin'); in ...
0
Custom Function:
function custom_ImageURL() {
$imageURL = NULL;
$imageFieldName = // However you're getting your field name.
// Check the field exists.
if (!empty(FieldConfig::loadByName('user', 'user', $imageFieldName))) {
// Check there is a primary image.
if ($user->$imageFieldName->entity) {
$imageURL = $user->$...
0
I think creating a service REST API to be consumed by the client sites is the cleanest solution.
This has been implemented in Drupal 7 with sharedblocks but there no Drupal 8 port at this time.
Studying this module would give you a solid foundation on how to accomplish your task in Drupal 8.
Based on the same concept there is also distributed_blocks ...
1
You can try to apply getValue() of the field handler on the result row, for example:
{% if view.field.field_name.value(view.result[key]) %}
Edit:
In a views table template row is not of the type ResultRow, so you need to get it directly from the view object using key of the loop {% for key, row in rows %}.
See these questions for different views ...
1
$build = [
'#theme' => 'my_theme_key',
'#page_params'=> $nodes,
'#attributes' => [
'class' => ['my_top_message'],
],
];
$response = new AjaxResponse();
$response->addCommand(
new HtmlCommand('.result_message', $build)
);
return $response;
Theme hook
function mymodule_theme() {
return [
'my_theme_key' => [
'theme' =&...
1
The replacement for theme() is a build array with a '#theme' key, as you already have for the page.
In Drupal 8 pass this or the other build array from your question unrendered to an ajax html command, because render() in custom code should be avoided if possible:
$build = [
'#type' => 'container',
'#attributes' => [
'class' => ['...
0
I stumbled upon the same issue and solved it with these commands:
reinstall via composer require drupal/fontyourface, but do not enable it
drush config-delete views.view.fontyourface_font_manager
drush config-delete taxonomy.vocabulary.font_classification
drush config-delete taxonomy.vocabulary.font_designer
drush config-delete taxonomy.vocabulary....
0
The example above for hook_toolbar is almost perfect. I fixed it, see code below.
You just have to remove the span on the Language : EN then the click functionality works perfectly.
see my code:
/**
* Implements hook_toolbar().
*/
function examplemodule_toolbar() {
// Get languages, get current route.
$current_language = \Drupal::languageManager()-&...
0
Notes:
The View has to be a block.
Exposed filters can be added but will not be displayed on your page.
You can set them in your page, eg for a 'severity' field:
$filters = $view->getDisplay()->getOption('filters');
$filters['severity']['value'] = [0,1,2,3,4,5,6]; // include a set of values.
$view->getDisplay()->overrideOption('filters', $...
1
The proper way to modify the loading order is weight property as described here. The lower the weight the further up your library should go.
Try something like the following in your trent/trent.libraries.yml
bootstrap:
css:
base:
libraries/bootstrap/bootstrap.min.css: {weight: -50}
You might have to adjust the number to get it to desired ...
-1
I think the answer from @ipwa is close but is not quite there.
What you want is an output like this:
<img src="/fallback.jpg" srcset="/1x.jpg 1x, /2x.jpg 2x, /3x.jpg 3x" />
Here's what you need to do:
Enable both the Breakpoint and Repsonsive Image Style modules.
Add an image field for uploading 1 image to a content type. Editors should upload the ...
1
Twig uses hashes where PHP uses associative arrays. So to fix your code just convert the array syntax to a hash literal:
{{
path('blue_general.blue',
{'node': node.id},
{'query': {
'destination': path('view.blue_search.page_1'),
'cookie[blue_referrer]': node.id,
'cookie[blue_type]':'node'
}}
)
}}
0
Responsive images in Drupal 8 rely on HTML picture element and srcset attribute. That's not something that can be applied to background. Instead you need to user media queries in your CSS to specify different background images for different screen sizes.
0
You're probably looking for the username theme:
$variables['userName'] = [
'#theme' => 'username',
'#account' => $account,
];
0
The script.js started working after I cleared all caches.
If you're having this problem and followed Drupal's official documentation then login to your Drupal site as admin and In Performance section click clear all caches
navigate to: Home >> Administration >> Configuration >> Development
0
It work for me =)
$field_link_file = field_get_items('node', $node, 'field_docs_files');
$file_url = file_create_url($field_link_file[0]['uri']);
$parts = pathinfo($file_url);
$extension = $parts['extension'];
if ($extension == 'jpg' || $extension == 'png' || $extension == 'tif') {
$options = array(
'type' => 'colorbox',
'label' => 'hidden',
...
1
I don't know why, but when I tried {{ link.text }} one more time - it worked great!
Maybe I forgot to clear cache, when I used it for the first time, I don't know, but I think I should leave this answer for anyone who will search for it.
1
Maybe this is a render array and you need to use link['#text'] here (sorry if I'm on the wrong track).
Edit: If {{ link.text }} worked on subsequent tries, then my answer is definitely wrong, and the reason for your problem was probably related to caching or something.
0
After a lot more digging and trying things without success, I ended up solving the problem of passing a value from a block's preprocess hook to a twig template where the block is inserted as per my third option above. Here's what I did:
Follow the instructions at http://www.tothenew.com/blog/overview-of-twig-extentions-in-drupal-8 to create a twig extension....
0
Instructions for the Critical CSS module:
Navigate to: admin/config/development/performance/advagg/critical-css
Under Add Critical CSS
- Select the theme that is your front page; usually the default is correct.
- User type should be set to 'anonymous' under most circumstances.
- Type of lookup, select URL
- Value to lookup, type in
- Critical CSS, paste ...
0
Try with the value of the field and then concatenated with " like the second way:
I tested it with the following:
"name" : {{ content.field_text_test.0['#context']['value'] }} <br>
"name" : {{ '\"' ~ content.field_text_test.0['#context']['value'] ~ '\"' }} <br>
"name" : {{ '\"' }} {{ content.field_text_test.0['#context']['value'] ~ '\"' }} {{ '\"...
1
In order to get this to work, I did the following. This assume you have access to the $node object, which you would if you are performing this within the hook_preprocess_node() hook.
$variables['url'] = $node->toUrl()->setAbsolute()->toString();
1
I'd recommend not to use field templates for things like this, but use an entity template (like paragraph--BUNDLETYPE.html.twig) instead.
In an entity template you can access the rendered HTML output of any sub-field like {{ content.field_whatever }}, but you can also access raw field values for stuff like {% if paragraph.field_whatever.value == 'foo' %}
2
Here's what worked for me to manually get parts of a field in a paragraph template.
This is in a field template for the actual paragraph, so for me field--field-paragraph.html.twig. I have an image field with the machine name field_image. This prints just the alt text of that image.
{% for item in items %}
{{ item.content['#paragraph'].field_image.0.alt ...
1
As far as I understand you could restrict block from being shown in front page, from block visibility settings. Alternatively, you could also make a custom template for the front page.
1
Views sets the title configured in a Views page statically in the route definition. Get this title from the current route in a preprocess hook for your specific block content UUID. Add a routecache context, so that the block changes the title when you visit different pages:
function mytheme_preprocess_block(&$variables) {
if ($variables['plugin_id'] ==...
0
You can use the patch (https://www.drupal.org/project/switch_page_theme/issues/2929541) in Switch Page Theme module to show the same nodes with different themes.
0
For those who are struggling for configuring caching for Drupal 8
- Just copy the example.settings.local.php which is located outside of the files folder into files folder with settings.local.php
- uncomment $settings['cache']['bins']['dynamic_page_cache'] = 'cache.backend.null';
- Again, uncomment $settings['cache']['bins']['page'] = 'cache.backend.null';
0
drupal_entity() is for rendering entities. For rendering block plugins use drupal_block() instead.
The difference is explained very well in the following guide.
https://www.drupal.org/docs/8/modules/twig-tweak/rendering-blocks-with-twig-tweak
Top 50 recent answers are included
