Here is my problem, I have an iframe of a wordpress page (with stripped header/fooder/sidebar) with lots of links and I want when the user clicks on the links for them to open on the parent window and not the iframe.
I know I can use:
<a target="_parent" href="http://url.org">link</a>
on the links, but since the links point to wordpress posts and the list of posts is updated dynamically, this isn't a very good option. I can't edit them one-by-one to add the target. Plus, it might interfere with the rest of the site's links.
Another option is to use
<base target="_parent">
on the iframe header but I don't know how to do that.
Suppose I have this code to add the iframe:
<iframe class="bg-dark3" style="border: none;" src="https://www.google.com" scrolling="no"></iframe>
Where and how can I add the <base target="_parent"> line?
You can add this to your Wordpress site. It's Jquery to open the links in the parent. So please make sure Jquery library is loaded.
$('a').click(function(){
//Get url from anchor
var link = $(this).attr('href');
//Open url in parent
window.parent.parent.window.location = link;
});
This will automatically open the links in the parent, you wouldn't need to add target=_parent to each link manually.
Related
Hello I have the following problem: I have my website made in Wordpress, and I have a 3D Cover Carousel plugin there, which shows me a gallery of photos in 3d. The thing is that when I click on the image I want the link to be opened in a NEW tab. In the plugin settings there are no such an option. The plugin html is a short code added to my page. So the only thing I can change is Additional css. So is there any options to make a link be opened in a new tab only with css?
As it was previously stated here, there is no way to do this with pure CSS.
If you can use JavaScript, you can target the item and add it the attribute target="_blank".
document.getElementById("element").setAttribute("target", "_blank");
document.getElementById("element").setAttribute("target", "_blank");
You can add this piece of js in your footer.php file.
Another method is to add a js file and include it using wp_enqueue_script function in your function.php file.
How to open all links in Wordpress in a new tab? I am using a Child Theme of Sydney wordpress. I do not know coding. Thanks for any help
Open up your /index.php file and pop this within the <head> tag.
<base target="_blank">
P.S. If your not able to do this. It might be best to do at-least a tiny bit of research about web code and Wordpress.
If you want the menu items open in new tabs then there is an option for that in menu options. please see below images
tick link target option
open link in new tab
If you want all external links open in new tabs , then
I tried a few plugins for this, and “Open external links in a new window” was my favorite.Search it in plugin page, install it. It will work well. :)
jQuery
jQuery( document ).ready(function() {
jQuery("a").attr("target", "_blank");
});
without jQuery
<base target="_blank">
As soon as you create a menu item for a page there is a link that it automatically populated with it. How do i stop wordpress from making these links? I'm capable of making them myself and don't always want them to link to thier specific page.
I figured it out using and dropping it in my header.php
<script type="text/javascript">
jQuery(function($) {
$("li.menu-item-627,li.menu-item-14,li.menu-item-20,li.menu-item-28").children("a").attr('href', "javascript:void(0)");
});
</script>
You have to use firebug or chrome "inspect element" to find out what your menu items are and then just replace the numbers in the code accordingly.
also if you don't want them to show up at all add the following code
<script type="text/javascript">jQuery(function($) { $("li.menu-item-627").contents().hide();});</script>
those two together will hide the disabled menu link
you can then add your own links in the "navigation label" of the page menu field!
good luck and let me know if you have any questions, i will do my best to help!
I have an index.html page which contains an iframe into which all pages of the site are loaded. Has anybody a function (maybe javascript)? so that when you open Home.html via the google sitemap for example, it shows up in the parent frame in Index.html instead of opening by itself? Thanks.
Try adding the following to the <head>-section of your inner page:
<base target="_parent" />
But note, this will open all of the links contained in the inner page in the parent page.
I'm currently migrating my HTML website into a WordPress theme.
My current HTML website makes full use of jQuery's .load() function, by where I change the content of the page (via a DIV), using .load() based on my side menu options selected by the user.
For example:
HTML Code:
<div id="sidebar">
<ul id="themenu" class="sf-menu sf-vertical">
<li>Home</li>
<li>About Us</li>
</ul>
</div>
jQuery Code:
$("#themenu li a, #subcat li a").click(function(){
var toLoadCF = $(this).attr("href")+" #contentfooter";
$('#contentfooter').fadeIn("slow",loadContent);
function loadContent() {
$("#contentfooter").load(toLoadCF);
}
return false;
});
So using this as an HTML situation, the user clicks on the "About Us" menu option, which would basically in turn load the "about-us.html" file based on a href tag for About Us.
Now in the WordPress world, I have created a custom page template for About Us called "about-us.php" that is linked to a WP Admin dashboard page called "aboutus" (permalink), so my a href value is "url/aboutus/"
Based on this, how can I achieve the same result in WordPress to emulate my HTML coding using jQuery .load?
Please be aware that I have added all the necessary info in my header.php, index.php and sidebar.php files.
I'm just unsure how to reference the a href file, so that my about-us.php file is loaded using jQuery's .load().
I'm not too sure how to approach this from a WordPress perspective.
First off I'd go about making the site fully functional WITHOUT the javascript loading. This'll get your navigation and site layout proper before you get fancy and will also provide a fallback for crawlers and for when your JS breaks.
Next, make a subset of templates, or modify your existing templates, to react to a GET var in the URL to exclude everything but the main content area of the template. For the Ajax load you won't need things like the header, foot and sidebar.
Then I'd use jQuery to grab navigation links click events, modify the request URI to put a GET var in, and then make the request using .load().
A side benefit of this is when you turn on caching (yes, you want to run your site with caching, its wordpress, its far from "light") your Ajax requested pages will also be cached for tighter load times and less resource usage.
I assume since you've done it before that you know how to handle the jQuery action binding, request and response parsing.