如何使用图像样式路径的图像与枝模板 -- theming 领域 drupal 相关 的问题

How to get image with image style path to a twig template


1
vote

问题

中文

我创建了一个名为TV_Adbackground的字段,在提起录制为Uplaood背景图像的BLE。

上传工作很棒!

如何获取文件的路径或图像样式介质或略管进入枝模板?

  ...  <div id="advertisement"> <!-- background-image uploaded on theme settings page should be used here ->    <div id=advertisement-dimmer>   <h3 class="adheading">{{ tv_adheading }}</h3>  <div id="admessage">{{ tv_admessage }}  <div class="btn-group adbuttons" role="group" aria-label="Basic     example"> <button type="button" class="btn btn-primary btn-lg"><a  style="color:#fff;" href="/signup">Register</a>    </button> <button type="button" class="btn btn-default btn-lg"><a  href="/user/login">Login</a></button> </div> </div>   

我会使用css来重用thte图像路径,但使用css,我没有得到teh变量来获取文件路径。

我是德鲁佩尔的新手,所以如果有人有能力帮助

,这将是很棒的
英文原文

I had created a field called tv_adbackground on the settings filed to be a ble to uplaod a background image.

The upload works great!

How to get the path of the file or the image style medium or thumbinal in to a twig template like this?

...  <div id="advertisement"> <!-- background-image uploaded on theme settings page should be used here ->    <div id=advertisement-dimmer>   <h3 class="adheading">{{ tv_adheading }}</h3>  <div id="admessage">{{ tv_admessage }}  <div class="btn-group adbuttons" role="group" aria-label="Basic     example"> <button type="button" class="btn btn-primary btn-lg"><a  style="color:#fff;" href="/signup">Register</a>    </button> <button type="button" class="btn btn-default btn-lg"><a  href="/user/login">Login</a></button> </div> </div> 

I would use css to retrive thte image path but with css i dont get teh variable to get the file path.

I am new to drupal 8 so it would be great if there will be anyone to help

  
 
 

回答列表

2
 
vote

可以在两个附加模块的帮助下完成。

  • twig字段值 - 从图像和
  • 获取路径
  • twig调整 - 获取图像的图像样式版本。
然后在您的枝条模板中,您将使用这样的内容来获取图像样式路径:
  drupal_get_normal_path($path)0  

其中 drupal_get_normal_path($path)1 是图像字段的名称。

如果您使用类似媒体模块的内容,那么您的图像来自引用的实体。在这种情况下,您可以使用

  drupal_get_normal_path($path)2  

drupal_get_normal_path($path)3 是媒体/实体参考字段和 drupal_get_normal_path($path)4 引用实体上的图像字段的名称。请注意,在第二种情况下,整个路径包裹在 998877615 中。

 

It can be done with the help of two additional modules.

  • Twig Field Value - to get the path to the image and
  • Twig Tweak - to get the image style version of an image.

Then in your Twig template you would use something like this to get the image style path:

{{ content.field_image.entity.uri.value | image_style('medium') }} 

where field_image is the name of the image field.

If you use something like the Media module then your images come from a referenced entity. In that case you could use

{{ file_url(content.field_referenced_entity | field_target_entity.field_image.entity.uri.value | image_style('medium')) }} 

and field_referenced_entity would be the media/entity reference field and field_image the name of the image field on the referenced entity. Notice that in the second case the whole path is wrapped in file_url().

 
 
 
 
0
 
vote

按照这篇文章

  drupal_get_normal_path($path)6  

这是Drupal 7中的 drupal_get_normal_path($path)7

 

As per @Clive on this post.

use Drupal\image\Entity\ImageStyle;  $path = 'public://images/image.jpg'; $url = ImageStyle::load('style_name')->buildUrl($path); 

This is the equivalent of image_style_url('style', uri) in Drupal 7.

 
 
0
 
vote

以在node.html.twig中获取自定义样式的图像 -

  drupal_get_normal_path($path)8  
 

To get the image with custom style in node.html.twig -

<img src="{{ node.IMAGE_FIELD.entity.uri.value | image_style('IMAGE_STYLE_NAME') }}"> 
 
 

相关问题

0  访问引用的节点字段 - 字段级别模板  ( Access a referenced nodes fields field level templating ) 
我的内容类型,具有参考字段到另一个内容类型。这允许无限量的条目。 我为此字段创建了一个模板: field--node--field-my-fields.html.twig 我希望能够访问我引用的节点的字段。通常您可以通过访问实体来执行此操作,但我似乎无法执行此操作。 {% for item in items...

1  如何使我的自定义主题建议最具体  ( How to make my custom theme suggestion the most specific ) 
是否可以保证我的自定义主题建议是主题建议列表的顶部?类似于以下的东西 <!-- FILE NAME SUGGESTIONS: x my-custom-theme-suggestion.html.twig x input--textfield.html.twig // ALSO WHY DO I HAVE...

0  如何从Drupal 8中获取Managed_filed的文件生成图像样式,并用作DIV的背景图像  ( How to get file from managed filed in drupal 8 generate image style and use as b ) 
我已经创建了一个表单,以提起在主题设置页面上上传图像,如 $form ['ad_tv']['tv_adbackground'] = array( '#type' => 'managed_file', '#title' => t('Hintergrundbild'), '#re...

0  仅在未选择选项(x)时,才能显示字段  ( How to display a field only if option x isnt selected ) 
在我的一个内容类型中,我有一个 status 字段(field_status),它是列表(文本)字段显示3无线电按钮选项设置为以下键|标签值: 0 | In Stock 1 |沉积 2 |出售 我有一个自定义枝形模板文件的这个内容类型,并且想知道如果选项不是0(有货),我将如何显示该值。有货是几乎是默认选...

4  渲染曲线模板中的反应组件  ( Render react components in twig templates ) 
我在我的主题中使用React JS(通过NPM安装),并使用REST导出视图。我想将JSON视图数据渲染成React组件并在Twig模板中调用它们。 我现在的工作方式是我有js / main.js导入组件,例如:js / components / slider.jsx等。组件文件决定渲染的位置。例如: R...

0  如何在页眉中显示节点图像以获取自定义主题?  ( How to display node image in page header for custom theme ) 
我正在扩展Tweme主题(一个引导映像),我希望节点页面上的"banner_image" 字段显示在标题中。 page.tpl.html模板来自tweme的标记为标题,但这不起作用,因为(我相信......)该模板无法访问 $content 变量: print render($content['field_re...

1  通过以编程方式从菜单树数组渲染自定义菜单块  ( Render custom menu block from menu tree array of links programmatically ) 
在这里是我所拥有的:自定义菜单(侧面导航)模仿主/辅助菜单树,显示了显示根菜单项的整个子树(Dine,Play,Stay)您的整个子树下。 可以使用内容类型中的复选框字段缩短此SidenAV。如果选中,Sidenav将递归显示已选中的页面和所有子项,但省略已检查页面的任何父母。我已成功创建该菜单,这一切都在被...

0  如何在模板中使用缓存和条件渲染?  ( How to work with caching and conditional rendering in a template ) 
我添加了自定义模块函数,以允许 is_front 条件在块模板内工作。目的是在主页上显示网站口号,但不在网站的其余部分。该规则正常运行,但网站的缓存导致它会错误地呈现。如果我从首页清除缓存,则Slogan将显示Sitewide。如果我从另一个站点页面清除缓存,则在首页上不会显示Slogan。 我假设它是因为块的显示在...

3  如何只添加特殊类别,只能仅为某些区域生成的所有块?  ( How can i add special classes to only all blocks thats generated in certain reg ) 
我想向自动在自定义区域生成的每个块中添加一些类。 例如,我想要在侧边栏中生成的所有块 - 左侧有一些特殊类,另外我不想在其他地区的那些块有那些类。 我尝试使用以下代码的内容将所需的类添加到左边栏中生成的每个块: region - sidebar-letth.html.twig {% set cla...

3  如何编辑Misc / print.css而不更改核心  ( How to edit misc print css without changing core ) 
我想编辑书本模块参考的核心/杂项/ print.css,我不知道如何。 如果我应该在某个地方移动print.css并在我的主题中加载新的print.css.info,或者是另一种方式对核心/杂项/ print.css进行更改而无需更改核心? ...

1  如何主题表行链接特定列数据?  ( How to theme table row to link particular column data ) 
我使用以下代码创建了管理部分中的表记录列表。 class userDownloadedFiles extends ControllerBase{ public function userList() { $header = array( array('data' => $this->t('Username'...

1  如何在Page.html.twig中使用jQuery?  ( How do i use jquery in page html twig ) 
在drupal 7中,我使用了一些javascript,在page.tpl.php文件中使用以下代码。 <script type="text/javascript"> (function($) { $( ".mobile-menu-button" ).click(function() { ...

0  如何编写Page.tpl.php标题部分  ( How to write page tpl php header section ) 
我正在使用带有drupal 7.i的引导映像有要求设计标题如下: 我的tpl文件如下所示: <div class = "container"> <div class = "row"> <div class = "col-md-8 col-sm-8 col-xs-12 col-lg-8"> // copy t...

1  为什么我的Drupal 8引导次映像显示搜索结果?  ( Why doesnt my drupal 8 bootstrap subtheme show search results ) 
我有一个引导象形物,我正在使用以下网站 - kobejet.com。 一切看起来并一直正常工作,直到大约2周前,当搜索结果开始只显示数字,没有实际结果。 似乎正在返回结果,因为编号是正确的,因为应该有多少结果。例如,如果您搜索"计算机" - 应该有大约14个结果,但只有编号显示。 我试图越过我的安装,将我的孩子/...

1  模块模板文件以扩展主题  ( Module template file to extend theme ) 
我希望我的模块(事件)拥有自己的模板文件,但扩展了当前启用的基本主题。 hook_theme() : function events_theme($existing, $type, $theme, $path) { return array( 'test_events' => ar...

0  可以以编程方式对主题/渲染视图禁用吗?  ( Can views theme rendering be disabled programmatically ) 
我正在使用默认视图RSS显示和默认情况下创建RSS Feed,它包含一堆使输出为无效XML的字符(我认为这与与双编码或其他相关的视图中的错误有关相关功能)。 所以,解决此问题,在hook_views_pre_render()期间我能够用php来操作字段以输出有效的东西。在视图中我"预览" 输出时,它就像它一样。 但...

1  自定义模板文件以使用主题html / page.tpl [复制]  ( Custom template file to use themes html page tpl ) 
这个问题已经在这里有一个答案: 从hook_menu() (1答) Cl...

-2  将徽标添加到自定义主题作为背景图像  ( Adding logo to a custom theme as background image ) 
我有一个我正在努力的自定义Drupal 8主题。要求是此自定义主题的客户端徽标是HTML对象上的背景图像。我还需要添加脚本,根据页面的其余部分的背景,互换两个不同图像之间使用的背景图像。 在哪里可以在drupal 8自定义主题文件中添加这些CSS样式和JavaScript代码? ...

3  如何在树枝中获取媒体实体字段值?  ( How to get media entity field value in twig ) 
有时需要获得字段的实际值(不是格式化/呈现的字段),例如,要检查 true 或 false 。 如果我想在Twig模板中获取节点或段段落段落( node.html.twig / 段落.html.twig )我可以使用 node.field_my_boolean.value 分别 paragraph.field_my...

1  是否有可能组织模板文件?  ( Is it possible to organize template files ) 
因为我已经更熟悉drupal,我一直越来越多地利用模板文件。但是,模板文件的命名约定使它们难以组织。是否可以将模板文件组织到主要模板目录中的不同目录中?我正在使用drupal 7。 如果它是不可能的,还有替代方法组织模板文件吗? 谢谢! ...




© 2021 it.wenda123.org All Rights Reserved. 问答之家 版权所有


Licensed under cc by-sa 3.0 with attribution required.