• Resolved mulvidon

    (@mulvidon)


    Hi.

    I’m a designer wading into developer waters and could use a little help. Please assume I know nothing about programming if you reply (much appreciated).

    I am showing a snippet of a testimonial and want it so that when someone clicks “read more” a modal shadowbox pops up with the full testimonial. Right now nothing happens when I click the link. I have spent hours and hours trying to fudge my way through this but despite my best effort -and dozens of google searches and articles read- I’ve yet to figure it out.

    Any help you can provide this Photoshop guy would be greatly appreciated.

    Many thanks.

    Here are the details:

    I’m using the Genesis framework with the Altitude Pro child theme.

    This is the page I’m working on: http://www.donmportfolio.com/testimonials

    This is the jQuery script I’m using inside the page content area:

    [ 278 lines of code redacted, that’s just too much. Please use pastebin.com instead ]

Viewing 15 replies - 1 through 15 (of 16 total)
  • Hi,

    It will be much easier if you find a plugin that’s close to your requirement and ask the plugin author for help or hire a developer to modify it to fit your requirement.

    http://jobs.wordpress.net

    Thank you.

    Thread Starter mulvidon

    (@mulvidon)

    Hi Denzel,

    Thanks for the reply. I was hoping to learn how to do it myself. There seems to be a lot of discussion around enqueueing, features.php, etc. and I was hoping someone could just tell me what code I need where. I feel like I’m one small code snippet away from having it work but I just-don’t-know-what-it-is. Know what I mean?

    Thanks,
    Don

    Hi mulvidon,
    Will love to help you PHOTOSHOP GUY 🙂
    But please first clarify what you want. In the link provided by you, I am not been able to see “Read More” link.
    Your code snippet is also not provided.
    Please provide the code you are using with detail description of what you are trying to do.
    Looking forward to help you out.

    Thanks

    Thread Starter mulvidon

    (@mulvidon)

    Hi cedcommerce.

    Sorry, I see my code got cut off. Here is a link to it: http://pastebin.com/NvdhZp3Q

    There I included the jQuery script, the css, the html, and the functions.php from my theme. For convenience, this is once again the page I’m working on: http://www.donmportfolio.com/testimonials/ -check it out, you’ll see the first testimonial with a “read more” link below it.

    Many thanks,
    Don

    P.S. haha “PHOTOSHOP GUY”

    Now I got what you want.
    But its difficult to test your code, as I don’t have access to your site as developer. So can’t try different things.
    If your script is correct, then this critical fix can make your day.
    Change your script to :

    <script>
    jQuery( document ).ready(function() {
    jQuery( ".body_link" ).click(function(event) {
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening
    jQuery(this).parents(".ooo_testimonial-block").find(".ooo_testimonial-full").addClass("show");
    });
    });
    </script>

    Hope this time you make it 🙂
    Thanks

    Thread Starter mulvidon

    (@mulvidon)

    Thanks again.

    That didn’t work -nothing happens when clicking the ‘read more’ link. So, does that mean the problem lies somewhere else?

    Thanks.

    Try to alert on clicking read More.

    <script>
    jQuery( document ).ready(function() {
    jQuery( ".body_link" ).click(function(event) {
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening
    alert(“IT IS WORKING”)
    jQuery(this).parents(".ooo_testimonial-block").find(".ooo_testimonial-full").addClass("show");
    });
    });
    </script>

    If this code alerts, means the code you have done is not working, as you want.
    Thats all I can help you with.
    To help you further I need access to your site as developer.
    Try to fix code on your own. Or hire someone as “Denzel Chia” mentioned earlier.
    Thanks

    Thread Starter mulvidon

    (@mulvidon)

    Thank you again cedcommerce.

    That didn’t work -nothing happens. I’m sure your code is good, so would that tell you the problem lies elsewhere? Should code like this normally work in WordPress or is there also other things you need to do?

    I appreciate your help thus far.

    Thanks

    Sorry there is a glitch in code. ‘;’ is missing after alert(“IT IS WORKING”)
    Use this:

    <script>
    jQuery( document ).ready(function() {
    jQuery( ".body_link" ).click(function(event) {
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening
    alert(“IT IS WORKING”);
    jQuery(this).parents(".ooo_testimonial-block").find(".ooo_testimonial-full").addClass("show");
    });
    });
    </script>

    Just please make a change before using the code. Remove the “ sign(quotes) inside alert and re-enter the “(quotes). Because there is some editor issue. Both signs are different.
    Now try this. Hope you see the alert.
    Looking forward to hear from you.

    Thanks

    Thread Starter mulvidon

    (@mulvidon)

    That worked!!!! Dude! Thanks! Now what?

    P.S. I replaced quotes as you instructed.

    Glad to hear that it worked.
    Again make changes to your code.
    use this script.

    <script>
    jQuery( document ).ready(function() {
    jQuery( ".body_link" ).click(function(event) {
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening
    //alert(“IT IS WORKING”);
    jQuery(this).parent(".ooo_testimonial-sub").find(".ooo_testimonial-full”).show();
    });
    });
    </script>

    Note : again make changes to “(quote) in whole script. Same editor issue. This time I have commented alert. Hope you will show your popup this time. But alignment of popup is not so good.
    Try to fix it yourself. You can ask for my help , if needed DUDE 🙂
    Looking forward to hear from you.

    Thanks

    Thread Starter mulvidon

    (@mulvidon)

    Hmmm… nothing showed up. SOMEthing happens, as the page is perhaps reloading (hard to tell it happens so fast). Check it out: http://www.donmportfolio.com/testimonials/

    I’m clicking the first “read more” link next to Fred Baker.

    Of course, thanks as always.

    Thread Starter mulvidon

    (@mulvidon)

    FIGURED IT OUT….

    Thread Starter mulvidon

    (@mulvidon)

    I was inspecting the page and saw an “unexpected syntax” error. I had an immediate suspicion that perhaps there was one of those odd quotation marks in the last line of code. And sure enough! That was the problem. In this portion of the code: (“.ooo_testimonial-full”) the closing quotation mark was the problem quotation mark. I deleted it and retyped it and this time it worked.

    Thanks so much for all your help. It’s funny that your aside instruction about quotation marks let to the ultimate solution.

    Thanks again -much appreciated!

    I got the error. You have left one “(quote) unchanged.
    wrong:
    jQuery(this).parent(“.ooo_testimonial-sub”).find(“.ooo_testimonial-full”).show();
    Correct:
    jQuery(this).parent(“.ooo_testimonial-sub”).find(“.ooo_testimonial-full”).show();

    Please try again by delete and rewrite all “(quote) please.
    You are close to make it.
    Uncomment alert also for confirmation.
    Reply whatever happen… I am waiting.

    Thanks

Viewing 15 replies - 1 through 15 (of 16 total)

The topic ‘Simple jQuery popup function’ is closed to new replies.