There are several methods to open all external links in a new window.
- Specify for each url link by editing the link
- Use a plugin like External Links – nofollow, noopener & new window or External Links in New Window / New Tab
- Use jQuery to the footer.php before the body and HTML closing tags (source)
- Use jQuery in the Divi integrations tab (source)
- Add a class to the link (or use an existing one) and open all links with that class in a new window
jQuery for the footer.php solution
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function($) {
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if(!a.test(this.href)) {
$(this).click(function(event) {
event.preventDefault();
event.stopPropagation();
window.open(this.href, '_blank');
});
}
});
});
//]]>
</script>
Code language: HTML, XML (xml)
jQuery for the Divi integrations tab.
<script>
jQuery(document).ready( function($) {
// Open all external link in a new tab
$('a').each(function() {
var a = new RegExp('/' + window.location.host + '/');
if (!a.test(this.href)) {
// This is an external link
$(this).attr("target","_blank");
// Remove after your tests
console.log($(this));
}
});
});
</script>
Code language: HTML, XML (xml)
JavaScript to open in a new window
Also work in the Gutenberg html block.
<script>
document.addEventListener("DOMContentLoaded", function () {
const links = document.querySelectorAll("a");
links.forEach(link => {
const href = link.getAttribute("href");
if (href && !href.includes(window.location.hostname)) {
link.setAttribute("target", "_blank");
link.setAttribute("rel", "noopener noreferrer");
}
});
});
</script>Code language: HTML, XML (xml)
Open in new windows based on a class
<script>
jQuery(document).ready(function(){
jQuery('.hws_external a').attr('target','_blank');
});
</script>
Code language: HTML, XML (xml)