jckwoo
asked on
Bread crumb path on homepage
There is a bread crumb path on my company's intranet homepage. I'm using ASP & HTML to build this homepage.
eg. You are here: Home / HR / Announcements / Benefits / current page
How do I make each section a clickable link to it's respective folder? The path should show what page the user is on in relation to the homepage and the links followed to get there.
eg. Clicking on Home takes you to homepage
Clicking on HR takes you to the HR folder
Clicking on Announcements takes you to the Announcements folder
....etc
Please provide ASP code.
eg. You are here: Home / HR / Announcements / Benefits / current page
How do I make each section a clickable link to it's respective folder? The path should show what page the user is on in relation to the homepage and the links followed to get there.
eg. Clicking on Home takes you to homepage
Clicking on HR takes you to the HR folder
Clicking on Announcements takes you to the Announcements folder
....etc
Please provide ASP code.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
If you don't want that then change
for i = 0 to UBound(aTemp)
to
for i = 0 to UBound(aTemp) - 1
for i = 0 to UBound(aTemp)
to
for i = 0 to UBound(aTemp) - 1
What about using this Javascript breadcrumbs
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function breadCrumbs(delimiterStr) {
loc2 = window.location.toString()
loc = loc2.toLowerCase();
subs = loc.substr(7).split("/"); // Assume the first 7 characters are http://
//Added class="breadCrumbs" so that a style sheet can be used
document.write("<a class=\"breadCrumbs\" href=\"" + getLoc(subs.length - 1) + "\">Home</a> " +
delimiterStr + " ");
a = (loc.indexOf('index.') == -1) ? 1 : 2;
if (subs[subs.length-1].lengt
a++;
}
for (i = 1; i < (subs.length - a); i++) {
subs[i] = makeCaps(unescape(subs[i])
//Added class="breadCrumbs" so that a style sheet can be used
document.write("<a class=\"breadCrumbs\" href=\"" + getLoc(subs.length - i - 2) + "\">" +
subs[i] + "</a> " + delimiterStr + " ");
}
document.write(document.ti
}
function makeCaps(a) {
g = a.split("_");
for (l = 0; l < g.length; l++) {
g[l] = g[l].toUpperCase().slice(0
}
return g.join(" ");
}
function getLoc(c) {
var d = "";
if (c > 0) {
for (k = 0; k < c; k++) {
d = d + "../";
}
}
return d;
}
//-->
</script>
</head>
<body>
<!--
Use this if you want to use an arrow image
<script type="text/javascript">bre
-->
<br />
<script type="text/javascript">bre
</body>
</html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function breadCrumbs(delimiterStr) {
loc2 = window.location.toString()
loc = loc2.toLowerCase();
subs = loc.substr(7).split("/"); // Assume the first 7 characters are http://
//Added class="breadCrumbs" so that a style sheet can be used
document.write("<a class=\"breadCrumbs\" href=\"" + getLoc(subs.length - 1) + "\">Home</a> " +
delimiterStr + " ");
a = (loc.indexOf('index.') == -1) ? 1 : 2;
if (subs[subs.length-1].lengt
a++;
}
for (i = 1; i < (subs.length - a); i++) {
subs[i] = makeCaps(unescape(subs[i])
//Added class="breadCrumbs" so that a style sheet can be used
document.write("<a class=\"breadCrumbs\" href=\"" + getLoc(subs.length - i - 2) + "\">" +
subs[i] + "</a> " + delimiterStr + " ");
}
document.write(document.ti
}
function makeCaps(a) {
g = a.split("_");
for (l = 0; l < g.length; l++) {
g[l] = g[l].toUpperCase().slice(0
}
return g.join(" ");
}
function getLoc(c) {
var d = "";
if (c > 0) {
for (k = 0; k < c; k++) {
d = d + "../";
}
}
return d;
}
//-->
</script>
</head>
<body>
<!--
Use this if you want to use an arrow image
<script type="text/javascript">bre
-->
<br />
<script type="text/javascript">bre
</body>
</html>
I believe Iguanasan's code assumes that each breadcrumb is a path back to the root directory. This is not always the case. You may be on "Home / HR / Announcements / Benefits /", but you could still only be in the folder "Home / HR". Best practice for breadcrumbs: what is the optimum path you want your users to travel to access this information? Then display those breadcrumbs. This often requires manually programming the breadcrumbs.
bjrcreations makes a good point. As for my code: I just gave him what he asked for.
Iguanasan, you are right - your code works great given his requirements.
ASKER
Bjrcreations & Iguanasan,
Is there a way to make this work? I should clarify that there is drop navigation bar on top of the page. Each time you go to a folder & subfolders, the breadcrumb path changes.
Is there a way to make this work? I should clarify that there is drop navigation bar on top of the page. Each time you go to a folder & subfolders, the breadcrumb path changes.
It does work. I'm not sure I understand the question.
jckwoo,
Isn't that what you want? When you go to a folder or subfolder, it changes the path to include that folder or subfolder - right? So if you were on "Home / HR" and you click on the Announcements link (taking you to the announcements folder), you are now in "Home / HR / Announcements". If this is the case, Iguanasan's code should work.
bjrcreations
Isn't that what you want? When you go to a folder or subfolder, it changes the path to include that folder or subfolder - right? So if you were on "Home / HR" and you click on the Announcements link (taking you to the announcements folder), you are now in "Home / HR / Announcements". If this is the case, Iguanasan's code should work.
bjrcreations
ASKER
It's displaying the name of the asp file where I saved your code.
eg. Home | test.asp