Load page into DIV with Ajax
-
I’m really a noob when it comes to WordPress, right now I’m working on a theme that basically is all static, if you want to edit something you’ll have to edit the .php file than rather doing it on the admin. It is a landing page where you click a menu button and a modal appears with the content, to do this I followed this tutorial which is not exactly WordPress-oriented. I’m loading static pages via ajax and I really want to change this to editable WordPress pages but I have no idea how to do it. I don’t post the code because everything is like in the tutorial, I haven’t used functions.php or anything. How would you call the content of a page to load as if it was a static page just like in that tutorial?
The ajax call
$(function() { $('.w-container .w-nav-menu a').click(function() { var $linkClicked = $(this).attr('href'); var $pageRoot = $linkClicked.replace('#', ''); if (!$(this).hasClass("active")) { $(".w-container .w-nav-menu a").removeClass("active"); $(this).addClass("active"); $.ajax({ type: "POST", url: "./wp-content/themes/THEMENAME/load.php", data: 'page='+$pageRoot, dataType: "html", beforeSend: function(){ $('#canvasloader-container.wrapper').show(); }, complete: function(){ $('#canvasloader-container.wrapper').hide(); }, success: function(msg){ if((msg)) { $('.content').html(msg); $('.content').hide().fadeIn(); } } }); } event.preventDefault(); }); var hash = window.location.hash; hash = hash.replace(/^#/, ''); switch (hash) { case 'products' : $("#" + hash + "-link").trigger("click"); break; case 'about' : $("#" + hash + "-link").trigger("click"); break; case 'storelocator' : $("#" + hash + "-link").trigger("click"); break; case 'media' : $("#" + hash + "-link").trigger("click"); break; case 'faq' : $("#" + hash + "-link").trigger("click"); break; case 'contact' : $("#" + hash + "-link").trigger("click"); break; } });
load.php
<?php if($_POST['page']); $page = $_POST['page']; if(file_exists('pages/'.$page.'.php')) echo file_get_contents('pages/'.$page.'.php'); else echo 'Unavailable'; ?>
I have only found tutorials with posts and that stuff, and that’s not what I want.
I’m new to this forum so if I’m posting on the incorrect section, please, move it
[ No bumping please. ]
- The topic ‘Load page into DIV with Ajax’ is closed to new replies.