Views Slideshow Using Absolute Path to Images

Question

We are using views_slideshow to display a 3 image slideshow on our homepage. The Style is Slideshow, the Row Style is set to Fields. The Field is: Image attach: Attached images and we are filtering for a specific Node:Type. The Node Type were filtering for has an attached image which is what the slideshow uses.

The problem we are encountering is that the <img src=""/> references to the image appear to be absolute URLs so that if you view the site over https:// in Internet Explorer, you get the message about referencing unsecure content on a secure page. (since the URL to the image looks like: http://www.foo.com/sites/dailyaccess.com/files/images/Banner1.jpg even though you are viewing the page over https://)

How can we go about correcting this to use a relative URL or display the correct secure/unsecure URL?

Answer 1

Implement hook_preprocess_views_view_field() or hook_preprocess_views_view_fields(). In those you should be able to alter anything related to that image field. If the image field happens to be represented as a render array in the hook (assuming you are using Drupal 7), you can also change the theming function to use for that image. Within your own image theming function, you can get the path to the image using file_create_url(), which supports https.

If you need a good example of an image theming function, you can look at core's theme_image(). For a complete list of Views preprocessors, you can look at the views/theme/theme.inc source code.

Answer 2

I've also posted this an an answer to Views to use relative paths for image fields

Add your image to the view (mine is called Image2)

Create a theme file for your image field, see screenshot. (mine is called views-view-field--relative-url-example--page--field-image2.tpl.php and it's bolded). Pick the last one for the most granular themeing possible.

(full size here)

After you have added the theme file to your theme templates (/sites/all/themes/THEME/templates or similar), hit the "Rescan template files" button. Your field template should be bolded now.

Add the following code to your theme file, I removed the comments but you can leave them in if you like:

<?php

/**
 * @file
 * This template is used to print a single field in a view.
 *
 * It is not actually used in default Views, as this is registered as a theme
 * function which has better performance. For single overrides, the template is
 * perfectly okay.
 *
 * Variables available:
 * - $view: The view object
 * - $field: The field handler object that can process the input
 * - $row: The raw SQL result that can be used
 * - $output: The processed output that will normally be used.
 *
 * When fetching output from the $row, this construct should be used:
 * $data = $row->{$field->field_alias}
 *
 * The above will guarantee that you'll always get the correct data,
 * regardless of any changes in the aliasing that might happen if
 * the view is modified.
 */
?>
<?php

    $url  = file_create_url($row->field_field_image2[0]["raw"]["uri"]);
    $url  = parse_url($url);
    $path = $url['path'];

    print $path;
?>

I only printed the path to demonstrate it works so you will need to add the image tag, etc.

Here is my output:

You may need to clear the cache and be sure to save your view after you update the theme file.