Wordpress Load Menu onto another installation using jquery - javascript

Hi im using Wordpress for my website and have created a plugin, in this plugin im using Jquery to load data from a website to my other one. I have managed this ok with the following code. My issue is that im trying to load a wp-nav menu which has role restriction set on certain menu items. When i load the menu on another site it shows all the navigation links except the ones which you need to be logged in to see. So all ok so far.
I created a new wordpress install an wish to load the menu into this site, i am logged in with the same role as the other site and i cannot still see the menu items which my role allows me to see on the first website. How can i load external data which will allow me to see the same menu items?
in basic terms ive created a wordpress menu and i am trying to use Jquery .Load to load it onto a seperate install of wordpress so the menus are identical. This means i only have to update one menu. I can load the menu data but it doesnt have role access etc (understandable) but want to know how to do this.
<script>
(function($) {
//Load div from address
$(function(){
var contentURI= 'http://192.168.1.99/intranet #menu-department-menu';
$('#tabs-1 #scroller').load('/php/loadexternalurl.php?url='+ contentURI);
});
})(jQuery);
</script>
<?php echo file_get_contents($_GET['url']); ?> //used to load external data

Related

I want to use javascript on my asp.net master page

I'm creating a new asp.net web form with master page & I've created a simple side nav bar using html css and js to use for my admin dashboard and it's working fine
But,
When I'm converting this site to a master page to use this layout for my admin dashboard page it's not allowing me to use my js with it and when I'm clicking on the hamburger Icon to open the menu it's not working and when I went to console menu to see what's the wrong it showed the following error
and from what I can understand this error means my master page is not able to read the JavaSript I've written to open the menu on click event.
How can I use JS in my master page for its layout?
I was expecting to open the menu normally but it is not opening.

AJAX page load for Wordpress

Recently, I came across this website. There, when you click on a portfolio item, you see is a loading text which has covered the item you clicked and the page loads below the header. It doesn't even leave the page to go to the other page.
How can this be achieved. My WordPress site here, I've the look but only the ajax is left. Please help me out if you can, I really have no idea where to go from here :(
I've used the same image from this website. Just for working, will upload mine once done.
There are various plugins available on WordPress plugins repository which will ajaxify your website.
Advanced AJAX Page Loader
Ajaxify WordPress Site
Only thing you need to do is configure the plugin setting properly by specifying the ID of main page content and rest will be taken care by plugin itself.
There is also a jquery plugin available i.e PJAX which you can use and implement as per your requirements.
Hope it helps you.

How to create a sitemap that includes links of the navigation menu?

I have a website in which there is a navigation menu in each HTML page. In order to implement this, there is a JavaScript function that is called and writes the navigation panel with all the links
<!------------------------------------------------------------------------
HEADER Navigation bar
------------------------------------------------------------------------>
<script>
insertHeader();
</script>
Thus, if there is a change, it is done only in the JavaScript file and is automatically applied to dozens of pages across the website.
Problem:
I am trying to generate a sitemap with this tool. However, since my navigation panel is not written in the HTML (but inserted by JS), this tool does not recognize the navigation. As a result 99.9% of my website is not recognized. Other tools I saw also behave similar behavior.
1) How can I overcome this problem?
2) Will google crawlers see the other links I have in navigation panel?
This question is very old, but I ran into the same problem as you. I also create my nav using JavaScript. To be able to generate my sitemap, what I did was copy the JavaScript generated nav into my index.html temporarily. Then after successfully running the sitemap generator, the copied nav can be removed from index.html.

Smooth slide transition between two separate html files

is there any possibility to make smooth slide transition between two seperate html files?
Like for example.
On one html is
Link
and after clicking this link page is not reloading, just sliding to the second file?
You have to load the second HTML file into an iFrame or into a DIV by ajax, then slide it into view. You can use jQuery for that and for easy access to animations.
You may also would like to update the URL of your page, for that you can use location.hash to do it without reloading the page. You can also check for observehashchange plugin for jquery to check for the hash change when a user changes the URL.
You can view a sample here.
To have Google access the pages, you can add a sitemap.xml to your site to describe the pages and you may also have to setup webmaster tools to provide Google with useful information about your site. Here you can add the links and Google will got it. I have a page where more than 5000 links are seen by Google, however they aren't on any page by default.
But if you want to have normal <a> links on your page, you can use a simple jQuery to trigger the animation instead of going to the link.
Go to page 2
Go to page 3
Go to page 4
<script>
function LoadPage(page) {
//Put your page loader script here
}
$(document).ready(function(){
$(a).click(function(event){
event.preventDefault();
var page = $(this).attr('href').substr(1);
LoadPage(page);
});
});
</script>

How can I Implement Javascript to open a specific tab with SharePoint 2013?

So I'm working on a project where I'm building a website and I have many pages that include tabs from Bootstrap that use jQuery to work. They work really well and I love them but on my homepage I want to be able to link icons to specific tabs. Once clicked they should move the browser to that page and that tab should open instead of the default active tab. I've found numerous examples of javascript on how this would work but I don't know how I can get the JS to work on my SharePoint site.
// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
}
// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
window.location.hash = e.target.hash;
})
Twitter Bootstrap Tabs: Go to Specific Tab on Page Reload or Hyperlink
The above code is from that answered question and I'm wondering if someone can show me how to use this on my SharePoint pages.
So, I've worked on this a ridiculous amount of time for the problem I was actually having. I used the above code along with Bootstrap 3 and jQuery with CDN links in the page. That was correct. I also used the right notation for the url which is www.examplehere.com/blahblah#tab_tab1. The problem I was having was that I loaded this script at the top of the page, prior to the HTML 5 actually loading and making the tabs contained in the body on the SharePoint site. This meant that it went through the code to switch the open tab to the one dictated by the url but the code didn't have anything to change the tabs to since the tabs didn't exist.
So if you want this to work in SharePoint 2013. Save the above code as a .js file, link to it via a Content Editor Web Part, use the urls with the #tab_tab1 syntax as above, and please do yourself a favor and put the Web Part at the bottom of the page unlike I did.

Categories