How to view images in a popup window (drupal)

Submitted by mgifford on

After searching the web and drupal forums for a solution to no avail, we finally decided to create a small hack of the image module. This will allow users browsing images to click on the "view original" link and have the image open in a new, customized window. There are a couple ways to do this.

Method 1: Fullscreen popup

Step A: Edit page.tpl.php (in your theme directory) and put the following between the HEAD tags:

 

Step B: Edit the image.module (in your modules directory) and replace

 $links[] = l(t('view original'), 'node/'.$node->nid, NULL, 'size=_original');

with (on one line)

 $links[] = '<a onclick="fullScreen(\'image/view/' . $node-&gt;nid . '?' 
. 'size=_original'\');" href="javascript:void(0);">' . t('view original') . '</a>'; 

Method 2: Centred popup

Step A: Edit page.tpl.php (in your theme directory) and put the following between the HEAD tags:

 

Step B: Edit the image.module (in your modules directory) and replace

 $links[] = l(t('view original'), 'node/'.$node-&gt;nid, NULL, 'size=_original');

with (on one line)

 $links[] = '<a onclick="NewWindow(this.href,\'name\',\'1000\',\'1000\',\'yes\');
return false;" href="image/view/' . $node-&gt;nid . '?' . 'size=_original">' . t('view original') . '</a>'; 

You can replace the '1000's with the desired width and height. You can replace the 'name' to specify the window label. If you do not want scrollbars on the popup window, change the 'yes' to 'no'

  • Computing
  • Web development
  • Blog software
  • Cross-platform software
  • Drupal
  • Null
  • World Wide Web
  • Technology Internet
  • php
  • php

Section: 

Topic: 

Comments

Using flash pop-up without modifiying php

This code works inline

<a href="#" onclick="javascript:window.open(' http://volunteer.ca/sites/volunteercanada/files/VC 0037 Plegde-Final FRN.swf ','popup','width=600,height=300,top=200,left=200');">Insert Text Here</a>

more details:
http://www.tizag.com/javascriptT/javascriptpopups.php

* dependent - Subwindow closes if the parent window (the window that opened it) closes
* fullscreen - Display browser in fullscreen mode
* height - The height of the new window, in pixels
* width - The width of the new window, in pixels
* left - Pixel offset from the left side of the screen
* top - Pixel offset from the top of the screen
* resizable - Allow the user to resize the window or prevent the user from resizing
* status - Display or don't display the status bar

Add new comment