You are here

Home » API reference » Media Hero Slider 9.0.x

node--varbase-heroslider-media.html.twig in Media Hero Slider 9.0.x

Same filename and directory in other branches
  1. 8.7 templates/node--varbase-heroslider-media.html.twig

Default theme implementation to display a node.

Available variables:

  • node: The node entity with limited access to object properties and methods. Only method names starting with "get", "has", or "is" and a few common methods such as "id", "label", and "bundle" are available. For example:

    • node.getCreatedTime() will return the node creation timestamp.
    • node.hasField('field_example') returns TRUE if the node bundle includes field_example. (This does not indicate the presence of a value in this field.)
    • node.isPublished() will return whether the node is published or not.

    Calling other methods, such as node.delete(), will result in an exception. See \Drupal\node\Entity\Node for a full list of public properties and methods for the node object.

  • label: The title of the node.
  • content: All node items. Use {{ content }} to print them all, or print a subset such as {{ content.field_example }}. Use {{ content|without('field_example') }} to temporarily suppress the printing of a given child element.
  • author_picture: The node author user entity, rendered using the "compact" view mode.
  • metadata: Metadata for this node.
  • date: Themed creation date field.
  • author_name: Themed author name field.
  • url: Direct URL of the current node.
  • display_submitted: Whether submission information should be displayed.
  • attributes: HTML attributes for the containing element. The attributes.class element may contain one or more of the following classes:

    • node: The current template type (also known as a "theming hook").
    • node--type-[type]: The current node type. For example, if the node is an "Article" it would result in "node--type-article". Note that the machine name will often be in a short form of the human readable label.
    • node--view-mode-[view_mode]: The View Mode of the node; for example, a teaser would result in: "node--view-mode-teaser", and full: "node--view-mode-full".

    The following are controlled through the node publishing options.

    • node--promoted: Appears on nodes promoted to the front page.
    • node--sticky: Appears on nodes ordered above other non-sticky nodes in teaser listings.
    • node--unpublished: Appears on unpublished nodes visible only to site admins.
  • title_attributes: Same as attributes, except applied to the main title tag that appears in the template.
  • content_attributes: Same as attributes, except applied to the main content tag that appears in the template.
  • author_attributes: Same as attributes, except applied to the author of the node tag that appears in the template.
  • title_prefix: Additional output populated by modules, intended to be displayed in front of the main title tag that appears in the template.
  • title_suffix: Additional output populated by modules, intended to be displayed after the main title tag that appears in the template.
  • view_mode: View mode; for example, "teaser" or "full".
  • teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
  • page: Flag for the full page state. Will be true if view_mode is 'full'.
  • readmore: Flag for more state. Will be true if the teaser content of the node cannot hold the main body content.
  • logged_in: Flag for authenticated user status. Will be true when the current user is a logged-in member.
  • is_admin: Flag for admin user status. Will be true when the current user is an administrator.

@todo Remove the id attribute (or make it a class), because if that gets rendered twice on a page this is invalid CSS for example: two lists in different view modes.

See also

template_preprocess_node()

File

templates/node--varbase-heroslider-media.html.twig
View source 
  1. {#

  2. /**

  3.  * @file

  4.  * Default theme implementation to display a node.

  5.  *

  6.  * Available variables:

  7.  * - node: The node entity with limited access to object properties and methods.

  8.  *   Only method names starting with "get", "has", or "is" and a few common

  9.  *   methods such as "id", "label", and "bundle" are available. For example:

  10.  *   - node.getCreatedTime() will return the node creation timestamp.

  11.  *   - node.hasField('field_example') returns TRUE if the node bundle includes

  12.  *     field_example. (This does not indicate the presence of a value in this

  13.  *     field.)

  14.  *   - node.isPublished() will return whether the node is published or not.

  15.  *   Calling other methods, such as node.delete(), will result in an exception.

  16.  *   See \Drupal\node\Entity\Node for a full list of public properties and

  17.  *   methods for the node object.

  18.  * - label: The title of the node.

  19.  * - content: All node items. Use {{ content }} to print them all,

  20.  *   or print a subset such as {{ content.field_example }}. Use

  21.  *   {{ content|without('field_example') }} to temporarily suppress the printing

  22.  *   of a given child element.

  23.  * - author_picture: The node author user entity, rendered using the "compact"

  24.  *   view mode.

  25.  * - metadata: Metadata for this node.

  26.  * - date: Themed creation date field.

  27.  * - author_name: Themed author name field.

  28.  * - url: Direct URL of the current node.

  29.  * - display_submitted: Whether submission information should be displayed.

  30.  * - attributes: HTML attributes for the containing element.

  31.  *   The attributes.class element may contain one or more of the following

  32.  *   classes:

  33.  *   - node: The current template type (also known as a "theming hook").

  34.  *   - node--type-[type]: The current node type. For example, if the node is an

  35.  *     "Article" it would result in "node--type-article". Note that the machine

  36.  *     name will often be in a short form of the human readable label.

  37.  *   - node--view-mode-[view_mode]: The View Mode of the node; for example, a

  38.  *     teaser would result in: "node--view-mode-teaser", and

  39.  *     full: "node--view-mode-full".

  40.  *   The following are controlled through the node publishing options.

  41.  *   - node--promoted: Appears on nodes promoted to the front page.

  42.  *   - node--sticky: Appears on nodes ordered above other non-sticky nodes in

  43.  *     teaser listings.

  44.  *   - node--unpublished: Appears on unpublished nodes visible only to site

  45.  *     admins.

  46.  * - title_attributes: Same as attributes, except applied to the main title

  47.  *   tag that appears in the template.

  48.  * - content_attributes: Same as attributes, except applied to the main

  49.  *   content tag that appears in the template.

  50.  * - author_attributes: Same as attributes, except applied to the author of

  51.  *   the node tag that appears in the template.

  52.  * - title_prefix: Additional output populated by modules, intended to be

  53.  *   displayed in front of the main title tag that appears in the template.

  54.  * - title_suffix: Additional output populated by modules, intended to be

  55.  *   displayed after the main title tag that appears in the template.

  56.  * - view_mode: View mode; for example, "teaser" or "full".

  57.  * - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.

  58.  * - page: Flag for the full page state. Will be true if view_mode is 'full'.

  59.  * - readmore: Flag for more state. Will be true if the teaser content of the

  60.  *   node cannot hold the main body content.

  61.  * - logged_in: Flag for authenticated user status. Will be true when the

  62.  *   current user is a logged-in member.

  63.  * - is_admin: Flag for admin user status. Will be true when the current user

  64.  *   is an administrator.

  65.  *

  66.  * @see template_preprocess_node()

  67.  *

  68.  * @todo Remove the id attribute (or make it a class), because if that gets

  69.  *   rendered twice on a page this is invalid CSS for example: two lists

  70.  *   in different view modes.

  71.  *

  72.  * @ingroup themeable

  73.  */

  74. #}

  75. {{ attach_library('varbase_heroslider_media/general-styling') }}

  76. {{ attach_library('varbase_heroslider_media/general-scripts') }}

  77. 

  78. {# The the node has the media single field for the slide #}

  79. {% if node.hasField('field_media_single') %}

  80.   {% set media_entity_type = node.field_media_single.entity.bundle() %}

  81. 

  82.   {# If the media type is local video #}

  83.   {% if media_entity_type == "video" %}

  84.     {{ attach_library('varbase_heroslider_media/local_video_slider') }}

  85.   {# If the media type is remote video with oembed #}

  86.   {% elseif media_entity_type == "remote_video" and provider %}

  87.     {{ attach_library('varbase_heroslider_media/' ~ provider ~ '_video_slider') }}

  88.   {% endif %}

  89. {% endif %}

  90. 

  91. {# The template default set classes. #}

  92. {%

  93. set classes = [

  94.   'node',

  95.   'node--type-' ~ node.bundle|clean_class,

  96.   view_mode ? 'node--view-mode--' ~ view_mode|clean_class,

  97. ]

  98. %}

  99. {% if page %}

  100.   {% set page_extra_attributes = create_attribute() %}

  101.   {%

  102.     set page_extra_classes = [

  103.      'varbase-heroslider-media',

  104.      'bg-edge2edge',

  105.     ]

  106.   %}

  107. <div{{ page_extra_attributes.addClass(page_extra_classes) }}>

  108. {% endif %}

  109. <div{{ attributes.addClass(classes) }}>

  110.   <div{{ content_attributes }}>

  111.     {{ content.field_media_single|render }}

  112.     <div class="hero-slide-content-wrapper">

  113.       <div class="container">

  114.         <div class="row">

  115.           <div class="hero-slide-content">

  116.             {# The title of the slide #}

  117.             {% if label %}

  118.               <div class="field field--name-node-title">

  119.                 <h2 class="node-title">{{ label }}</h2>

  120.               </div>

  121.             {% endif %}

  122.             {# All other content fields without the media single field. #}

  123.             {{ content|without('field_media_single') }}

  124.           </div>

  125.         </div>

  126.       </div>

  127.     </div>

  128.   </div>

  129. </div>

  130. {% if page %}

  131. </div>

  132. {% endif %}