Problems using lightbox javascript on wordpress...

Discussion in 'JavaScript' started by theplastickid, Aug 16, 2009.

  1. #1
    Hello I am themeing a wordpress site at the moment but trying to implement Lightbox 2 as well.

    http://www.huddletogether.com/projects/lightbox2/

    I have it all setup correctly but when I click a link instead of getting a lightbox appear I just get my middle column collapse.... which is pretty strange.

    I am modifying the site locally using xampp can this effect the way the javascript will load? Does it have to be uploaded to a live server?

    Many Thanks.
     
    theplastickid, Aug 16, 2009 IP
  2. kblessinggr

    kblessinggr Peon

    Messages:
    539
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    0
    #2
    DO you have any other javascript frameworks installed, normally when lightbox doesn't work (kinda like lightview) its either because a doctype hasn't been set at top of the browser or its conflicting with another javascript framework.
     
    kblessinggr, Aug 16, 2009 IP
  3. theplastickid

    theplastickid Well-Known Member

    Messages:
    261
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #3
    I have uploaded the site live to see if this would work and it isn't I am getting a "page not found error"

    http://www.mwelectricgates.com/hhke/

    Here is the code

     
    theplastickid, Aug 16, 2009 IP
  4. kblessinggr

    kblessinggr Peon

    Messages:
    539
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Regarding the page not found, you probably turned on friendly urls (permalinks) but did not update the .htaccess/rewrite file as needed.

    Also when I look at the safari activity window, prototype, scriptaculous, lightbox, and the css files were 'Not Found', as such they were never loaded. Try this.

    
    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/prototype.js"></script>
    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/scriptaculous.js?load=effects,builder"></script>
    <script type="text/javascript" src=<?php bloginfo('template_url'); ?>/"js/lightbox.js"></script>
    <link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/lightbox.css" type="text/css" media="screen" />
    
    Code (markup):
    That's assuming your files are in the theme's directory, cuz otherwise it's looking for it relative to the path of your blog.
     
    kblessinggr, Aug 16, 2009 IP
  5. theplastickid

    theplastickid Well-Known Member

    Messages:
    261
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #5
    Tried that but still getting same thing.... :(
     
    theplastickid, Aug 16, 2009 IP
  6. theplastickid

    theplastickid Well-Known Member

    Messages:
    261
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #6
    This is all of my header text now...

    And my site is located in

    themes > HipHop Site > index.html
    themes > HipHop Site > images > image-1.jpg
    themes > HipHop Site > js > javascript files
    themes > HipHop Site > css > lightbox.css

    I don't know if this helps.
     
    theplastickid, Aug 16, 2009 IP
  7. kblessinggr

    kblessinggr Peon

    Messages:
    539
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    0
    #7
    kblessinggr, Aug 16, 2009 IP
  8. theplastickid

    theplastickid Well-Known Member

    Messages:
    261
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #8
    Just fixed the problem. SCHOOL BOY ERROR!

    I hadn't set the directory correctly. Eg wordpress > wp-content > themes > hiphop > js

    I just had it set as

    js >

    Total dumb ass I know I appreciate your help thank you very much for trying to sort it for me. :)
     
    theplastickid, Aug 16, 2009 IP