Announcement

Collapse
No announcement yet.

Turning IMAGES Into Hyperlinks That Show Larger Images In Pop-up Windows

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
    #1

    Turning IMAGES Into Hyperlinks That Show Larger Images In Pop-up Windows

    I HAVE READ THE ACTINIC 4 ADVANCED USER GUIDE, AND I HAVE FOLLOWED ALL THE INSTRUCTIONS TO CHANGE THE IMAGES TO HYPERLINKS AND SHOW BIGGER IMAGES IN A POP-UP WINDOW.

    I HAVE CHANGED ACT PRIMARY.HTML AND ACT PRODUCT LINE.HTML ACCORDINGLY AND FOLLOWED THE INSTRUCTIONS WORD FOR WORD.

    DO YOU NEED TO CHANGE THE HTML THAT IS IN THE ADVANCED USER GUIDE OR DO YOU COPY IT WORD FOR WORD.

    IT IS THE FIRST TIME I HAVE EVER DONE SOMETHING LIKE THIS,
    I JUST WANT TO BE ABLE TO SHOW BIGGER IMAGES IN A POP-UP WINDOW.

    PLEASE HELP!!!
    Tags: None
    #2
    Hi there

    Please try the following:

    Create a js file (eg popup.js) and include the following in that file

    function ShowPopUp(sUrl, nWidth, nHeight)
    {
    window.open(sUrl, 'ActPopup', 'width=' + nWidth + ',height=' + nHeight + ',scrollbars, resizable');
    }
    Then edit Act_Primary.html and in the head specifiy

    <SCRIPT LANGUAGE="JavaScript" SRC="popup.js" TYPE="text/javascript"></SCRIPT>
    This should work. Remember to upload the popup.js in your /acatalog/ folder, or add it in "Advance | Additional File"

    Hope this helps
    Nadeem Rasool
    SellerDeck Development

    Comment

      #3
      NEED MORE HELP

      MY FRIEND GOT THE POP-UP TO WORK FOLLOWING THE ADVANCED USER GUIDE 4.

      BUT WHEN THE POP-UP LOADS UP THE IMAGE IS NOT IN THE CENTRE AND THE BROWSER TITLE SHOWS THE DIRECTORY OF THE IMAGE IN OFFLINE PREVIEW, I WOULD LIKE THE TITLE TO BE OUR COMPANY NAME.

      HOW CAN I MAKE THE IMAGES BE CENTRAL AND HOW CAN I CHANGE THE BROWSER TITLE.

      ALSO HOW CAN YOU PUT A CLOSE WINDOW SIGN IN THE POP-UP.

      PLEASE HELP

      THANK-YOU

      Comment

        #4
        I'm afraid that you can't do any of these things.

        What you're doing is asking the browser to open a URL that points to an image and that's the best that the browser can do.


        There's no way off getting HTML in there to affect the layout.

        You could adjust the size of the popup to fit the image, or if you want a fixed size popup, you could add a border to the left hand side of the image (using an image editing program) so that it is pushed over a bit.

        Norman

        PS You can have very informative popup pages containg all you want (and more) in V6.

        PPS It is much more friendly to post in lower case as all caps is considered to be shouting.
        Norman - www.drillpine.biz
        Edinburgh, U K / Bitez, Turkey

        Comment

          #5
          There's a solution that I have used for V4 and V5.

          See www.optimistonline.co.uk/acatalog for an example of it working.

          Edit Act_ProductImage.html add this code to the bottom

          <br>
          <a href="javascript:NewWindow('l-' + 'NETQUOTEVAR:IMAGEFILE',
          'NETQUOTEVAR:ALTERNATETEXT',
          NETQUOTEVAR:IMAGEHEIGHT, NETQUOTEVAR:IMAGEWIDTH);">larger image</a>


          Edit Act_Primary.html

          Add this code before the </HEAD> tag

          <script language="JavaScript">
          <!-- Begin
          function SpecWin(page, win, feat) {
          OpenWin = this.open(page, win, feat);
          }
          // End -->
          </script>

          Edit Act_Product_Body.html

          add this code at the top of the code

          <SCRIPT language="JavaScript">
          function NewWindow(sImageFile, sText, nHeight, nWidth)
          {
          window5=window.open("", "NewPopWindow", "toolbar=no, directories=no, menubar=no, scrollbars=no, width=" + (nWidth * 3 + 4) + ",height=" + (nHeight * 3 + 54) + ", top=90, left=0, screenx=90, screeny=0");
          window5.document.write("<HTML><HEAD>");
          window5.document.writeln("<TITLE>" + sText + "</TITLE>");
          window5.document.writeln("</HEAD><BODY topmargin=0 leftmargin=0 marginwidth=0 marginheight=0 BGCOLOR=FFFFFF onLoad='self.focus()'>");
          window5.document.writeln("<CENTER><img src=" + sImageFile + ">");
          window5.document.writeln("<FORM><INPUT TYPE='button' VALUE=Close onClick='window.close()'></FORM></CENTER>");
          window5.document.writeln("</BODY></HTML>");
          window5.document.close();
          }

          </script>

          The Explanation

          This code relies on the fact that your large images are sized in proportion to the small ones. In the code above 3X The plus 4 for the width and plus 54 for height to fit the close link reflect the popup window size

          The large images have the same name as the small ones with a prefix l-

          You active the code by going to the product in catalog , Product details dialog box, General tab, Place a space in the Information text link, and add the image name to the File/URL.

          So if your small image is named abc.gif, in this case the File/URL will be l-abc.gif.

          The title of the popup box will be the Product Name, but you could hard code the JS to be your company name if you prefer

          Upload and off you go.....!!

          Comment

            #6
            I have followed your instructions but they dont seem to work. Do I still need to follow the instructions in the actinic advanced user guide 4, page 25 aswell, or just use your instructions on their own.

            it is better to use one set of instructions.

            to be able to help more I would need to see the URL

            Comment

            Previous template Next
            Working...
            X