Get rid of the same boring title on every page...

FormerLurker

That loader solved it -- thanks!

bwg

asd wrote:

I'm not sure what your site is so I can't look, but it sounds like you just aren't calling the ContextualizeTitle function since your onload handler is already taken.

I use a neat little loader that I got from one of jfriend's posts on here. In essence, you specify this function as your onload handler and then dump into it calls to all the other functions you want run.

digging around the javascript that smugmug puts in every page, i found a nifty little function that i've actually already been using myself.

the addEvent(obj, event, handler) function will add an event handler to a given objects event stack.

so for example, addEvent(window, "load", ContextualizeTitle); will add the ContextualizeTitle function to the window.onload event. Your code would now look like:

addEvent(window, "load", AddReferralCode);
addEvent(window, "load", ContextualizeTitle);

you dont need to put anything in the body tag or have any extra javascript wrapper functions. It's the ultimate in separation of behavior from content.

FormerLurker

Works great - thanks!
Just updated mine to include the event handler and it's working great!

devbobo

Rework the code if anyone is interested, removed all the indexof code in place of regular expressions..

var titleSettings = new Array();
/*
--------------------------------------------------
    customize page title settings
--------------------------------------------------
*/
titleSettings.separator   = ": "; // text to insert between parts of title
titleSettings.maxLength   = -1;   // limits length of title (-1 == no limit)
titleSettings.doPhotos    = true; // true == append photo captions
titleSettings.doAlbums    = true; // true == append album names
titleSettings.doGalleries = true; // true == append gallery names

function ContextualizeTitle() {
  var re1 = /([\s\S]*)( - powered by smugmug)/;
  var re2 = /([\s\S]*) (galleries|sub-categories)/;
  var newTitle = document.title;
  var newText = null;
  if(!IsHomePage()) 
  {
    // add gallery title
    if(titleSettings.doGalleries)
    {
      var galleryTitle = document.getElementById("galleryTitle");
      if(galleryTitle)
      {
        var galleryTitleText = GetTextContent(galleryTitle);
        if(galleryTitleText.length > 0)
        {
          galleryTitle = galleryTitle.replace(re2, "$1")

          newText = titleSettings.separator + galleryTitle;
          newTitle = newTitle.replace(re1, "$1" + newText + "$2");
        }
      }
    }

    // add album title
    if(titleSettings.doAlbums)
    {
      var albumTitle = document.getElementById("albumTitle");
      if(albumTitle)
      {
        var albumTitleText = GetTextContent(albumTitle);
        if(albumTitleText.length > 0)
        {
          newText = titleSettings.separator + albumTitleText;
          newTitle = newTitle.replace(re1, "$1" + newText + "$2");
        }
      }
    }

    // add photo title
    if(titleSettings.doPhotos)
    {
      var photoTitleText = GetPhotoCaption();
      if(photoTitleText.length > 0)
      {
        newText = titleSettings.separator + photoTitleText;
        newTitle = newTitle.replace(re1, "$1" + newText + "$2");
      }
    }

    if(titleSettings.maxLength > -1)
      newTitle = newTitle.substr(0, titleSettings.maxLength);

    document.title = newTitle;
  }
}

function GetPhotoCaption() {
  var photoTitle = document.getElementById("caption_bottom");

  if(!photoTitle)
    photoTitle = document.getElementById("caption_top");

  if(!photoTitle)
    return "";
         
  return GetTextContent(photoTitle);
}

function GetTextContent(node) {
  var text = "";
  if(node) {
    if(node.children) {
      text = GetTextContent(node.firstChild);
    } else {
      if(node.nodeValue) {
        text = node.nodeValue; // IE
      } else {
        text = node.textContent; // mozilla
      }
    }
  }
  text = Trim(text);
  return text;
}

function Trim(text) {
    var regexp = /^\s+|\s+$/g;
    text = text.replace(regexp, "");
    return text;
}


function IsHomePage() {
  var classStr = document.body.className;
  var re = /homepage /;

  if (!classStr)
    return false;

  return re.test(classStr);
}

MikeFried

I just updated my title replacing code (tested on IE 6 and fixed a bug in Netscape 7.2 and I _assume_ it still works on Firefox 1.5 and other browsers but I haven't tested the new code on Firefox as of yet). I have some hardcoded string values in there to do some of the hacky magic. Those of you who have been following along and want to play with it, feel free.

You can get just the relevant code from the attachment here.

The old cases of category/sub-category, album, and album with photo having a caption still work. Note that I remove the normal title customization from my cobranding page, and do all title customization via this script. I find that in the absence of javascript support on a browser, I like smugmug's "uncustomized" titles better than the same title on every page.

The new code adds a few special cases (some of which were made possible by the recent smugmug update). Here are examples of the new kinds of pages that my latest code handles:

Homepage
http://friedfamilyphoto.smugmug.com/

Guestbook gallery (yes my gallery needs more work...)
http://friedfamilyphoto.smugmug.com/gallery/1128948

All keywords page (I need to do more work to format this page better, too, now that I can...)
http://friedfamilyphoto.smugmug.com/keyword/

Single keyword
http://friedfamilyphoto.smugmug.com/keyword/mike+fried

Combined keywords
http://friedfamilyphoto.smugmug.com/keyword/liz%20fried-mike%20fried

Single image (with caption set)
http://friedfamilyphoto.smugmug.com/keyword/darwin%20finch/1/50623895/Small

Single image (without caption set I default to "untitled photo")
http://friedfamilyphoto.smugmug.com/keyword/darwin%20finch/1/50623755/Small

I'm considering making the keyword pages captalize all keyword words in the title because most of my keywords are proper nouns (people, species).

With these latest changes, it is a lot easier for me to navigate around my site and look at the breadcrumb trail in the back button dropdown. My site is nowhere near as complete an experience as other pros on this board, but I think it's ok for my first month.
-Mike

MikeFried

It looks like I might need to add code to handle the date range pages... Sheesh, there are a lot of different kinds of pages on smugmug.

SamirD

Awesome hack! Can the gallery title be put in place of the photo caption with this hack?

On my site, a link such as http://www.huntsvillecarscene.com/calendar.php?do=getinfo&e=3&day=2006-2-1&c=1 will have the event title in the bar. I plan to use the event title as the gallery title. So if the bar on smugmug can be changed as well--viola! It will make it even more seamless when people go from my site to my smugmug site.

MikeFried

SamirD wrote:

Awesome hack! Can the gallery title be put in place of the photo caption with this hack?

Anything is possible. You would just need to rewrite the javascript in such a way as to change the photo caption instead of changing the title. Since it's not purely title related, I would put it in a different block of code. Just about anything is editable on a page with the right bits of script. I think it would be nice to have access to be able to customize the underlying scripts that generate the HTML in the first place, but I realize that smugmug has an interest in keeping those under lock and key regardless of how trivial they would be to reverse engineer or add scripting there. But if you didn't know what you were doing, having that kind of access could be bad.

SamirD

devbobo wrote:

Rework the code if anyone is interested, removed all the indexof code in place of regular expressions..

var titleSettings = new Array();
/*
--------------------------------------------------
    customize page title settings
--------------------------------------------------
*/
titleSettings.separator   = ": "; // text to insert between parts of title
titleSettings.maxLength   = -1;   // limits length of title (-1 == no limit)
titleSettings.doPhotos    = true; // true == append photo captions
titleSettings.doAlbums    = true; // true == append album names
titleSettings.doGalleries = true; // true == append gallery names

function ContextualizeTitle() {
  var re1 = /([\s\S]*)( - powered by smugmug)/;
  var re2 = /([\s\S]*) (galleries|sub-categories)/;
  var newTitle = document.title;
  var newText = null;
  if(!IsHomePage()) 
  {
    // add gallery title
    if(titleSettings.doGalleries)
    {
      var galleryTitle = document.getElementById("galleryTitle");
      if(galleryTitle)
      {
        var galleryTitleText = GetTextContent(galleryTitle);
        if(galleryTitleText.length > 0)
        {
          galleryTitle = galleryTitle.replace(re2, "$1")

          newText = titleSettings.separator + galleryTitle;
          newTitle = newTitle.replace(re1, "$1" + newText + "$2");
        }
      }
    }

    // add album title
    if(titleSettings.doAlbums)
    {
      var albumTitle = document.getElementById("albumTitle");
      if(albumTitle)
      {
        var albumTitleText = GetTextContent(albumTitle);
        if(albumTitleText.length > 0)
        {
          newText = titleSettings.separator + albumTitleText;
          newTitle = newTitle.replace(re1, "$1" + newText + "$2");
        }
      }
    }

    // add photo title
    if(titleSettings.doPhotos)
    {
      var photoTitleText = GetPhotoCaption();
      if(photoTitleText.length > 0)
      {
        newText = titleSettings.separator + photoTitleText;
        newTitle = newTitle.replace(re1, "$1" + newText + "$2");
      }
    }

    if(titleSettings.maxLength > -1)
      newTitle = newTitle.substr(0, titleSettings.maxLength);

    document.title = newTitle;
  }
}

function GetPhotoCaption() {
  var photoTitle = document.getElementById("caption_bottom");

  if(!photoTitle)
    photoTitle = document.getElementById("caption_top");

  if(!photoTitle)
    return "";
         
  return GetTextContent(photoTitle);
}

function GetTextContent(node) {
  var text = "";
  if(node) {
    if(node.children) {
      text = GetTextContent(node.firstChild);
    } else {
      if(node.nodeValue) {
        text = node.nodeValue; // IE
      } else {
        text = node.textContent; // mozilla
      }
    }
  }
  text = Trim(text);
  return text;
}

function Trim(text) {
    var regexp = /^\s+|\s+$/g;
    text = text.replace(regexp, "");
    return text;
}


function IsHomePage() {
  var classStr = document.body.className;
  var re = /homepage /;

  if (!classStr)
    return false;

  return re.test(classStr);
}

I think I'll be able to use this code (thanks devbobo!) and simply change the "true" to "false" on gallery and photos. This way, it should just append the album name.

SamirD

SamirD wrote:

I think I'll be able to use this code (thanks devbobo!) and simply change the "true" to "false" on gallery and photos. This way, it should just append the album name.

Well, I tried it just as it was written and nothing. Suspected my optional title name in the customize screen was interfering, so I deleted that--nothing. (Strangely, the title was still there too.) I think because I have the breadcrumb and gallery name off, maybe it doesn't have any name to retrieve. Oh well, this wasn't a biggie, but it would've been a nice feature. It would help keep me from getting lost in these hundreds of galleries I have to parse through.

MikeFried

SamirD wrote:

Well, I tried it just as it was written and nothing.

What is your smugmug account name? If we can't see your smugmug site, then we can't help you.

devbobo

MikeFried wrote:

What is your smugmug account name? If we can't see your smugmug site, then we can't help you.

huntsvillecarscene.smugmug.com

<br>

SamirD

MikeFried wrote:

What is your smugmug account name? If we can't see your smugmug site, then we can't help you.

Oops, I keep forgetting about this. :uhoh

My site isn't setup where you can see anything from the home page since I'm using all private links that I'll link from my web site.

Here's a sample gallery, but this is without the code in place: http://newpics.huntsvillecarscene.com/gallery/1147319

We can play with this one a bit and try again.

MikeFried

Your problem is that the code is not running. You need to either add:

addEvent(window, "load", ContextualizeTitle);

to your javascript (outside any of the functions), or

<body onload="ContextualizeTitle();">

To your body.

Otherwise, no amount of customizing the script will cause any browser to do anything about it.

SamirD

MikeFried wrote:

Your problem is that the code is not running. You need to either add:

to your javascript (outside any of the functions), or

To your body.

Otherwise, no amount of customizing the script will cause any browser to do anything about it.

I have 3 functions being called in body. The other two work fine and the syntax is the same for the ContextualTitle function call.

SamirD

Scratch that, I just got it working. Seems like there was something in my head area that was changing the title.

SamirD

So how can the "powered by smugmug" be removed in the titles? I had it removed before and I don't want it in these custom titles either.

Wonderful script btw. Well written and commented.

SamirD

SamirD wrote:

So how can the "powered by smugmug" be removed in the titles? I had it removed before and I don't want it in these custom titles either.

Wonderful script btw. Well written and commented.

For anyone that's interested in doing this, you have to change the following lines.

Everywhere you see this:

newTitle = newTitle.replace(re1, "$1" + newText + "$2");

change it to this:

newTitle = newTitle.replace(re1, "$1" + newText);

To accomodate the change needed on the homepage, add this code

document.title = document.title.replace(re1, "$1");

right after this

var newText = null;

That's it!

You can see fully function versions of this code at newpics.huntsvillecarscene.com and newpics.huntsvillecarscene.com/gallery/1175012

I can't believe I figured it out without messing something up!

caseserve

Not working now
I implement this script some time ago, it was working great. Now it only works in FF not it IE

In FF I get the full name of the site - gallery - browser name
But in IE I only get the site - browser name

Any ideas, the site is caseserve.smugmug.com

Thanks,

SamirD

caseserve wrote:

I implement this script some time ago, it was working great. Now it only works in FF not it IE

In FF I get the full name of the site - gallery - browser name
But in IE I only get the site - browser name

Any ideas, the site is caseserve.smugmug.com

Thanks,

Mine is working fine in IE 6.0 under xp home. I'd double check the code.

KeithH

Will page titles show in search engines?

MikeFried wrote:

I just updated my title replacing code (tested on IE 6 and fixed a bug in Netscape 7.2 and I _assume_ it still works on Firefox 1.5 and other browsers but I haven't tested the new code on Firefox as of yet). I have some hardcoded string values in there to do some of the hacky magic. Those of you who have been following along and want to play with it, feel free.

You can get just the relevant code from the attachment here.

The old cases of category/sub-category, album, and album with photo having a caption still work. Note that I remove the normal title customization from my cobranding page, and do all title customization via this script. I find that in the absence of javascript support on a browser, I like smugmug's "uncustomized" titles better than the same title on every page.

The new code adds a few special cases (some of which were made possible by the recent smugmug update).....


....With these latest changes, it is a lot easier for me to navigate around my site and look at the breadcrumb trail in the back button dropdown. My site is nowhere near as complete an experience as other pros on this board, but I think it's ok for my first month.
-Mike

I like this version of the hack. Good job! It's nice to see my own title along with the category or the gallery name in the title bar of the browser. But I was wondering about one thing. Does anyone know if these page titles will show up in search engines? And if they don't, what does?

I tried the other version of this code, and liked it too, but the browser title bar would always read "SmugMug - My Website Name: Gallery Name" and it would not show the category. The version I'm using now does just what I want it to (no SmugMug name and it it will show the category) but I worry a little the titles won't appear in search engines.

Something I noticed is that when I was trying the two codes for this hack (and the various sub-versions) I noticed that StatCounter would show the new titles of the various pages with the Gary Glass code but would not with Mike Fried's. This got me thinking that if the latter one won't show titles in StatCounter, it won't allow them to be show them in search engines.

The code, as it is now, would be perfect if it did what it did AND the titles showed up in StatCounter and Google.

I hope I'm making myself clear. Thanks.
hazweb.smugmug.com

ExposeTheMoment

Doing Something Wrong
I cannot get it to work, code in place.

http://exposethemoment.smugmug.com/

Andy

ExposeTheMoment wrote:

I cannot get it to work, code in place.

http://exposethemoment.smugmug.com/

Gary? Please be more specific. This thread has a simple version and a complex version. I see the simple version on your site, just fine:

ExposeTheMoment

Andy,

if I goto http://photos.exposethemoment.com/Weddings

thats the url I see in IE url box, but in the blue area above that I see.

Expose The Moment - New Hampshire Wedding Photography.

Should the complex mod that I want to use that that title bar to Expose The Moment - Then what ever page or gallery your displaying?

Gary

Andy

ExposeTheMoment wrote:

Andy,

if I goto http://photos.exposethemoment.com/Weddings

thats the url I see in IE url box, but in the blue area above that I see.

Expose The Moment - New Hampshire Wedding Photography.

Should the complex mod that I want to use that that title bar to Expose The Moment - Then what ever page or gallery your displaying?

Gary

Either URL will produce the same result - that part doesn't matter. Have you implemented the more complex code? I do not see it on your site.

ExposeTheMoment

I copied and pasted, maybe it did not save

ExposeTheMoment

well Im going to bed for a few hours I guess I work on it tonight while Im at work, I have to rip apart my main computer today to replace a power supply and HD. I had another major comp issue. Im on my laptop now.

ExposeTheMoment

The code is there, its just not working.

ivar

ExposeTheMoment wrote:

The code is there, its just not working.

It seems to be working over here....

ExposeTheMoment

ivar wrote:

It seems to be working over here....

Ok problem, my site was doing that before I added the code.

I thought that this code was so the BLUE title Bar on Internet explorer co-displayed what page you were on.

I'm not talking about the url box.

When I go here I see in the url http://photos.exposethemoment.com/Portraits but in the blue title area I see Expose The Moment - Microsoft Internet Explorer