Create pop-up for Team Members?

This topic is: not resolved

Tagged: 

This topic contains 4 replies, has 2 voices, and was last updated by Raghavendra Raghavendra 5 years, 8 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #2969
    Brotskybee
    brotskybee
    Member
    Post count: 24

    Hi there,
    Once again enjoying this theme. Have an issue though, and I’m wondering if there’s a way to accomplish this using child-theme files instead of modifying the core:

    My client has several team members. She wants just an exerpt of their bio displayed on the main Team page, and then a pop-up when you click on the name or “More” button (which I added). I know that lightbox-style pop-ups are set up for the galleries when you click on a specific part of the overlay. But is there an easy way to also set this up for this area?

    Here’s a link to the development page in question: (this site is seriously still under development and looking a little wonky at the moment).

    Thanks in advance,
    ~Laura

    #2995
    Raghavendra
    Raghavendra
    Moderator
    Post count: 4607

    Laura,

    Probably you can achieve this using a custom plugin in WordPress.org. A quick search on Google “wordpress lightbox plugin for text” got me into this article which may help –

    http://www.endocreative.com/how-to-insert-content-in-a-popup-using-lightbox-plus-for-wordpress/

    There are other search results too that may help if this does not meet your need.

    Meteorite

    #3065
    Raghavendra
    Raghavendra
    Moderator
    Post count: 4607

    Sorry – I had a feeling that this could be done with the lightbox plugin prettyPhoto bundled with the theme but could not try this earlier. Here is an example markup that works –



    <div id=”inline-1″ class=”hidden”>
    <p>This is inline content opened in prettyPhoto.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></div>
    </div>

    I am not sure you can see the markup right unless you edit this post. You can see some example here –

    http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone#prettyPhoto

    In the middle of this page, look for the demo named Inline Content. You will need to use the class “hidden” to hide the inline div initially with the theme (the demo uses class named hide).

    #3182
    Brotskybee
    brotskybee
    Member
    Post count: 24

    Thanks so much. And my apologies for the delay in replying.

    I may be misunderstanding the instructions. I want to keep the layout of the Staff page, but I’d just like the auto-created links to open in a lightbox, with the header/footer areas stripped – so just the corresponding image and text stuff from the body.

    I’m guessing this is more involved that a simple id change within the corresponding .php file in the theme. If you DO know of a simple solution on that score though, please do feel free to pass it along 😉

    ~Laura

    #3239
    Raghavendra
    Raghavendra
    Moderator
    Post count: 4607

    You do not need to change any PHP file. Just add content like the attached file content with sample HTML to each one of the team members (button + expanded profile content which is hidden initially).

    You can just paste this content to any post to see how it works before moving forward with making the change to the page.

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.