WordPress.org

Forums

Easy FancyBox
image and text in article need separation (10 posts)

  1. urlogos
    Member
    Posted 4 years ago #

    First and foremost this plugin is great, just needing a little help.

    Easy-Fancybox is including the article or content from my post under the image in the overlay, I would like to get it to display the image ONLY keeping it separate from the article or content that follows below it in the post.

    I've also have removed the spacing/border=0 from the overlay and I found that there is some padding or margin still existing on the bottom?

    Any help or leads would be a great here! I've read through the support and didn't find anything mentioned about these issues.

    Thanks!
    Jean

  2. urlogos
    Member
    Posted 4 years ago #

    // here is an example of the loop

    <?php
         query_posts('cat=6,7,8&showposts=3');
    	if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    
    	<article <?php post_class('post-container') ?> id="post-<?php the_ID(); ?>">
    
    		<header>
    			</header>
    
    <a class="fancybox" href="#data<?php the_ID(); ?>"><img src="<?php video_thumbnail(); ?>"width="264" height="149" /></a>
    
    <div style="display:none"><div id="data<?php the_ID(); ?>"><?php $content = get_the_content(); $content = apply_filters('the_content', $content); $content = str_replace(']]>', ']]>', $content); echo $content; ?></div></div>
    
    		<footer>
    			<span class="category">Posted in <?php if (function_exists('parentless_categories')) parentless_categories(','); else the_category( ', ', 'multiple' ); ?></span>
    			<?php the_tags('<span class="tags">Tagged as ', ', ', '</span>'); ?>
    		</footer>
    	</article>
    
    <?php endwhile; else: ?>
    	<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
    <?php endif; ?>
  3. RavanH
    Member
    Plugin Author

    Posted 4 years ago #

    Hi Jean,

    I'm confused. You use...

    <?php $content = get_the_content(); $content = apply_filters('the_content', $content); $content = str_replace(']]>', ']]>', $content); echo $content; ?>

    (is that not exactly the same is simply <?php the_content(); ?> ?)

    ... inside the hidden div that is supposed to show in FancyBox, but then you do NOT want to show the content in FancyBox? I'm probably misunderstanding you. Do you have a link to a live example maybe?

    About the border at the bottom issue: you probably have the option 'Title position' set to 'Inside' which will append a larger border at the bottom allowing the title to show on that border. When you have a border of 0, that extra title area still gets appended... Try 'Outside'.

  4. urlogos
    Member
    Posted 4 years ago #

    Thank you for your response.

    Strangely, I tried to fix the border by altering the title position
    from inside to outside with no effect.

    any other suggestions? Also, when I had the corner "X" set to off it seemed to be allowing a user to off-click from the overlay to get it to close. Somehow while these adjustments were being made I lost that functionality - now using x=function over form.

    Sorry to stack these questions but It was nice having these effects, the "X" set to off and trying to streamline the overlay to show only the video.

    Jean

    Thanks for the help.
    Jean

  5. urlogos
    Member
    Posted 4 years ago #

    Please ignore the last part I about the "off-click" I got that to work.

    Thanks again!

  6. RavanH
    Member
    Plugin Author

    Posted 4 years ago #

    got a link for me?

  7. urlogos
    Member
    Posted 4 years ago #

    Ravan

    Thanks for being so helpful.

    Here is a link to the site: http://www.mishnoon.com/

    On the index I have the EASY FANCYBOX plugin in use. I am getting the post article text below the video only in the image overlay. It would be best to get this to display outside the overlay below the thumbnail and outside in the columns.

    Any idea on what to do here would be a great help.

    Thanks,
    Jean

  8. RavanH
    Member
    Plugin Author

    Posted 4 years ago #

    I see what you're trying to do there... But I think you're over-complicating it. Including iframes in inline content together with normal text... it explains the problems with FancyBox's auto-sizing.

    What if you just (1) revert to a normal post loop with simply <?php the_content(); ?>, (2) enable Vimeo (plus auto-detection) on Settings > Media > FancyBox plus enable "Allow title from alt" and (3) change each posts content to something like:

    <a href="http://vimeo.com/26906724">
    <img src="http://www.mishnoon.com/wp-content/uploads/2011/08/178220046_640.jpg"width="264" height="149"  title="Open this video in an overlay" alt="This video is for testing purposes. It is not the mishnoon films content nor is it intended to stay on the mishnoon website we are just demonstrating video integration for practical purposes." />
    </a>

    That way, the text will be displayed as title outside the box (or in overlay depending on FancyBox settings) and the unpredictable size issue is out of the way.

  9. urlogos
    Member
    Posted 4 years ago #

    Sorry, no luck there.

    Interesting it links to the "video-thumbnail" now and then you have to click again, which is on overlay to get go to the (resized) play video. 1 too many steps! Another thing to note is that the bottom border did disappear. That helped.

    I'm wondering if there is another approach I can take from here. The real goal is just to separate the video from the content that follows. For example, user would post a video and then write a bit of info about it maybe technical or inspiration for doing the film.

    When the user clicks to view the video, that's what I am using the plugin for, to focus just on the video no need for other stuff in the post like the technical info and stuff like that.

    Jean

  10. RavanH
    Member
    Plugin Author

    Posted 4 years ago #

    You should be able to get it to link to the video directly. It's all about how you create the Loop...

    Alternatively, you could ask authors to only insert the movie in an iframe and place their description in the Excerpt area. Then you adapt your Loop to show the video thumbnail together with the excerpt and link to the_content() in a hidden div... Just a thought.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic