There are some examples out there that implement a main menu with ajax and use the history API to get nice and expressive url's.
For example: http://diveintohtml5.info/examples/history/casey.html
The problem, following the example, is that you need 2 files per dog, one for the ajax content request, and the other for the url including a header, footer and so on - which even if its just a php include, is annoying to maintain becasue there are lots of duplicate files (especially in the case where there are more people editing the website)
Is there not a better way to do this?
I doubt I am understanding you question correctly but here goes how I would handle it
<?
include("assign.inc");
if ($_REQUEST["hide"] != "all"){
include("head.inc");
}
?>
page content <img src="test.jpg">
<?
if ($_REQUEST["hide"] != "all"){
include("foot.inc");
}
?>
So the ajax call would simply have ?hide=all on the url (or as a post)...if you want to only show the image (and not the text) simply add more criteria (modify hide if's)
Related
I need some help to better understand SEO with ajax loaded content.
Here the context:
I have a single.php where content is dynamically generated (with php and an xml database) for each single post.
I load a container of this single.php inside my index.php page via ajax.
Here the working script:
$.ajaxSetup({cache:false});
$(".phplink").click(function(){
var post_link = $(this).attr("href");
window.location.hash = "!"+ post_link ;
$("#ajaxify_container").html("loading...");
$("#ajaxify_container").load('single.php?blog_no='+post_link+' #container');
return false;
});
$(window).hashchange( function(){
var hash = window.location.hash;
var hash = location.hash.replace("#!","");
if(hash != '') {
var post_link = hash;
$("#ajaxify_container").html("loading...");
$("#ajaxify_container").load('single.php?blog_no='+post_link+' #container');
}
else {
$.get(hash, function (data) {
$("#ajaxify_container").html('');
});
}
});
$(window).hashchange();
An example of a link in index.php (when I click on a link I've got in url website.com/#!12) :
<a class="phplink" href="12">Post 12</a>
And in my .htaccess file I added this lines to rewrite properly the url:
Options +FollowSymLinks
RewriteEngine on
RewriteRule /([0-9]+)$ /single.php?blog_no=$1
Everything works fine... (by the way, my single.php is SEO friendly "alone" and works without javascript)
However, by using ajax like this, with dynamic php page, is it still SEO friendly?
I know that ajax is difficult to be crawled. What is the best way to have a good (not the best, something correct) SEO with ajax content?
Regarding the structure of the link, I don't fully understand what google bot will crawl.
Because of the href="12", so the dynamic href="/single.php?blog_no=12".
In the web browser :
website.com/single.php?blog_no=12 and website.com/12 load only my single.php page
website.com/#!12 load my index.php page with a container loaded from website.com/single.php?blog_no=12
Of course I only want that google crawls the hashbang url...
(EDIT: if I open the link in a new tab with right click, it loads the single.php (that I don't want). It seems to be a normal behavior but...I want to prevent it)
Sorry for my English, I'm French.
Dynamically loaded content is generally hard to get right from an SEO perspective. Your description is a little confusing, but I think I have an idea of what you're looking for.
First of all, there are mainly two ways with which Google finds out about pages on your site:
A Sitemap (Google likes XML sitemaps) - A file that tells Google every page on your site to index
Links - Google will follow any internal link on pages it tries to index unless they are marked with rel="nofollow"
There's also links in and some other stuff, but for the purposes of this explanation...lets ignore those.
Anyway, unless you're explicitly telling Google that website.com/single.php?blog_no=12 exists, it's going to have a hard time finding it. To be honest, I'm not sure how Google will handle something like href="12", it may try to follow that link to website.com/12 which may effect your ranking if there is nothing there. So in the end, you might want to add rel="nofollow" to your AJAX trigger links.
A good way to handle AJAX and dynamically loaded content is to make sure fallbacks are in place, for example if you have something like href="single/12 set up to load some content with AJAX, you should also have a fallback page that doesn't use JS/AJAX. This ensures that both search engine bots, and users without Javascript can see that content if it otherwise wouldn't have been visible anywhere else.
Last small tidbit, if you test your links on something like http://www.dnsqueries.com/en/googlebot_simulator.php and they turn up with errors, or blank pages (search engine bots don't use javascript) you should nofollow those links, or setup fallback pages
Nevermind...this is the last thing. You should go a couple steps further with your htaccess rewrite to make your URLs completely clean of query strings. For example website.com/single/blog/12 is better than website.com/single.php?blog_no=12 for both SEO and users.
I'm new to PHP and want to apply a specific class to the title of my page depending on what part of the site the viewer is browsing.
For instance, I want to apply the class "blog" to the if the viewer is at domain.com/blog OR domain.com/blog/post-1 so on and so forth BUT apply the class "pics" if they're viewing domain.com/pics or domain.com/pics/gallery-1 etc etc.
I found something that could be modified to serve my needs using javascript here
but I figured seeing as I'm using PHP already, it'd make more sense to keep this sort of thing server side.
As I say, I'm new to PHP. I've experimented with some regular expressions, but to no avail.
EDIT: Sorry not to be more specific in my first post, I am using wordpress as my CMS - this is my first stackoverflow post, I trust you can forgive me :)
<?php
if (substr($_SERVER['REQUEST_URI'], 0,5)=='/pics') {
$h1class='someclass';
}
The it depends on how you're putting the class in the tag, might be like this
?><h1 class="<?php echo $h1class; ?>">...
Rather than putting a class in based on the page, I would suggest having seperate CSS files for home.css, blog.css, whateverelse.css. Of course, these would be in addition to some sort of default.css or site.css or whatever that would contain the styles used across the site.
You can then build a function/method to create the CSS calls in the HTML header. I usually have a "Page" object that builds the actual HTML page, and a "get_css" method that spits out the CSS calls.
It's hard to get more specific without knowing how you currently build pages.
Here is the solution I ended up crafting. Credit to #m.buettner for pointing me towards explode().
<h1 id="title-text" class="
<?php #returns the category as a class
$url = array();
$url = explode('/', get_permalink());
echo $url[3];
?>
mono in-case-404">
SITE
</h1>
I have a menu that wants to change only the content.
I wanted a separate files for different pages to organize.
I could save menu in a separate php file and include that in the main page.
Still seems a bit repetitive when there are more than 10 menus.
I know there is an anchor tag navigation that updates content part with jQuery.
But I kinda don't like that # tag in the address bar for some reason (or shouldn't I?)
Is there a better way to manage this?
I could save menu in a separate php file and include that in the main page.
Yes. Do that.
I know there is an anchor tag navigation that updates content part with jQuery.
Breaks search engines. Depends on JS. Avoid it.
I don't think that to add just one line with include into each file is indeed such a repetitive task. 99% of local folks a way more repetitive in thir code.
However, if you want something more intelligent, you can create one program file contains menu, and many data files, shown according to user choice
here is a very simple example
Main page<br>
<a href=?about>About</a><br>
<a href=?links>Links</a><br>
<br><br>
<?
if (empty($_SERVER['QUERY_STRING'])) {
$name="index";
} else {
$name=basename($_SERVER['QUERY_STRING']);
}
$file="txt/".$name.".htm";
if (is_readable($file)) {
readfile($file);
} else {
header("HTTP/1.0 404 Not Found");
exit;
}
?>
I have a very dynamic (social networking) site running smarty that I want to enable caching for.
My Structure:
index.php display()s template.tpl
template.tpl include()s indexContent.tpl
Most of the content in template.tpl is static .. such as the scripts, banner, footer.. etc. How can I cache that but not specific parts which look different to depending on whose logged in (among other factors)?
I've discovered 3 methods:
{nocache} {include='indexContent.tpl'} {nocache}
{dynamic} {include ...
Set the cache_id for each page.
Unfortunately each has a problem:
Doesn't really seem to work? Dynamic content still gets cached..
Not sure how to implement or how it's different than (1)
How to identify uniquely? Some pages have the same "name" but different content for specific members... think "myProfile.php"
Any suggestions? Thanks!!
You can use reverse proxy, like Varnish to cache the static part of the page and to include your dynamic content as Server-Side Includes (for Varnishi it is ESI). Next you will need to setup the caching rules for your static and dynamic URLs so that the static one will be cached for a long time period while the dynamic one will not be cached at all.
To make it easier to understand the whole idea here is how your page HTML code could look like:
<html>
<head>...</head>
<body>
...some static layout...
<esi:include src="/esi/indexContent.php"/>
...some another static layout...
</body>
</html>
Where /esi/indexContent.php is the script that generates the dynamic content.
For Varnish: beware of the gzipped or deflated content with ESIs as it is described in the answer here
We have the same scenario. Our entire front page is cached except for a couple of dynamic elements (news, latest forum threads) and the easiest way I found to get around this is to add in a keyword to the cached template
NEWS_BLOCK
on your logic script you then load your news template and preg_replace it with the keyword.
$news_template = $smarty->fetch('news_template.smrt');
$page_body_raw = $smarty->fetch('frontpage.smrt');
$page_body = preg_replace('/NEWS_BLOCK/', $news_template, $page_body_raw);
in 3 way u can save cache file by this name:
myprofile_id for example a persone that registered and his id is 455 in user table u can save cache file for he with this name myprofile_455
after that u can include cached file in tpl file like this:
{include file="cache/myprofile`$smarty.get.userid`.html"}
I know the question is old my i am still proposing a solution to help someone else.
I seem to get into same trouble with a social networking site i am developing. Here is the solution that worked for me
Doesn't really seem to work? Dynamic content still gets cached..
Not sure how to implement or how it's different than (1)
Just remove the static part of your page like footer and header and put them in a different tpl file. Then include the tpl file as
{include file='head.html' cache_lifetime=5000}
or conversely remove the dynamic part of your page and put it in another template and include it as
{include file='head.html' nocache}
3.How to identify uniquely? Some pages have the same "name" but different content for specific members... think "myProfile.php"
for same page with different content like a profile page, you can pass profile Id as a parameter to cache call.
$my_cache_id = $_GET['profile_id'];
$smarty->display('index.tpl', $my_cache_id);
This will ensure that same page with different parameters are not treated as same page.
Hope this helps.
Is there a php or javascript code that can detect the current user's page and then add <a class="active"> to an item in a ul (my menu). I include my menu in my pages with PHP include so making change is easy; I only have to edit it once. But, with that method, I can't individually set each page to have a class="active". How can I do this?
You several options, e.g.,
The part that handles navigations can read the request URI directly. This can be done by reading $_SERVER['REQUEST_URI'] (don't forget this may include the query string).
At some point, you must know what page you're on, because you decide which content you display based on that. You can define a function that handles the navigation markup and pass it the name of the current page so that it knows which one it is.
If I'm understanding your question correctly, what I usually do is set a variable before I include the header, like
$current = "home";
And then in the header I'd have an if statement in each link
<a href="/home" <?php if ( $current == "home" ) { echo "class='active'" } ?>>Home</a>
Could be ways to improve it, but it's simple if your menu isn't too big.
In PHP, you can look at the value of $_SERVER['REQUEST_URI'].
In JavaScript, you can examine window.location.