Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Flexslider external links WordPress

  • SOLVED

I've added target="_blank" to the links that show in the content of my flexslider slides, but the preventDefault() function in the flexslider [[LINK href="https://github.com/woothemes/FlexSlider/blob/master/jquery.flexslider.js"]]source code[[/LINK]] seems to be causing them not to work as links will only open in the <em>same</em> window, not an <em>external</em> window as I'd like.

I've created a custom post type called 'slides' and am calling the slider as below, the links are being called from a custom field.


<div class="flexslider group">
<ul class="slides">
<?php
query_posts(array(
'post_type' => 'slides',
'orderby' => 'menu_order',
'order' => 'ASC'
));
if ( have_posts() ) while ( have_posts() ) : the_post();

?>
<li>
<?php if ( has_post_thumbnail() ) {
the_post_thumbnail('slide');
} ?>

<div class="banner-text">
<h2><?php the_title(); ?></h2>
<?php the_content(); ?>
<a class="flex-link" href="<?php global $post; $text = get_post_meta( $post->ID, '_cmb_slide_link', true ); echo $text; ?>" target="_blank">Learn More &rarr;</a>
</div>

</li>
<?php endwhile; wp_reset_query(); ?>
</ul>
</div>


Is there something I can add either to this link to make it open in a new window or else some way to modify the flexslider code?

I've tried using onclick="window.open(this.href,'_blank');return false;" which does open the link in the new window, but it also opens the link in the current window as well.

Answers (2)

2014-02-20

Ryan S answers:

Hi try this code


jQuery(document).ready(function() {
jQuery(".flex-link").click(function() {
jQuery(this).attr("target", "_blank");

return false;
});
});



if the above code still didn't work try this instead

jQuery(document).ready(function() {
jQuery(".flex-link").click(function() {

var url = jQuery(this).attr('href');
jQuery(this).attr("target", "_blank");

// open in new window
window.open(url,'','width=800,height=600');

return false;
});
});



Hope that helps


Mike Sewell comments:

The first one did it, thanks Ryan


Ryan S comments:

okay great.

2014-02-20

Sabby Sam answers:

Hi, You should try this ( http://www.stylinwithcss.com/blog/post.php?s=2013-02-11-make-external-links-open-in-new-windows) or edit the flex slider jquery and it should work according to your requirement


Mike Sewell comments:

The info in the link just does the same thing as the javascript at the bottom of my question.


Sabby Sam comments:

Please pm me the details, I will fix for you.