0

I would like to set a background image on a div in my views-view.tpl.php using the image from a rendered entity field in the View Header.

Something like:

   <div class="group-header" style="background-image:;">
    <div class="group-heading container">
      <?php print render($title_prefix); ?>
      <?php if ($title): ?>
        <div class="page-title">
          <h1 class="l-view-title"><?php print t($title)?></h1>
        </div>
      <?php endif; ?>
      <?php print render($title_suffix); ?>  

      <?php if ($header): ?>
        <?php print $header; ?>
      <?php endif; ?>
    </div>        
  </div>

How do I print just the url of the entity from the header? It would be great if I could pull the image URL and add an inline style on the group-header div. Any ideas on how to accomplish this?

Similar to this question: Use image from view as background image of div in page.tpl.php

  • Are you willing to use jQuery/JS? – Chris Happy Dec 8 '16 at 5:02
  • Could u post the template file? – Paul Bönisch Dec 8 '16 at 9:05
0

Is there something the Background Images Formatter module can do for you?

The module allows you to set a background to any CSS selector(s) you can think of. Combine it with a selector built with NID-token (NID field in Views, excluded from display, and its token used in the selector you assign the background-image to), and it will probably save you some templating headaches.

0

The simplehtmldom parser will be helpful to render this for you.

https://www.drupal.org/project/simplehtmldom

we can supply the html to this parser and capture the output by the APIs provided. http://simplehtmldom.sourceforge.net/manual.htm

http://simplehtmldom.sourceforge.net/manual_api.htm

      $html_obj = new simple_html_dom();

      $wrapped_header = "<div class='header_url'>{$header}</header>";
      $html_obj->load( $wrapped_header );
     $url_forimage="";
      // use the wrapped class
      foreach ($html_obj->find('header_url') as $plain_text_obj ) {
//get class of the rendered element and use that to capture the src tag.
//check API for more info. you should list them in the DOM hierarchy.
//I have used this DOM hiearchy "div.views-field-field-banner-image > div > a > img" for the below code.

           $url_forimage= $plain_text_obj->find('div[class=views-field-field-banner-image] div a img',0)->src;
          }




      <div class="group-header" style="background-image:<?php print $url_forimage;?>">
        <div class="group-heading container">
          <?php print render($title_prefix); ?>
          <?php if ($title): ?>
            <div class="page-title">
              <h1 class="l-view-title"><?php print t($title)?></h1>
            </div>
          <?php endif; ?>
          <?php print render($title_suffix); ?>  

          <?php if ($header): ?>
            <?php print $header; ?>
          <?php endif; ?>
        </div>        
      </div>

You will need work on this to get it work.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.