Forums

Open A New Page For An External Link In The Nav Bar

Permalink 2 users found helpful
I'm not seeing a way to have the external link in a navigation bar open into to a new window? There is no option for target="_blank". Others have asked in the forums, but I haven't seen a clear answer. This is just for one of my links in the navigation bar, which leaves the site.
sschildbach
 
jjdb210 replied on at Permalink Best Answer Reply
jjdb210
I've fixed this a few ways in the past, and it kind of depends on how you want to go about doing it...

To my knowledge there is no way currently to do this via the C5 admin panel...

You can modify a the autonav template to add this support (I haven't personally gone that route yet)...

The route I tend to use (simply because it tends to be the quickest for me, and I apply it to all links, not just the ones in my navigation), is to use Javascript to apply the new window to any "outbound" links... This simple javascript added to the head does a pretty good job of it:

<script type = 'text/javascript'> 
function openinnew() {
   if (!document.getElementsByTagName) return;
   var links = document.getElementsByTagName("a");
   for (var i=0; i<links.length; i++) {
      if (links[i].getAttribute("href")) {
         if (links[i].getAttribute("rel") == "external" || (links[i].getAttribute("href").substring(0,4) == 'http' && links[i].getAttribute("href").indexOf('YOURDOMAINGOESHERE.COM') == -1)) {
            links[i].onclick = new Function("window.open('"+links[i].getAttribute("href")+"'); return false;");
         }
      }
   }
}
window.onload = openinnew;
</script>


(Don't include the <?php ?>, the forum seems to be adding that on my behalf...)... Also, be sure to replace the domain name with your domain name...
sschildbach replied on at Permalink Reply
sschildbach
That is beautiful jjdb210. I would have never thought of that. You get a "red heart" for that one.
jasteele12 replied on at Permalink Reply 1 Attachment
jasteele12
This is my solution using a autonav template and a Page Attribute called new_window.

Attached is new_window.php.txt - rename/move this to blocks/autonav/templates/new_window.php - I've commented out the original code so you can see the changes.

Create a new Page Attribute:

Open in a New Window new_window checkbox

Now when you add a new page, you will have a checkbox to Open in a New Window.

In Edit Page mode, click the autonav block, click Custom Template and select New Window.

This can also be done with header_menu, breadcrumb, etc.

Hope that made sense.
Mnkras replied on at Permalink Reply
Mnkras
in 5.4.1 there is a new attribute that will allow this
jasteele12 replied on at Permalink Reply
jasteele12
Figures, but hey it was worth learning how to do :)
webinstinct replied on at Permalink Reply
webinstinct
Hey all. Here is a thinner way to do it using jQuery (and doesn't require updating your domain):

$(document).ready(function() {
  $("a[@href^=http]").each(
    function(){
       if(this.href.indexOf(location.hostname) == -1) { 
        $(this).attr('target', '_blank');
      }
    }
  )
});


In case you are unaware, jQuery is automatically bundled with C5. So throw that in <script> tags into your header and you're set!
jasteele12 replied on at Permalink Reply
jasteele12
Hi DaveS,

That would make all external links open in a new window/tab - not *a* link in the autonav, like the forum question was asking for.

Nice clean jQuery code though.
webinstinct replied on at Permalink Reply
webinstinct
True enough. Ran into some problems with that code anyway - so I went back to the one above. That's what I get for trying to help! LOL
nbruley replied on at Permalink Reply
@Mnkras Sorry for my ignorance, but can you please provide a link to how to do this? I have the latest version and don't see the attribute. Thanks.

Edit: Oh I see, it's in the dialog when you add the external link in the sitemap.
nbruley replied on at Permalink Reply
Ugh... I don't see a way to add custom attributes to external links though, so I'm back to square one on this because my navigation relies on custom attributes for its images... Any help here is appreciated. I did have it go to a dummy page and used an htaccess redirect so I may have to try that route again and figure out a way to get the htaccess redirect to open in a new window??
sschildbach replied on at Permalink Reply
sschildbach
I might be able to help if you remind me with html code or further explanation of what you mean by "attribute".
nbruley replied on at Permalink Reply
Thanks! Just noticed your reply now because I didn't realize I wasn't able to receive email notifications for a while.
To get the picture links in my navigation, I set Picture-on and Picture-off custom image attributes (under page properties).
The explanation of how it works is here:
http://www.codeblog.ch/2009/12/image-navigation-items/...
Now that I think about it, I suppose I could probably figure out how to set an attribute "open in new window" as well included in that code somewhere that might somehow do the trick... if you have ideas on the easiest way I'm all ears!
nbruley replied on at Permalink Reply
Even better, I could probably set up a text attribute with the actual address of the external link...
nbruley replied on at Permalink Reply
Found a solution:

Create a new text attribute "external_link"

And use the following code:
$picOn = $_c->getAttribute('pic_on');
$picOff = $_c->getAttribute('pic_off');
//$picHover = $_c-&gt;getAttribute('nav_img_hover');
$external_link = $_c->getAttribute('external_link');
if ($picOn) {
  $linkTextActive = '<img src="' . $picOn->getURL() . '" alt="' . $linkTextActive . '"/>';
}
if ($picOff) {
 $linkTextInactive = '<img onmouseout=src="'.$picOff->getURL().'" onmouseover=src="'.$picOn->getURL().'" src="' . $picOff->getURL() . '" alt="' . $linkTextInactive . '"/>';
}
if ($c->getCollectionID() == $_c->getCollectionID()) { 
   echo('
   <li class="nav-selected nav-path-selected"><a class="nav-selected nav-path-selected" href="' . $pageLink . '">' . $linkTextActive . '</a>'); 
} elseif ( in_array($_c->getCollectionID(),$selectedPathCIDs) ) { 
   echo('
Viewing 15 lines of 26 lines. View entire code block.


Then, add the full URL to the external link in the external_link attribute for that page, and it should go to that page instead of the dummy one, without a redirect required. It still requires a dummy page, but at least you don't have to mess with redirects and it opens in a new window.
FatTony1952 replied on at Permalink Reply
FatTony1952
It allows you to check the box, but I still haven't gotten it to function properly. It never opens up in a new window.