Description/caption for category?

[FormerLurker]

I've done a search and played around with several things but can't seem to figure this out. Is it possible to have a description, caption, or block of text appear at the top of a specific category? Or, alternately (and preferably), make a category page an HTML-only page? I know how to do this with galleries but can't seem to make it happen to a category. (My goal here is to have a separate domain name land on one of my category pages, so I want that to resemble a home page while still allowing navigation and breadcrumbs below it.) Thanks!

[Andy]

Here are the classes on a category page, does this help you?

[FormerLurker]

I've successfully set the title not to display, but have been unsuccessful in figuring out how to add text to the page. Unless I'm missing something, I can't find a container to put text into (or figure out how to modify the title container's contents -- not its formatting -- for that one page). Still tinkering, though, so maybe I'll figure it out.. but it's not intuitive (at least not to me). Thanks!

[Andy]

We don't have descriptions for Categories or Subcats. Sorry...
I'm not sure if what you want can be done. Wait for one of the stylers to chime in on this :D

[FormerLurker]

OK -- thanks for the help -- I just tried to insert HTML and a div into a category name, thinking I could embed the text and then turn the div on/off, but it didn't work... Oh well...

[Kahuna Ki'i]

OK -- thanks for the help -- I just tried to insert HTML and a div into a category name, thinking I could embed the text and then turn the div on/off, but it didn't work... Oh well...

Andy

BUMP - Im looking for the exact same thing as FormerLurker here - with an overwhelming number of individual galleries i had on my main page, i was forced to change to CATEGORIES to organize, but i would like to display more information than just EVENTS and the number of galleries below that category. Im waiting for "one of the stylers" to chime in as you suggested, but it appears this effort died on the vine.

Any way to accomplish some form of description through one of the tools like javascript or CSS or something?

Help...:scratch

[Andy]

Andy

Im waiting for "one of the stylers" to chime in as you suggested, but it appears this effort died on the vine.

I don't know what can be done but I can get a styler here in moments!

[bwg]

I don't know what can be done but I can get a styler here in moments!i have to remember not to answer the phone this late at night.


what you want can be done with javascript, but i'm up to my elbows in slideshow right now. hang tight....i've actually asked for this feature in the past so it's something i'd like to get to.

[Andy]

i have to remember not to answer the phone this late at night.


I did NOT call you, I used my super powers to summon the ninja gods...

And, what the heck? It took you FOUR minutes to get here??

:bigbs

[Kahuna Ki'i]

I did NOT call you, I used my super powers to summon the ninja gods...

And, what the heck? It took you FOUR minutes to get here??

:bigbs

Holy smoke.....i'm actually feeling guilty thingking Andy ripped a wizard out of bed....or worse:D

No major hurry, but I'm looking forward to seeing what can be done and I'm glad it was on someone else's "im interested in this too" list.

Thanks - standing patiently by....:thumb

[devbobo]

[UPDATED] Add code to work on homepage as well

Try this code...

javascript block...


function addCategoryDescription() {
var categoryDescription = {
"category1" : "This is a test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.addListener(window, "load", addCategoryDescription);


Category names and descriptions should be replaced with the text in yellow.

The code adds elements with a class = categoryDescription. So CSS customisation can be done against the elements.

Hope this helps,

David

[Andy]

Is there something missing, David - I tried and and no worky yet..

andydemo.smugmug.com

[bwg]

Is there something missing, David - I tried and and no worky yet..

andydemo.smugmug.com

yeah, it's no worky for me either.

lemme see what's up.

[bwg]

yeah, it's no worky for me either.

lemme see what's up.
nevermind..i'm dumb.

andy, remember javascript is case sensitive. you have to have your category names exactly right.

in my case, i had 'madeline' in my javascript, when my category was actually called 'Madeline'.

http://bigwebguy.smugmug.com/madeline

[Kahuna Ki'i]

nevermind..i'm dumb.

andy, remember javascript is case sensitive. you have to have your category names exactly right.

in my case, i had 'madeline' in my javascript, when my category was actually called 'Madeline'.

http://bigwebguy.smugmug.com/madeline

bigwebguy,

I have'nt implemented yet, but i noticed that the demo phrases are working on Andy's demo smugmug site. However when i look at them, i noticed that Andy apparently applied one description against the category BUSINESS where the demo text does appear on the categories own page, BUT NOT on the home page:uhoh

Im aiming for getting the descriptions on the HOME PAGE where they are needed - on the lower level page, the individual galleries description actually accomplishes the task.

Im thinking one would need to use the code you came up with in conjunction with some way of restructoring the home page:scratch :scratch Or am i missing something:confused

Ill put this on my site tonight to see how it works first hand...

[bwg]

bigwebguy,

I have'nt implemented yet, but i noticed that the demo phrases are working on Andy's demo smugmug site. However when i look at them, i noticed that Andy apparently applied one description against the category BUSINESS where the demo text does appear on the categories own page, BUT NOT on the home page:uhoh

Im aiming for getting the descriptions on the HOME PAGE where they are needed - on the lower level page, the individual galleries description actually accomplishes the task.

Im thinking one would need to use the code you came up with in conjunction with some way of restructoring the home page:scratch :scratch Or am i missing something:confused

Ill put this on my site tonight to see how it works first hand...

ok, i guess dev and i misunderstood your request. we'll see what we can do to get the captions on the homepage.

[Andy]

ok, i guess dev and i misunderstood your request. we'll see what we can do to get the captions on the homepage.

Yeah. I like what's been done thus far, but would like the Descr to appear in the categoriesBox also.

:deal

[Andy]

http://williams.smugmug.com/photos/53329076-L.gifDevbobo has fixy'd the code, so now it puts the Description in the categoriesBox. :clap :clap running on http://andydemo.smugmug.com and on http://dgrin.smugmug.com

[Kahuna Ki'i]

http://williams.smugmug.com/photos/53329076-L.gifDevbobo has fixy'd the code, so now it puts the Description in the categoriesBox. :clap :clap running on http://andydemo.smugmug.com and on http://dgrin.smugmug.com

STUNNING :bow :bow :bow

I go away for a few hours and you guys manage to solve all the problems. WOW. I had begun to convince myself that the ability to achieve this on the home page was unlikely - i apologize for ever having any doubt.

Im looking forward to implementing on my pages tonight. Thanks guys, I appreciate your help. this is GREAT :thumb

[bwg]

http://williams.smugmug.com/photos/53329076-L.gifDevbobo has fixy'd the code, so now it puts the Description in the categoriesBox. :clap :clap running on http://andydemo.smugmug.com and on http://dgrin.smugmug.com
dev is the man.

however, i modified the code to produce id and class names more consistent with the albumDescription in galleries and the homepage.

for the description inside galleries, the description has an id=albumDescription, so the corresponding category description should be id=categoryDescription, not class=categoryDescription.

for the description on the homepage,the format is id=albumDescription_XXXXX class=description where the X's are the album number. I modified the code to be id=categoryDescription_XXXXX class=description where the X's are the category name.

hope you dont mind Dev.

code:function addCategoryDescription()
{
var categoryDescription = {
"Madeline" : "Madeline Grace Shepherd",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((isClass("category")) && (!isClass("subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.id = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

if (isClass("homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = divTag.getElementsByTagName("p");

for (i=0; i<divTags.length; i++)
{
if (divTags[i].className == "albumTitle")
{
re.exec(divTags[i].innerHTML);
pTag = document.createElement("p");
pTag.id = "categoryDescription_" + RegExp.$1;
pTag.className = "description";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}

[Kahuna Ki'i]

dev is the man.

however, i modified the code to produce id and class names more consistent with the albumDescription in galleries and the homepage.

for the description inside galleries, the description has an id=albumDescription, so the corresponding category description should be id=categoryDescription, not class=categoryDescription.

for the description on the homepage,the format is id=albumDescription_XXXXX class=description where the X's are the album number. I modified the code to be id=categoryDescription_XXXXX class=description where the X's are the category name.

hope you dont mind Dev.

code:function addCategoryDescription()
{
var categoryDescription = {
"Madeline" : "Madeline Grace Shepherd",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((isClass("category")) && (!isClass("subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.id = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

if (isClass("homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = divTag.getElementsByTagName("p");

for (i=0; i<divTags.length; i++)
{
if (divTags[i].className == "albumTitle")
{
re.exec(divTags[i].innerHTML);
pTag = document.createElement("p");
pTag.id = "categoryDescription_" + RegExp.$1;
pTag.className = "description";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}

BigWebGuy,

I understand your rationale in your code mods but when i tried to use, it would not work.

I switched to devbobo's code above and it works. Im afraid im not able to catch any errors in my implementation of your javascript or the code itself:dunno Did i overlook anything?

Thanks

[Kahuna Ki'i]

BigWebGuy,

I understand your rationale in your code mods but when i tried to use, it would not work.

I switched to devbobo's code above and it works. Im afraid im not able to catch any errors in my implementation of your javascript or the code itself:dunno Did i overlook anything?

Thanks

Here's another odd glitch. Im currently using Devbobo's code and if you check my home page, youll see that some catagories i currently have set to CATAGORY : "" so the display is blank.

For the category PORTFOLIOS i put in a custom description, however for the (custom) category PHOTO PROJECTS i have the description set to none (: "",) and its picking up the description from PORTFOLIOS on the home page and indicates UNDEFINED for the lower page.

I just tried assigning a description to the custom category PHOTO PROJECTS and its not taking hold. Hmmmm.....:scratch

im still checking stuff to see what the cause could be?

DISREGARD - I renamed my category from PHOTO PROJECTS to PROJECTS and changed the code to reflect that as well and the description took hold. Dont know why it was hosed in the first place. The other custom category i have is working fine. Oh well...alls well that ends well.

[bwg]

Here's another odd glitch. Im currently using Devbobo's code and if you check my home page, youll see that some catagories i currently have set to CATAGORY : "" so the display is blank.

For the category PORTFOLIOS i put in a custom description, however for the (custom) category PHOTO PROJECTS i have the description set to none (: "",) and its picking up the description from PORTFOLIOS on the home page and indicates UNDEFINED for the lower page.

I just tried assigning a description to the custom category PHOTO PROJECTS and its not taking hold. Hmmmm.....:scratch

im still checking stuff to see what the cause could be?

DISREGARD - I renamed my category from PHOTO PROJECTS to PROJECTS and changed the code to reflect that as well and the description took hold. Dont know why it was hosed in the first place. The other custom category i have is working fine. Oh well...alls well that ends well.
other than the fact taht i left my Madeline code in there for the description (doh!), that code is only 3 lines different than devbobos. it works fine for me. not sure why it wouldnt work for you.

2, if you have a 2 word category title, you have to use an underscore instead of a space, so your code would look like:

var categoryDescription = {
"photo_projects" : "photo projects and other stuff",
"category2" : "This is another test.",
"category3" : "Final test"
};

[portellimagery]

Okay I tried this and it works fine in the category that I want a description to appear. However, the ones I don't define, it now shows "undefined" when I go into category. Try going under my calender category. I got rid of it from my portfolio by defining it to be a space.

Also, even though I defined the category description, it shows undefined on the home pagem whhen I don't want it to show anything. Any ideas?

Thanks.

Micheal

[bwg]

Okay I tried this and it works fine in the category that I want a description to appear. However, the ones I don't define, it now shows "undefined" when I go into category. Try going under my calender category. I got rid of it from my portfolio by defining it to be a space.

Also, even though I defined the category description, it shows undefined on the home pagem whhen I don't want it to show anything. Any ideas?

Thanks.

Micheal

code has been fixed to not show 'undefined' for categories that dont have a description assigned.

function addCategoryDescription()
{
var categoryDescription = {
"category_name" : "multiple word categories are separated by an underscore",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((isClass("category")) && (!isClass("subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.id = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

if (isClass("homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = divTag.getElementsByTagName("p");

for (i=0; i<divTags.length; i++)
{
if (divTags[i].className == "albumTitle")
{
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1]) {
pTag = document.createElement("p");
pTag.id = "categoryDescription_" + RegExp.$1;
pTag.className = "description";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
}

[Barb]

[UPDATED] Add code to work on homepage as well

Try this code...

javascript block...


function addCategoryDescription()
{
var categoryDescription = {
"category1" : "This is a test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((YAHOO.util.Dom.hasClass(document.body, "category")) && (!YAHOO.util.Dom.hasClass(document.body, "subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YAHOO.util.Dom.hasClass(document.body, "homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = YAHOO.util.Dom.getElementsByClassName("albumTitle", "p", divTags);

for (i=0; i<divTags.length; i++)
{
re.exec(divTags[i].innerHTML);
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}

To execute...

body tag block...

<body onload="addCategoryDescription()">

or javascript block...

addEvent(window, "load", addCategoryDescription);

Category names and descriptions should be replaced with the text in yellow.

The code adds elements with a class = categoryDescription. So CSS customisation can be done against the elements.

Hope this helps,

David

David,

Does this only work with one line of text? I'm trying to implement this on someone's page, but she has a paragraph that she wants for the description. Once I replace "This is a test" with that paragraph, nothing shows up. Maybe it's limited to one line of text? Or, perhaps, I'm doing something wrong!

[bazzama]

I got the code to work (with assistance from Ivar (thx)) for my categories on their specific pages, and thought the same descriptions would show up on the home page too. However, this is not working.

Is there a different code to add for homepage descriptions, or is the code that is posted here designed to cover both?

Thanks,
Barry.
http://www.barryselbyphotography.com

[guttman]

[UPDATED] Add code to work on homepage as well

Try this code...

javascript block...


function addCategoryDescription() {
var categoryDescription = {
"category1" : "This is a test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.addListener(window, "load", addCategoryDescription);


Category names and descriptions should be replaced with the text in yellow.

The code adds elements with a class = categoryDescription. So CSS customisation can be done against the elements.

Hope this helps,

David

Hey David!
Tried it but no dice - it doesn't work for some reasons...
If you can, check it out at guttman.smugmug.com
Chen

[russw]

Coming to this thread a bit late but just wanted to say thanks, this came in handy!

Because I have a category with a space ("Road Racing") I ended up changing the regular expression. It didn't include a space so any category without a space wouldn't work (should explain at least one problem a poster was having).

So we go from this:

re = /\>([\w\-]+)<\/a>/i;

To:

re = /\>([\w\- ]+)<\/a>/i;

I had to make a few other changes to handle the breadcrumb description since that class name has an underscore.

Beside that, works great. Here is the altered code. It works for Safari and Firefox on the Mac.

function addCategoryDescription(){
var categoryDescription = {
"Test One": "This has a space.",
"MyPhotos": "This does not."
};

if ((YAHOO.util.Dom.hasClass(document.body, "category")) && (!YAHOO.util.Dom.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
if (re.exec(document.body.className)) {
foundCat = RegExp.$1.replace('_', ' ');

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
if (categoryDescription[foundCat] != undefined) {
divTag.appendChild(document.createTextNode(categor yDescription[foundCat]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
}
}
if (YAHOO.util.Dom.hasClass(document.body, "homepage")) {
re = /\>([\w\- ]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag) {
divTags = YAHOO.util.Dom.getElementsByClassName("albumTitle", "p", divTag);

for (i = 0; i < divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}


----
Russ (photos.abbiorca.com)

[Liaquila]

Hi everybody

I'm new here and sorry about my English.
I got to insert description for my categories, but something happened and my last category doesn't show more the number of galleries and pictures. Could anybody help me? My page is liaquila.smugmug.com .

Thank you

[Allen]

Hi everybody

I'm new here and sorry about my English.
I got to insert description for my categories, but something happened and my last category doesn't show more the number of galleries and pictures. Could anybody help me? My page is liaquila.smugmug.com .

Thank you
Welcome to Dgrin. :wave

I assume you are referring to the Categorias box on your homepage. I see
this, 8 galleries with 172 photos, for the Diversos category and it's the last
on the page. Also all the other categories have it shown also. Is it fixed now?

[mbellot]

David,

Does this only work with one line of text? I'm trying to implement this on someone's page, but she has a paragraph that she wants for the description. Once I replace "This is a test" with that paragraph, nothing shows up. Maybe it's limited to one line of text? Or, perhaps, I'm doing something wrong!

Barb,

Did you ever get an answer to this?

I'm trying to implemement this hack to subcategories (with some code mods), and it looks like I've got everything basically working for a single line of text.

I'd really like to use html in the description, but failing that it are there any formatting options available (C-style or ???), or are we limited to straight up text?

Sorry for digging this one up out of the depths of time...

Thanks,

Mark

[Tomkirk23]

YE.addListener(window, "load", addCategoryDescription);



I am someone who has lots of galleries within some categories. The YE.addListener command as shown waits for all photos to be displayed before displaying the Category Description.

I have found that the YE.addListener command can be replaced with:

YE.onDOMReady(addCategoryDescription);

This approach results in the Category Description being shown more immediately while the photos continue to populate the screen.

FYI...

Thanks,

Tom Kirkpatrick
yoursbydesign.smugmug.com

[Tomkirk23]

Barb,

Did you ever get an answer to this?

I'm trying to implemement this hack to subcategories (with some code mods), and it looks like I've got everything basically working for a single line of text.

I'd really like to use html in the description, but failing that it are there any formatting options available (C-style or ???), or are we limited to straight up text?

Sorry for digging this one up out of the depths of time...

Thanks,

Mark


BUMP.... I am also interested in this issue. Would certainly like to have Category Description prioritized in the new feature list (so that it acts like Gallery Description).

But would love an update to the existing hack that would accept html codes, as opposed to simple text!!!

Thank you,

Tom Kirkpatrick
yoursbydesign.smugmug.com

[Crystal Clear Photography]

BUMP.... I am also interested in this issue. Would certainly like to have Category Description prioritized in the new feature list (so that it acts like Gallery Description).

But would love an update to the existing hack that would accept html codes, as opposed to simple text!!!

Thank you,

Tom Kirkpatrick
yoursbydesign.smugmug.com

I, too, would like to know if it is possible to add a description to a category that would alllow HTML coding...anyone know if and how it can happen?

[Crystal Clear Photography]

I, too, would like to know if it is possible to add a description to a category that would alllow HTML coding...anyone know if and how it can happen?

Still no answer....:scratch ??

[vjsphotos]

In my Java Header (or whatever it is called) here is what it has

function addCategoryDescription() {
var categoryDescription = {
"Wedding_Art" : "Your Wedding is All about YOU! Photography is the art of capturing your emotions while you enjoy the experience! Your Wedding Day is a one time event...there are no re-dos. My use of a combination of traditional and candid photography gives you treasured memories you and your children will cherish forever. I personally photograph your wedding in a professional manner representing you well as I mingle with your friends and family. Ask about Custom Albums and Save The Date Magnets. I look forward to speaking with you soon.",

This is what it says on my Wedding Art page...http://studiovphotography.smugmug.com/Wedding%20Art

Your Wedding is All about YOU! Photography is the art of capturing your emotions while you enjoy the experience! Your Wedding Day is a one time event...there are no re-dos. My use of a combination of traditional and candid photography gives you treasured memories you and your children will cherish forever. I personally photograph your wedding in a professional manner representing you well as I mingle with your friends and family. Ask about Custom Albums and Save The Date Magnets. I look forward to speaking with you soon.

This is what I want...how do I get it? What do I add - where?

Your Wedding is All about YOU! Photography is the art of capturing your emotions while you enjoy the experience!

Your Wedding Day is a one time event...there are no re-dos.

My use of a combination of traditional and candid photography gives you treasured memories you and your children will cherish forever.

I personally photograph your wedding in a professional manner representing you well as I mingle with your friends and family.

Ask about Custom Albums and Save The Date Magnets.

I look forward to speaking with you soon.



HELP! Been asking since last last night and nobody can seem to help me - they sent me here.

[Andy]

HELP! Been asking since last last night and nobody can seem to help me - they sent me here.
Glad you are in the right place now! :thumb

[devbobo]

"Wedding_Art" : "Your Wedding is All about YOU! Photography is the art of capturing your emotions while you enjoy the experience! Your Wedding Day is a one time event...there are no re-dos. My use of a combination of traditional and candid photography gives you treasured memories you and your children will cherish forever. I personally photograph your wedding in a professional manner representing you well as I mingle with your friends and family. Ask about Custom Albums and Save The Date Magnets. I look forward to speaking with you soon.",

The category description doesn't have to be text, it can be html.

eg..

"Wedding_Art" : "<b>Mary</b> had a <i>little lamb</i>, her fleece was white as snow"

[kungaloosh]

I haven't been able to get it to recognize HTML in my category descriptions. When i enter it in tags (like <br>) they just get displayed as text, not interpreted.

I would love to find a way to get it to display the stuff as html rather than just plain text.

Here's the Java code i use:

/* Following code adds a description to categories */

function addCategoryDescription(){
var categoryDescription = {
"The Laboratory": "...Our Experiments in Photography",
"MyPhotos": "This does not."
};

if ((YAHOO.util.Dom.hasClass(document.body, "category")) && (!YAHOO.util.Dom.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
if (re.exec(document.body.className)) {
foundCat = RegExp.$1.replace('_', ' ');

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
if (categoryDescription[foundCat] != undefined) {
divTag.appendChild(document.createTextNode(categor yDescription[foundCat]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
}
}
if (YAHOO.util.Dom.hasClass(document.body, "homepage")) {
re = /\>([\w\- ]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag) {
divTags = YAHOO.util.Dom.getElementsByClassName("albumTitle", "p", divTag);

for (i = 0; i < divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
addEvent(window, "load", addCategoryDescription);

[devbobo]

this modified should work fine for html...

function addCategoryDescription() {
var categoryDescription = {
"category1" : "<b>This</b><br/>is<br/>a<br/>test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.innerHTML = categoryDescription[RegExp.$1];
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.innerHTML = categoryDescription[RegExp.$1];
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.onContentReady('bodyWrapper', addCategoryDescription);

[atom k]

I think my problem has to do with multiple-word-named categories. Just for giggles I tried without underscores but it looks the same either way.

Here's what I see:

http://adamkobrin.smugmug.com/

Here's my code:

function addCategoryDescription() {
var categoryDescription = {
"The_A-List" : "This is a test.",
"Schools" : "This is another test.",
"Children_of_Liberia" : "Final test1",
"On_the_Road" : "Final test2",
"Other" : "Final test3"
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.addListener(window, "load", addCategoryDescription);

[Vic81]

Hello,

I need some help added a description to a category. I tried the java script posted by devbobo no luck. After reading the complete thread I see that I need to have under scores between the words of the category, and it is still not working. What am I missing? Here is a link to my site: www.varphotos.smugmug.com (http://www.varphotos.smugmug.com/) I am trying to add a description to the 'Running and Walking Events' category.

Thanks for the help,

Victor

[allanl]

The category description doesn't have to be text, it can be html.

eg..

"Wedding_Art" : "<b>Mary</b> had a <i>little lamb</i>, her fleece was white as snow"

I tried this but it didn't work. I still see all the angled brackets in the page. I have my description working but can't use html in it. I wish there was a simpler way of adding description to Category or Sub-Category. It is a no brainer not to have this feature :rolleyes

[OsirisPhoto]

I've added the code, and it works.. but I don't want the descriptive text on the homepage, just the category page. I believe this is what the original code acheived.. any chance I could see that version?

Edit: solved it. Just deleted the section with the "if..'homepage'" bit.

[TCS]

I've added the code, and it works.. but I don't want the descriptive text on the homepage, just the category page. I believe this is what the original code acheived.. any chance I could see that version?

Edit: solved it. Just deleted the section with the "if..'homepage'" bit.

Hi,

Which ones of all those codes and where exactly did you put it?

Does it give a box in which you can enter more than a line? It seems Barb's question was never answerd.

Christine

[OsirisPhoto]

Hi,

Which ones of all those codes and where exactly did you put it?

Does it give a box in which you can enter more than a line? It seems Barb's question was never answerd.

Christine
This is the code I have used...

function addCategoryDescription() {
var categoryDescription = {
"Weddings" : "<img src='http://osirisphoto.smugmug.com/photos/315342668_itV9C-O.jpg' alt='Bride&Groom' align='left'></img><h3>Your wedding day is special, and your photographs of the day should be too!</h3><br/>Many companies charge a premium price for wedding events but the cost of photography needn't break the bank. We have a range of packages to suit any budget, from £300 - all provided by an award winning photographer and member of the Society of Wedding and Portrait Professionals (SWPP). Your specific requirements can be agreed following a free no-obligation consultation.<br/><br/>We can provide a wedding photographer in Glasgow, Edinburgh and the rest of Central and South Scotland. Contact us on 01236 780124 or by email for availability.<br/><br/>To compare our prices, use <a href='http://www.findaweddingphotographer.co.uk'>UK Wedding Photographers,</a> - wedding photography price finder and <a href='http://www.findaweddingphotographer.co.uk'>wedding photography</a> directory.<br/><br/><b><i>Existing clients: you can view your images by clicking on the appropriate password protected gallery below.</i></b>",
"Pets" : "<img src='http://osirisphoto.smugmug.com/photos/315344579_x8gc5-O.jpg' alt='Dog Portrait' align='left'></img><h3>Capture your furry friend at their best!</h3><br/>We offer a home photography service to proud pet owners for just £30. Prints and photo gifts of various sizes can then be ordered through your pet's very own gallery or direct from us.<br/><br/>All we need is a modest amount of floor space and, for canines, a pet that will stay on command for a brief period. Weather depending, we can also carry out the photoshoot in a suitable outdoor location if space or obedience is an issue - or simply if you prefer to see them in their natural environment.<br/><br/>Almost every dog can be trained to some level and we are happy to recommend the <a href='http://www.cumbernaulddogtraining.co.uk/'>Cumbernauld Dog Training School.</a><br/><br/>We currently offer a package deal for just £75 which includes photo session and a 12x16 inch mounted print in a stylish frame. (Other size / frame options are available.)<br/><br/>Please note that this is a limited time special offer! Contact us on 01236 780124 to book your pet's photo session.",
"category3" : "..."
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.innerHTML = categoryDescription[RegExp.$1];
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
}
YE.onContentReady('bodyWrapper', addCategoryDescription);

Trouble is, Google doesn't see it as valid text. One hoop too many for me.. a friend of mine is redesigning my site, so bye bye SM :cry

[Tomkirk23]

Hi -

Another approach that (while a little messy) might work, particularly if you have a limited set of categories...

Put description text for a given category in the header box within a DIV. Use CSS to make it "display:none" everywhere. Use CSS to make it "display:block" only for your category page.

Use CSS position:relative for the given DIV to move the description to the right place.

Thanks,

Tom K.

[caroline]

I want to have category descriptions and have found the following code it still current ? and
Where does this code go please ?

Caroline
This is the code I have used...

function addCategoryDescription() {
var categoryDescription = {
"Weddings" : "<img src='http://osirisphoto.smugmug.com/photos/315342668_itV9C-O.jpg' alt='Bride&Groom' align='left'></img><h3>Your wedding day is special, and your photographs of the day should be too!</h3><br/>Many companies charge a premium price for wedding events but the cost of photography needn't break the bank. We have a range of packages to suit any budget, from £300 - all provided by an award winning photographer and member of the Society of Wedding and Portrait Professionals (SWPP). Your specific requirements can be agreed following a free no-obligation consultation.<br/><br/>We can provide a wedding photographer in Glasgow, Edinburgh and the rest of Central and South Scotland. Contact us on 01236 780124 or by email for availability.<br/><br/>To compare our prices, use <a href='http://www.findaweddingphotographer.co.uk'>UK Wedding Photographers,</a> - wedding photography price finder and <a href='http://www.findaweddingphotographer.co.uk'>wedding photography</a> directory.<br/><br/><b><i>Existing clients: you can view your images by clicking on the appropriate password protected gallery below.</i></b>",
"Pets" : "<img src='http://osirisphoto.smugmug.com/photos/315344579_x8gc5-O.jpg' alt='Dog Portrait' align='left'></img><h3>Capture your furry friend at their best!</h3><br/>We offer a home photography service to proud pet owners for just £30. Prints and photo gifts of various sizes can then be ordered through your pet's very own gallery or direct from us.<br/><br/>All we need is a modest amount of floor space and, for canines, a pet that will stay on command for a brief period. Weather depending, we can also carry out the photoshoot in a suitable outdoor location if space or obedience is an issue - or simply if you prefer to see them in their natural environment.<br/><br/>Almost every dog can be trained to some level and we are happy to recommend the <a href='http://www.cumbernaulddogtraining.co.uk/'>Cumbernauld Dog Training School.</a><br/><br/>We currently offer a package deal for just £75 which includes photo session and a 12x16 inch mounted print in a stylish frame. (Other size / frame options are available.)<br/><br/>Please note that this is a limited time special offer! Contact us on 01236 780124 to book your pet's photo session.",
"category3" : "..."
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.innerHTML = categoryDescription[RegExp.$1];
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
}
YE.onContentReady('bodyWrapper', addCategoryDescription);
Trouble is, Google doesn't see it as valid text. One hoop too many for me.. a friend of mine is redesigning my site, so bye bye SM :cry

[Allen]

I want to have category descriptions and have found the following code it still current ? and
Where does this code go please ?

Caroline
Hi Caroline :wave
Try the footer javascript first and if it doesn't work try the header javascript.

[caroline]

Hi Allen :D
I've tried it in both, the code is currently in the JS Footer, I doesn't seem to work in either. This is what I used:


function addCategoryDescription()
{
var categoryDescription = {
"Mendip_Hills_Area" : "This is a test.",
"Places" : "This is another test.",
"Living_World" : "Final test"
};

if ((YAHOO.util.Dom.hasClass(document.body, "category")) && (!YAHOO.util.Dom.hasClass(document.body, "subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YAHOO.util.Dom.hasClass(document.body, "homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = YAHOO.util.Dom.getElementsByClassName("albumTitle", "p", divTags);

for (i=0; i<divTags.length; i++)
{
re.exec(divTags[i].innerHTML);
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}

What am I doing wrong :-))

Caroline

[Allen]

Hi Allen :D
I've tried it in both, the code is currently in the JS Footer, I doesn't seem to work in either. This is what I used:

function addCategoryDescription()
{
var categoryDescription = {
"Mendip_Hills_Area" : "This is a test.",
"Places" : "This is another test.",
"Living_World" : "Final test"
};

...

What am I doing wrong :-))

Caroline
Might be the multiple word category names messing it up.

[caroline]

Might be the multiple word category names messing it up.

OK I've tried it with only single word category names, in the header and footer but still no joy.
Any further thoughts Allen or is there anyone using this code who can chip in please ?

Caroline

[caroline]

I've got it working now Allen :clap:clap
I had missed off the last line of code when copying and pasting :-(

However I would now like the color of the text to match the rest of my site - help please.......

Caroline

[Allen]

I've got it working now Allen :clap:clap
I had missed off the last line of code when copying and pasting :-(

However I would now like the color of the text to match the rest of my site - help please.......

Caroline
It's now has a class name of categoryDescription so add it to this.

.categoryDescription,
.title,
#galleryTitle .title,
.pageNav {
color: #7f0A32 !important; /* dark red */
}

[caroline]

[quote=Allen]It's now has a class name of categoryDescription

Great thanks Allen :ivar:clap
You've made my day & its not rained today either

[npudar]

Devbobo and Allen,

This is great stuff! I've got the Category Description working at http://photos.pudar.com/Sports. When you click on "OLS Volleyball", it is a Sub-Category, and the description that I am expecting there does not show up.

Does the description javascript code work for Sub-Categories? What should I be doing?

Thanks.
Nick

[caroline]

http://img.skitch.com/20080824-d3rsfrxdjw4fduyirt37q5s5c7.preview.jpg (http://skitch.com/carolineshipsey/wry7/caroline-shipsey-photography-landscape-life-on-the-mendip-hills)
Click for full size (http://skitch.com/carolineshipsey/wry7/caroline-shipsey-photography-landscape-life-on-the-mendip-hills) - Uploaded with plasq (http://plasq.com)'s Skitch (http://skitch.com)

I would like the color of the category description text ref no.1 above to be the same as my gallery description text. However when I change the color in CSS as in Allen's earlier post, the text at no.2 also changes - can I have Nos. 1 & 2 different colors, is this possible ?

Caroline

[caroline]

Bump :bow

[Allen]

http://img.skitch.com/20080824-d3rsfrxdjw4fduyirt37q5s5c7.preview.jpg (http://skitch.com/carolineshipsey/wry7/caroline-shipsey-photography-landscape-life-on-the-mendip-hills)
Click for full size (http://skitch.com/carolineshipsey/wry7/caroline-shipsey-photography-landscape-life-on-the-mendip-hills) - Uploaded with plasq (http://plasq.com)'s Skitch (http://skitch.com)

I would like the color of the category description text ref no.1 above to be the same as my gallery description text. However when I change the color in CSS as in Allen's earlier post, the text at no.2 also changes - can I have Nos. 1 & 2 different colors, is this possible ?

Caroline

Try this.

.category_Mendip_Hills_Area #subCatGalleryTitle {color: blue !important;}

[caroline]

Blimey Allen, I just woke up and you have just posted this :rofl
Well that works but Its the text at no.1, the actual category description, I want to change the color of - for example purposes blue is fine. I promise I've tried to figure it out.

Bleary eyed Caroline
Try this.

.category_Mendip_Hills_Area #subCatGalleryTitle {color: blue !important;}

[denisegoldberg]

Blimey Allen, I just woke up and you have just posted this :rofl
Well that works but Its the text at no.1, the actual category description, I want to change the color of - for example purposes blue is fine. I promise I've tried to figure it out.
Caroline -
See if this is what you're looking for:
.category_Mendip_Hills_Area .categoryDescription {
color: #457371 !important; /* green agate */
}
--- Denise

[caroline]

Welcome back from your trip Denise,
Thank you that worked and I have now amended it so it applies to all category descriptions.

Caroline

[CynthiaM]

I found my way to this thread by doing a search for category and subcategory descriptions. I would like to be able to add them in 2 places on my site. I've tried using some of the code in these posts, but can't get them to work. Take a look at these two screen shots, which I created in Photoshop to demonstrate what I want to do. The word "here" in this first image should be a hyperlink pointing to this gallery: http://cynthiam.smugmug.com/gallery/...60302952_qthaT (http://cynthiam.smugmug.com/gallery/5812195_FBSN8/1/360302952_qthaT)
http://www.cynthiamerzerphotography.com/photos/364192031_ZZD3h-X3.jpg


and in this image, http://cynthiam.smugmug.com/photos/364355069_nqRev-X3-2.jpg I would like for the word Lifepixel to be a hyperlink to http://lifepixel.com/

I want to be able to have it similarly formatted to the screen shots; text in color #ffffff, aligned left in a font that is a little bigger and bolder than what is in the breadcrumb.

Can anybody tell me how to do this?
http://www.cynthiamerzerphotography.com/Travel/589335

[CynthiaM]

I'm making some progress. Made the same mistake as Caroline and originally missed the last line of code. Made the correction and now I have category description under Infrared. But I can't get anything to show up under Alaska and I suspect it's because it has a different div id and this code is written specifically for a category description. Tried adding the word sub before every instance of category, but that didn't work.

Can somebody help me with code to create a subcategory description? Is there any way to create a hyperlink within these descriptions?

[Tomkirk23]

I am not sure if this category description javascript supports html coding, but the proper syntax would be:

This is the sentence about<a href="http://lifepixel.com/" target="_blank">Lifepixel</a>

The target="_blank" coding forces the browser to open a separate tab/window to display the Lifepixel site.

Thanks,

Tom K.

[CynthiaM]

I am not sure if this category description javascript supports html coding, but the proper syntax would be:

This is the sentence about<a href="http://lifepixel.com/" target="_blank">Lifepixel</a>

The target="_blank" coding forces the browser to open a separate tab/window to display the Lifepixel site.


Thanks Tom,
I tried this, but lost the entire caption. Here is the portion of the script showing how I pasted it in, wanna check to see if I made any errors?

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : "Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>"

};

Thanks,

[CynthiaM]

P.S.

What about the issue of script for the other page? If you go to my site, click on Gallereis in the navbar, then to Travel, then scroll down to Alaska. This should take you to a page with some password protected galleries. How can I enter a caption for this page, right underneath the breadcrumb, like I've managed to do for Infrared:
http://www.cynthiamerzerphotography.com/Travel/589335

Thanks,

[Tomkirk23]

Thanks Tom,
I tried this, but lost the entire caption. Here is the portion of the script showing how I pasted it in, wanna check to see if I made any errors?

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : "Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>"

};

Thanks,

Cynthia:

I would try this instead:

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : 'Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>'

};


This uses a single quote to surround the whole sentence. The double quotes were conflicting with each other.

....although, I am not certain that this function supports html coding...Let's see what happens.

[CynthiaM]

Cynthia:

I would try this instead:

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : 'Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>'

};


This uses a single quote to surround the whole sentence. The double quotes were conflicting with each other.

....although, I am not certain that this function supports html coding...Let's see what happens.
:clapIt worked!!

Now, how can I get a description on that Alaska page. I would like it to say: "Click here (http://cynthiam.smugmug.com/gallery/5812195_FBSN8#360302952_qthaT) for images of Alaska in infrared." I want the word "here" to be a hyperlink to my Alaska in infrared gallery.

[Tomkirk23]

P.S.

What about the issue of script for the other page? If you go to my site, click on Gallereis in the navbar, then to Travel, then scroll down to Alaska. This should take you to a page with some password protected galleries. How can I enter a caption for this page, right underneath the breadcrumb, like I've managed to do for Infrared:
http://www.cynthiamerzerphotography.com/Travel/589335

Thanks,

Cynthia: I am not an expert on this function, but I would attempt the following:

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : 'Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>',
"Alaska" : 'This is the Alaska description'
};

Notice that I put a comma after the Infrared entry. The last entry before the } should not end with a comma.

Thanks,

Tom K.

[Tomkirk23]

You can use a similar syntax with the <a href="the-link" target="_blank">what-is-displayed</a>

Thanks,

Tom K

[CynthiaM]

Cynthia: I am not an expert on this function, but I would attempt the following:

function addCategoryDescription() {
var categoryDescription = {
"Infrared" : 'Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>',
"Alaska" : 'This is the Alaska description'
};

Notice that I put a comma after the Infrared entry. The last entry before the } should not end with a comma.

Thanks,

Tom K.
I tried this , just as you have it above with the text description "This is the Alaska description," just as a test, and it doesn't show up. Again, this is what is in my footer js; see if you notice any errors:
function addCategoryDescription() {
var categoryDescription = {
"Infrared" : 'Images in these galleries were taken with a Canon Rebel XT modified for infrared photography by <a href="http://lifepixel.com/" target="_blank">Lifepixel</a>',
"Alaska" : 'This is the Alaska description'
};


I suspect that it's not working because I don't think that the Alaska page is a category; it's a subcategory? If you look at the element id that comes up using the webdev tool, this is what you get:

div #breadcrumb .nav

Attributesclass = nav
id = breadcrumb
PositionLeft: 257pxTop: 213pxWidth: 750pxHeight: 26pxOtherFont Family:VerdanaFont Size:13.3333pxAncestorshtml
body .category category_Travel tempClass subcategory subcategory_Alaska loggedIn bodyColor_Black
div #bodyWrapper
div #category .category category_Travel tempClass subcategory subcategory_Alaska loggedIn bodyColor_Black
Childrendiv #altViews
a .nav
a .nav
span .title
div .spacer

Now look at what you get on the infrared page:
div #breadcrumb .nav

Attributesclass = nav
id = breadcrumb
PositionLeft: 257pxTop: 213pxWidth: 750pxHeight: 26pxOtherFont Family:VerdanaFont Size:13.3333pxAncestorshtml
body .category category_Infrared tempClass loggedIn bodyColor_Black
div #bodyWrapper
div #category .category category_Infrared tempClass loggedIn bodyColor_Black
Childrendiv #altViews
a .nav
span .title
div .spacer



Notice that under the infrared Ancestors, you don't see anything about subcategory the way you do in the Alaska Ancestors. I think additional javascript needs to be added that will speak to the creation af a subcategory description. Can you do this?

Thanks,

[CynthiaM]

I found some code that allowed me to make a subcategory description:
http://www.cynthiamerzerphotography.com/Travel/589335

Here's the code:

/*==============================*/
/* the subCategory descriptions */
/*==============================*/
function addSubCatDescription() {
var SubCatDescription = {
"Alaska" : 'Click into Infrared (above) to see Alaska in Infrared'
};

if (YD.hasClass(document.body, "subcategory"))
{
re = /subcategory_(\S+)/i;
re.exec(document.body.className);

albumtitle = YD.get("subCatGalleryTitle");
if (albumtitle && SubCatDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "SubCatDescription";
divTag.appendChild(document.createTextNode(SubCatD escription[RegExp.$1]));
albumtitle.parentNode.insertBefore(divTag, albumtitle.nextSibling);
}
}
if (!YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("galleriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("subCatGalleryTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (SubCatDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "SubCatDescription";
pTag.appendChild(document.createTextNode(SubCatDes cription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.addListener(window, "load", addSubCatDescription);


But I can't get it to accept a hyperlink. Any suggestions?

[Tomkirk23]

Cynthia:

I am not familiar enough with this code to help you much further. Looking at earlier posts, it seems like Devbobo's code (the code that is working for you) was not meant for subcategories. The other subcategory code you found apparently was not written with html coding in mind.

I would guess that Devbobo's code could be enhanced by a Javascript expert pretty quickly to handle subcats. If so, it would be a valuable piece of code for various folks.

My suggestion is to "bump" for Devbobo or one of the javascript folks who monitor this forum.

Thanks,

Tom K.

[CynthiaM]

Thanks, Tom

You've been a big help. At least now I have descriptions and even one with a hyperlink. I posted over on the API/Hacks but so far have not received a response. If I ever get a workable response, I will try to remember to come back over here and post it so you can see it.

Thanks again,

[jfriend]

I really don't know where to put this, so I'll just tack this onto the thread. I was helping solve some problems with category descriptions on another site and I realized that I had to modify the category description code in order to solve those problems. The problems I saw were:
The description sometimes got duplicated on other categories besides the one that was named.
Category names with spaces in them didn't work at all.
The javascript code had a lot of undeclared variables which means they were global variables. This seems like a recipe for variable naming conflict and also makes it harder to debug
The javascript code used some regexp global variables which makes it very difficult to debug (those globals get clobbered by some debuggers)So, I modified the code to fix all these issues. Here's the new code:
/* Category descriptions */
function addCategoryDescription() {
var categoryDescription = {
"category1" : "This is a test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

var divTag, re, matches, i; // various local variables

// first check to see if we're on a category page
if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {
re = /category_(\S+)/i;
// category class names we are trying to match have underscores instead of spaces so...
// to make this work for category names with spaces and underscores in the names, we have to convert spaces into underscores in the match table
for (i in categoryDescription) {
var newName = i.replace(/ /g, "_");
categoryDescription[newName] = categoryDescription[i]; // add a property to the object that has only underscores in the name
}
matches = re.exec(document.body.className);
if (matches && (matches.length > 1)) {
var breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[matches[1]]) { // if this category name is in our table, add a description for it
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[matches[1]]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
}

// then see if we're on the homepage
if (YD.hasClass(document.body, "homepage")) {
re = /\>([^\<]+)<\/a>/i; // pattern to find the category name between the <a> and </a> tags

divTag = YD.get("categoriesBox");
if (divTag) {
var divTags = YD.getElementsByClassName("albumTitle", "p", divTag);
for (i = 0; i < divTags.length; i++) {
matches = re.exec(divTags[i].innerHTML); // get just the category name
// if we found a category name and the category name exists in our categoryDescription object, then add the description
if (matches && (matches.length > 1) && categoryDescription[matches[1]] != undefined) {
var pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[matches[1]]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}

YE.onDOMReady(addCategoryDescription);

[jfriend]

I found some code that allowed me to make a subcategory description:

But Cynthia, sub-categories already allow for a description right in your page - you just click the
"add description" link and type what you want. You don't need javascript to have a sub-category description.

If you want true HTML in the sub-category description, you can put anything in there you want. You just have to surround it with <html>your HTML here</html> to tell Smugmug that it's HTML and you want to leave it that way.

[Peamoony]

But Cynthia, sub-categories already allow for a description right in your page - you just click the
"add description" link and type what you want. You don't need javascript to have a sub-category description.

If you want true HTML in the sub-category description, you can put anything in there you want. You just have to surround it with <html>your HTML here</html> to tell Smugmug that it's HTML and you want to leave it that way.

:scratch No the add description link is on the gallery page not the sub-catagory. I would love to add sub-category descriptions also....Any help would be great!

Amanda - www.MorningDewPhotography.com

[hkong]

I agree with Peamoony, I need descriptions for subcategories as well. I tried to substitute 'subcategory' for 'category' and some minor logic tweaks in jfriend's code (thanks, by the way, it works great), but I couldn't figure out how to make it work. Any help would be very appreciated.

[jfriend]

I agree with Peamoony, I need descriptions for subcategories as well. I tried to substitute 'subcategory' for 'category' and some minor logic tweaks in jfriend's code (thanks, by the way, it works great), but I couldn't figure out how to make it work. Any help would be very appreciated.
OK, here you go. This is a version of the category description code that works for categories AND sub-categories. The categories part works just the same as before. To add a sub-category to the table you put the name in as category.subcategory so if the category is "Kenya" and the subcategory is "Highlights", you put it in the table as "Kenya.Highlights". Periods in the category name are not supported.

To use it, copy the code into your "Bottom Javascript" and then modify the categoryDescription table to add your category or subcategory names and descriptions.

If you have a previous version of the code, you MUST remove it before adding this one. Duplicate function names will cause unpredictable results.

function addCategoryTitleToBreadcrumb(description)
{
var breadCrumb = YD.get("breadcrumb");
if (breadCrumb)
{
var divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(descrip tion));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

function addCategoryTitleToThumbs(descriptionObject, boxObjectName)
{
var re = /\>([^\<]+)<\/a>/i; // pattern to find the category name between the <a> and </a> tags
var divTag = YD.get(boxObjectName);
if (divTag)
{
var divTags = YD.getElementsByClassName("albumTitle", "p", divTag);
for (var i = 0; i < divTags.length; i++)
{
var matches = re.exec(divTags[i].innerHTML); // get just the category name
// if we found a category name and the category name exists in our categoryDescription object, then add the description
if (matches && (matches.length > 1) && descriptionObject[matches[1]] != undefined)
{
var pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(descripti onObject[matches[1]]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}

/* Category descriptions */
function addCategoryDescription()
{
var categoryDescription = {
// list "categoryname" : "category title",
// or "categoryname.subcategoryname" : "subcategory title",
// Examples:
// "Kenya" : "Our vacation to Kenya",
// "Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
// VERY IMPORTANT. This table must be formatted perfectly.
// quoted string : quoted string followed by a comma
// except the last line of the table cannot have a comma after it (or it won't work in IE)

"Kenya" : "Our vacation to Kenya",
"Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
"Kenya.Shaba" : "Galleries from our three days in Shaba",
"Other.Sigma Lens Test": "Various galleries from testing my Sigma lens",
"category2" : "This is another test.",
"category3" : "Final test"
};

var re, matches, i; // various local variables

// now fix it so that it works automatically even if the category or sub-category name has spaces in it
// we replace those spaces with underscores (which is what the classname does) and add those to our object so we can match those too
for (i in categoryDescription)
{
var newName = i.replace(/ /g, "_");
categoryDescription[newName] = categoryDescription[i]; // add a property to the object that has only underscores in the name
}
// on the homepage, we want to check for category names and add a description if a match found
// on a category page, we want to check to see if the category that the page is needs a description under the breadcrumb
// and, we need to see if any of the sub-category items on the page need us to add a description under the name
// on a sub-category page, we want to check to see if the sub-category that the page is needs a description under the breadcrumb
if (YD.hasClass(document.body, "category"))
{
// fetch the category name
re = /category_(\S+)/i;
matches = re.exec(document.body.className);
if (matches && (matches.length > 1))
{
var categoryName = matches[1];
// now see if we have a subcategory too
if (YD.hasClass(document.body, "subcategory"))
{
re = /subcategory_(\S+)/i;
matches = re.exec(document.body.className);
if (matches && (matches.length > 1))
{
var subcatName = matches[1];
// category and subcategory so we are on a subcategory page showing a list of galleries in this subcategory
// we need to just add a subcategory title to this page if the category-subcategory matches
var fullName = categoryName + "." + subcatName;
if (categoryDescription[fullName])
{
addCategoryTitleToBreadcrumb(categoryDescription[fullName]);
}
}
}
// here we're on a category page
// we need to add a category description for the category page
// and potentially add subcategory descriptions to the subcategory names displayed on this page
else
{
if (categoryDescription[categoryName])
{
addCategoryTitleToBreadcrumb(categoryDescription[categoryName]);
}
// now we need to build a temporary subcategoryDescription object that has only the subcategory names in it that are in this category
var subcatDescriptions = {};
re = new RegExp("^" + categoryName + "\\.(.+)$", "i");
for (i in categoryDescription)
{
matches = re.exec(i);
if (matches && (matches.length > 1))
{
subcatDescriptions[matches[1]] = categoryDescription[i];
}
}
addCategoryTitleToThumbs(subcatDescriptions, "subcategoriesBox");
}
}
}

// then see if we're on the homepage
if (YD.hasClass(document.body, "homepage"))
{
addCategoryTitleToThumbs(categoryDescription, "categoriesBox");
}
}

YE.onDOMReady(addCategoryDescription);

[jfriend]

Bump, as I'm surprised that nobody commented on the new ability to have descriptions for sub-categories.

[jfriend]

One more revision to the latest. This one allows you to use HTML in the category and sub-category descriptions.


function addCategoryTitleToBreadcrumb(description)
{
var breadCrumb = YD.get("breadcrumb");
if (breadCrumb)
{
var divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.innerHTML = description;
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

function addCategoryTitleToThumbs(descriptionObject, boxObjectName)
{
var re = /\>([^\<]+)<\/a>/i; // pattern to find the category name between the <a> and </a> tags
var divTag = YD.get(boxObjectName);
if (divTag)
{
var divTags = YD.getElementsByClassName("albumTitle", "p", divTag);
for (var i = 0; i < divTags.length; i++)
{
var matches = re.exec(divTags[i].innerHTML); // get just the category name
// if we found a category name and the category name exists in our categoryDescription object, then add the description
if (matches && (matches.length > 1) && descriptionObject[matches[1]] != undefined)
{
var pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.innerHTML = descriptionObject[matches[1]];
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}

/* Category descriptions */
function addCategoryDescription()
{
var categoryDescription = {
// list "categoryname" : "category title",
// or "categoryname.subcategoryname" : "subcategory title",
// Examples:
// "Kenya" : "Our vacation to Kenya",
// "Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
"Kenya" : "Our vacation to Kenya",
"Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
"category2" : "This is another test.",
"category3" : "Final test"
};

var re, matches, i; // various local variables

// now fix it so that it works automatically even if the category or sub-category name has spaces in it
// we replace those spaces with underscores (which is what the classname does) and add those to our object so we can match those too
for (i in categoryDescription)
{
var newName = i.replace(/ /g, "_");
categoryDescription[newName] = categoryDescription[i]; // add a property to the object that has only underscores in the name
}
// on the homepage, we want to check for category names and add a description if a match found
// on a category page, we want to check to see if the category that the page is needs a description under the breadcrumb
// and, we need to see if any of the sub-category items on the page need us to add a description under the name
// on a sub-category page, we want to check to see if the sub-category that the page is needs a description under the breadcrumb
if (YD.hasClass(document.body, "category"))
{
// fetch the category name
re = /category_(\S+)/i;
matches = re.exec(document.body.className);
if (matches && (matches.length > 1))
{
var categoryName = matches[1];
// now see if we have a subcategory too
if (YD.hasClass(document.body, "subcategory"))
{
re = /subcategory_(\S+)/i;
matches = re.exec(document.body.className);
if (matches && (matches.length > 1))
{
var subcatName = matches[1];
// category and subcategory so we are on a subcategory page showing a list of galleries in this subcategory
// we need to just add a subcategory title to this page if the category-subcategory matches
var fullName = categoryName + "." + subcatName;
if (categoryDescription[fullName])
{
addCategoryTitleToBreadcrumb(categoryDescription[fullName]);
}
}
}
// here we're on a category page
// we need to add a category description for the category page
// and potentially add subcategory descriptions to the subcategory names displayed on this page
else
{
if (categoryDescription[categoryName])
{
addCategoryTitleToBreadcrumb(categoryDescription[categoryName]);
}
// now we need to build a temporary subcategoryDescription object that has only the subcategory names in it that are in this category
var subcatDescriptions = {};
re = new RegExp("^" + categoryName + "\\.(.+)$", "i");
for (i in categoryDescription)
{
matches = re.exec(i);
if (matches && (matches.length > 1))
{
subcatDescriptions[matches[1]] = categoryDescription[i];
}
}
addCategoryTitleToThumbs(subcatDescriptions, "subcategoriesBox");
}
}
}

// then see if we're on the homepage
if (YD.hasClass(document.body, "homepage"))
{
addCategoryTitleToThumbs(categoryDescription, "categoriesBox");
}
}

YE.onDOMReady(addCategoryDescription);

[infocusnyc]

Jfreind that is awesome and looks like it took a lot of work. I've been following this thread here to the end. My problem is that your code is so long and confusing I'm not sure where i need to enter the data so it can be applied for my page. I'm trying to add a description to a subcategory with html on my page. Can you color code it or something? The page I'm trying to add to is High School Sports under personal galleries at www.infocusnyc.com (http://www.infocusnyc.com) Thanks

[jfriend]

Jfreind that is awesome and looks like it took a lot of work. I've been following this thread here to the end. My problem is that your code is so long and confusing I'm not sure where i need to enter the data so it can be applied for my page. I'm trying to add a description to a subcategory with html on my page. Can you color code it or something? The page I'm trying to add to is High School Sports under personal galleries at www.infocusnyc.com (http://www.infocusnyc.com) Thanks

Find where is says "var categoryDescription" and there are examples that include Kenya. You replace those examples with your own.

Here's an image that shows where you put your own data:

http://content.screencast.com/users/jfriend/folders/Jing/media/e1e9c16a-db76-40a7-a29e-08b623097d2f/2008-12-25_1852.png

[infocusnyc]

Thanks... I did figure that out just now on my own but now i'm having trouble getting a html link to work. I was just putting in the description as normal but then the whole description does not show when i add the link. With out the <a href="http://www.smugmug.com">SmugMug's (http://www.smugmug.com&quot;>SmugMug's)homepage</a> type link it works fine.

[wbphotos]

Thanks... I did figure that out just now on my own but now i'm having trouble getting a html link to work. I was just putting in the description as normal but then the whole description does not show when i add the link. With out the <a href="http://www.smugmug.com (http://www.smugmug.com&quot;>SmugMug's)">SmugMug's (http://www.smugmug.com&quot;>SmugMug's)homepage</a> type link it works fine.

I added this for my TITLE ONLY "Events" Category. I want to change the bg color from #000000 to #111111

I tried using this code...am I getting warmer? LOL

.category.category_Events .miniBox .categoryDescription
{
padding-left: 5px !important;
background: #111111 !important;
}

[wbphotos]

Thanks... I did figure that out just now on my own but now i'm having trouble getting a html link to work. I was just putting in the description as normal but then the whole description does not show when i add the link. With out the <a href="http://www.smugmug.com (http://www.smugmug.com&quot;>SmugMug's)">SmugMug's (http://www.smugmug.com&quot;>SmugMug's)homepage</a> type link it works fine.

I implemented this for my TITLE ONLY "Events" category.
I was trying to change the BG color to #000000 to 111111. Here is the code I used. Am I getting warmer? LOL

.category.category_Events .miniBox .categoryDescription
{
padding-left: 5px !important;
background: #111111 !important;
}

[wbphotos]

I implemented this for my TITLE ONLY "Events" category.
I was trying to change the BG color to #000000 to 111111. Here is the code I used. Am I getting warmer? LOL

.category.category_Events .miniBox .categoryDescription
{
padding-left: 5px !important;
background: #111111 !important;
}


Hey John look at me...I figured it out. LOL

.category.category_Events .categoryDescription
{
padding-left: 5px !important;
background: #111111 !important;
}

[deborahj]

Hi,

I've been reading through this thread, but it's a little beyond my skill level right now.

Is there some cut and paste code I can use to add category descriptions, a final simple fix?

http://deborahjackson.smugmug.com/

Thanks,

Deborah

[jfriend]

Hi,

I've been reading through this thread, but it's a little beyond my skill level right now.

Is there some cut and paste code I can use to add category descriptions, a final simple fix?

http://deborahjackson.smugmug.com/

Thanks,

Deborah

Paste the code from post #83 into your bottom javascript. Then, modify the section pointed to in post #85 to add your category names and your descriptions. That's the most straightforward I know how to make it.

[Geminai]

Thank you, thank you, thank you!

I've been wanting descriptions on my sub-categories and it's astonishing to me how hard it was to find here. hehe. I'd have thought all of you website whizzes would have had way more people asking for this.

Thank you for the wizardry!

:)

Kippy

[yukoner]

[UPDATED] Add code to work on homepage as well

Try this code...

javascript block...


function addCategoryDescription() {
var categoryDescription = {
"category1" : "This is a test.",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.addListener(window, "load", addCategoryDescription);


Category names and descriptions should be replaced with the text in yellow.

The code adds elements with a class = categoryDescription. So CSS customisation can be done against the elements.

Hope this helps,

David
I have inserted this code as follows and, although when I go into the individual categories the description is there, it doesn't show on the homepage. Am I missing something? (I also tried with the code at #83 and had the same result) Homepage is http://www.yukonphotographers.com

This is the code I have put in my bottom javascript:

function addCategoryDescription() {
var categoryDescription = {
"Norm_Hamilton" : "Norm is an award winning internationally recognized photographer living in Whitehorse, Yukon.",
"Damien_Tremblay" : "Damien is a northern landscape photographer based in Whitehorse, Yukon."
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.onContentReady('bodyWrapper', addCategoryDescription);

[jfriend]

I have inserted this code as follows and, although when I go into the individual categories the description is there, it doesn't show on the homepage. Am I missing something? (I also tried with the code at #83 and had the same result) Homepage is http://www.yukonphotographers.com

This is the code I have put in my bottom javascript:

function addCategoryDescription() {
var categoryDescription = {
"Norm_Hamilton" : "Norm is an award winning internationally recognized photographer living in Whitehorse, Yukon.",
"Damien_Tremblay" : "Damien is a northern landscape photographer based in Whitehorse, Yukon."
};

if ((YD.hasClass(document.body, "category")) && (!YD.hasClass(document.body, "subcategory"))) {

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = YD.get("breadcrumb");
if (breadCrumb && categoryDescription[RegExp.$1]) {
divTag = document.createElement("div");
divTag.className = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}
if (YD.hasClass(document.body, "homepage")) {
re = /\>([\w\-]+)<\/a>/i;

divTag = YD.get("categoriesBox");
if (divTag) {
divTags = YD.getElementsByClassName("albumTitle", "p", divTag);

for (i=0; i<divTags.length; i++) {
re.exec(divTags[i].innerHTML);
if (categoryDescription[RegExp.$1] != undefined) {
pTag = document.createElement("p");
pTag.className = "categoryDescription";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}
YE.onContentReady('bodyWrapper', addCategoryDescription); I can't debug this version of the code (it's not written to be friendly to the Firebug debugger - use of undeclared variables and use of regex globals) which is one of the reasons I wrote the version in post #83. If you put that version in, I can figure out why it isn't working, but I can't help with this version.

[yukoner]

I can't debug this version of the code (it's not written to be friendly to the Firebug debugger - use of undeclared variables and use of regex globals) which is one of the reasons I wrote the version in post #83. If you put that version in, I can figure out why it isn't working, but I can't help with this version.
Thanks. I have put in the code from post #83 as requested. I look forward to hearing from you again.

Norm

[jfriend]

Thanks. I have put in the code from post #83 as requested. I look forward to hearing from you again.

Norm If you use the actual category name (including the space) without the underscore, I believe it will work.

[yukoner]

If you use the actual category name (including the space) without the underscore, I believe it will work.

I read in an earlier post that Javascript had to have the underscore so had added that. Without the underscore the descriptions show up on the homepage as well as the page with the catagories.

Thanks for taking the time to help with this.

Norm

[jfriend]

I read in an earlier post that Javascript had to have the underscore so had added that. Without the underscore the descriptions show up on the homepage as well as the page with the catagories.

Thanks for taking the time to help with this.

Norm When I rewrote the function, I added a lot of functionality (adding ability to use HTML in your descriptions, supported sub-categories, etc) and tried to make it easier for people to use. You just put the category name in and the code takes care of any necessary underscores internally. I don't know why the previous code didn't work as I wasn't able to debug it.

Anyway, glad it's working now. If you only want the descriptions on some pages and not others, you can easily hide it in one place with CSS.

[yukoner]

When I rewrote the function, I added a lot of functionality (adding ability to use HTML in your descriptions, supported sub-categories, etc) and tried to make it easier for people to use. You just put the category name in and the code takes care of any necessary underscores internally. I don't know why the previous code didn't work as I wasn't able to debug it.

Anyway, glad it's working now. If you only want the descriptions on some pages and not others, you can easily hide it in one place with CSS.
So much to learn John. :wink

To use HTML do I just enter it like
<a href="http://www.massage-yukon.com">Relaxation Services</a> or do I have to something else? I tried this and it stopped the script from executing.

[jfriend]

So much to learn John. :wink

To use HTML do I just enter it like
<a href="http://www.massage-yukon.com">Relaxation Services</a> or do I have to something else? I tried this and it stopped the script from executing.

The trick is that you have to watch your quotation. Both javascript and HTML can use either a double quote " or a single quote ' to delineate a string. You need to use one for the ends of the string for javascript and the other within the string for the HTML.

So, for your html, you would do it like this:

"category name" : '<a href="http://www.massage-yukon.com">Relaxation Services</a>',

with single qutoes around the outside, no single quotes anywhere in the middle, double quotes inside for the HTML and then a single quote at the end. This way, the HTML is happy because it is consistently using double quotes and the javascript is happy because it is consistently using single quotes and neither is messing up the other.

[takeflightphoto]

I've been through this whole thread, copy-pasted the code from Post #83 (with my category names and descriptions) into bottom JS, and nothing.

I'm looking to put the descriptions on:
http://www.usdgcphotos.com/2009,
http://www.usdgcphotos.com/players,
http://www.usdgcphotos.com/event,
http://www.usdgcphotos.com/staff,
and http://www.usdgcphotos.com/awards.

I know I've missed something, but re-reading the back-and-forth in this thread has me bewildered. Was there something more than just the JS?

What I'm after is a short description on each of my category pages, so I think I'm in the right thread for this, but who knows.

I posted a new thread asking about this, but no one has commented so I thought bumping this one might elicit a response.

jon

http://www.usdgcphotos.com

[jfriend]

I've been through this whole thread, copy-pasted the code from Post #83 (with my category names and descriptions) into bottom JS, and nothing.

I'm looking to put the descriptions on:
http://www.usdgcphotos.com/2009,
http://www.usdgcphotos.com/players,
http://www.usdgcphotos.com/event,
http://www.usdgcphotos.com/staff,
and http://www.usdgcphotos.com/awards.

I know I've missed something, but re-reading the back-and-forth in this thread has me bewildered. Was there something more than just the JS?

What I'm after is a short description on each of my category pages, so I think I'm in the right thread for this, but who knows.

I posted a new thread asking about this, but no one has commented so I thought bumping this one might elicit a response.

jon

http://www.usdgcphotos.com You can't put line breaks in the middle of the descriptions and that is causing javascript errors so the script won't execute. Try removing those carriage returns in the middle of your descriptions first. The javascript strings that represent the descriptions must be all on one line. You can use HTML inside the strings to add linebreaks as long as you don't use any double quote marks in the HTML.

[yukoner]

I've been through this whole thread, copy-pasted the code from Post #83 (with my category names and descriptions) into bottom JS, and nothing.

I'm looking to put the descriptions on:
http://www.usdgcphotos.com/2009,
http://www.usdgcphotos.com/players,
http://www.usdgcphotos.com/event,
http://www.usdgcphotos.com/staff,
and http://www.usdgcphotos.com/awards.

I know I've missed something, but re-reading the back-and-forth in this thread has me bewildered. Was there something more than just the JS?

What I'm after is a short description on each of my category pages, so I think I'm in the right thread for this, but who knows.

I posted a new thread asking about this, but no one has commented so I thought bumping this one might elicit a response.

jon

http://www.usdgcphotos.com
It might help if you post what you are placing in the javascript area; I know posting that allowed jfriend to help me get mine working. (see the few posts just prior to yours)

Yukoner

[jfriend]

It might help if you post what you are placing in the javascript area; I know posting that allowed jfriend to help me get mine working. (see the few posts just prior to yours)

Yukoner No need to include JS here. As long as they include a link to their site, I can see their JS right in their page and it doesn't clutter up the dgrin postings.

[yukoner]

No need to include JS here. As long as they include a link to their site, I can see their JS right in their page and it doesn't clutter up the dgrin postings.

Thanks. I didn't realize that. My apologies.

[takeflightphoto]

No need to include JS here. As long as they include a link to their site, I can see their JS right in their page and it doesn't clutter up the dgrin postings.

Sorry, John...

Look at the Bottom JS at http://www.usdgcphotos.com.

I copied the code in post 83, replaced the category names and descriptions in yellow with my own, and put it in the JS box, updated, and nothing seems to have happened. Not sure what you mean by linebreaks, i just put in long sentences of text.

Those urls above were just to show where I expected the new descriptions to show up.

Thanks for looking and helping.

jon

[jfriend]

Sorry, John...

Look at the Bottom JS at http://www.usdgcphotos.com.

I copied the code in post 83, replaced the category names and descriptions in yellow with my own, and put it in the JS box, updated, and nothing seems to have happened. Not sure what you mean by linebreaks, i just put in long sentences of text.

Those urls above were just to show where I expected the new descriptions to show up.

Thanks for looking and helping.

jon I'll try to explain. This part of the script isn't right:

var categoryDescription = {
// list "categoryname" : "category title",
// or "categoryname.subcategoryname" : "subcategory title",
// Examples:
// "Kenya" : "Our vacation to Kenya",
// "Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
"Art" : "Artistic interpretations of various images, well worth the price to adorn your

home or office. Available in your choice of metallic photo stock, giclee' watercolor paper, or

stretched canvas."
"2009" : "During the 2009 USDGC, Staff Photographers will be uploading pictures to these

galleries on a daily basis. Please check each day for new and exciting images of The

Championship. Available in glossy, lustre, matte, metallic, and canvas.",
"Players" : "Here you will find images of players in competition, at leisure, and at other

activites. Available in glossy, lustre, matte, metallic, and canvas.",
"Event" : "Photographs depicting the course, the crowd, the social activities, the

atmosphere of this premiere disc golf event. Available in glossy, lustre, matte, metallic, and

canvas."
"Staff" : "The dedicated Staff and Volunteers make the Championship what it is. Here are

photos of them at work, play, and rest. Available in glossy, lustre, matte, metallic, and

canvas."
"Awards" : "Photos of the Champions and other top finishers, as well as special award

ceremony happenings. Available in glossy, lustre, matte, metallic, and canvas."
};
These are not just long descriptions. You have linebreaks in them (there are carriage returns in the middle of the descriptions). These need to each be on ONE long line like this and you need to have a comma after each line except the last one:

var categoryDescription = {
// list "categoryname" : "category title",
// or "categoryname.subcategoryname" : "subcategory title",
// Examples:
// "Kenya" : "Our vacation to Kenya",
// "Kenya.Highlights" : "The highlights galleries from our vacation to Kenya",
"Art" : "Artistic interpretations of various images, well worth the price to adorn your home or office. Available in your choice of metallic photo stock, giclee' watercolor paper, or stretched canvas.",
"2009" : "During the 2009 USDGC, Staff Photographers will be uploading pictures to these galleries on a daily basis. Please check each day for new and exciting images of The Championship. Available in glossy, lustre, matte, metallic, and canvas.",
"Players" : "Here you will find images of players in competition, at leisure, and at other activites. Available in glossy, lustre, matte, metallic, and canvas.",
"Event" : "Photographs depicting the course, the crowd, the social activities, the atmosphere of this premiere disc golf event. Available in glossy, lustre, matte, metallic, and canvas.",
"Staff" : "The dedicated Staff and Volunteers make the Championship what it is. Here are photos of them at work, play, and rest. Available in glossy, lustre, matte, metallic, and canvas.",
"Awards" : "Photos of the Champions and other top finishers, as well as special award ceremony happenings. Available in glossy, lustre, matte, metallic, and canvas."
};

[takeflightphoto]

Wow. Thanks for the catch. I have no idea how the linebreaks got in there, as wrote them in Wordpad with wordwrap turned off.

That's doing just what I wanted it to.

Thanks, John.


jon

[leightonoc]

Hello,

Where does this code get added?

Thanks,
Leighton

dev is the man.

however, i modified the code to produce id and class names more consistent with the albumDescription in galleries and the homepage.

for the description inside galleries, the description has an id=albumDescription, so the corresponding category description should be id=categoryDescription, not class=categoryDescription.

for the description on the homepage,the format is id=albumDescription_XXXXX class=description where the X's are the album number. I modified the code to be id=categoryDescription_XXXXX class=description where the X's are the category name.

hope you dont mind Dev.

code:function addCategoryDescription()
{
var categoryDescription = {
"Madeline" : "Madeline Grace Shepherd",
"category2" : "This is another test.",
"category3" : "Final test"
};

if ((isClass("category")) && (!isClass("subcategory")))
{

re = /category_(\S+)/i;
re.exec(document.body.className);

breadCrumb = document.getElementById("breadcrumb");
if (breadCrumb)
{
divTag = document.createElement("div");
divTag.id = "categoryDescription";
divTag.appendChild(document.createTextNode(categor yDescription[RegExp.$1]));
breadCrumb.parentNode.insertBefore(divTag, breadCrumb.nextSibling);
}
}

if (isClass("homepage"))
{
re = /\>([\w\-]+)<\/a>/i;

divTag = document.getElementById("categoriesBox");
if (divTag)
{
divTags = divTag.getElementsByTagName("p");

for (i=0; i<divTags.length; i++)
{
if (divTags[i].className == "albumTitle")
{
re.exec(divTags[i].innerHTML);
pTag = document.createElement("p");
pTag.id = "categoryDescription_" + RegExp.$1;
pTag.className = "description";
pTag.appendChild(document.createTextNode(categoryD escription[RegExp.$1]));
divTags[i].parentNode.insertBefore(pTag, divTags[i].nextSibling);
}
}
}
}
}

[jfriend]

Hello,

Where does this code get added?

Thanks,
Leighton As it says in the very first post in this thread, copy it into your Bottom Javascript.

[sealedglass]

Just wanted to take a sec and say thanks for this thread. This was exactly what I was trying to do and it worked like a charm (with a bit of strong-arming ;). Two things to add to this:

1) #28 on the main FAQ site (http://www.smugmug.com/help/customize-faq) has the category-only code; it doesn't include the sub-category description code from post #83. This may be intentional but I just bumped into it and thought I would mention it.

2) I added the following CSS code to hide the category descriptions from my main gallery page (I display categories rather than galleries on the main page and some of my category descriptions are extremely long, didn't want them showing up under the category thumbnails):

.galleries .categoryDescription {visibility: hidden;}

Apologies if #2 has been mentioned already but I don't remember seeing it in the thread.

Once again the customization options available here remind me why I chose SmugMug. :D

[PatV]

I had a look through various customization topics on the forum, but couldn't find something related to Category customization beside changing the number of "galleries" displayed per row.


I like to know if it is possible to customize categories and how to.


I would like to modify the layout which seems to be using the Journal layout or something similar so the breadcrumb would be aligned on the left and not the center. Or is it possible to simply overwrite these breadcrumbs ?


To clarify what I want to do. I modify most of the layouts because I personally do not like the look. So if you go for instance on the Portfolio category(http://www.patrickvanderheyden.com/gallery/8274906_Ta35e) and any of the subcategories, I removed the default breadcrumbs and added another personalized breadcrumbs with links on the good galleries.


But on the Clients categories(http://www.patrickvanderheyden.com/gallery/8286641_Jj8Jg) (http://www.patrickvanderheyden.com/gallery/8286641_Jj8Jg%29), I did something similar but I am a using the default categories layout for the subcategories. (http://www.patrickvanderheyden.com/Clients/809120) However the breadcrumbs are now centered(or almost, what I mean is that they ar not aligned to the left anymore), I would like to have them align to the left. Or is it possible to replace them by my own breadcrumbs like at did on other pages ?


Thanks for clarifying what can be done. Otherwise I could do like I did for the Portfolio categories and overwrite everything by using customized galleries instead of using the categories, it just that it takes a lot of time to do this for every sub-category...

Sorry if it has been answered already, I couldn't find the answer.

Thanks,
Patrick
www.patrickvanderheyden.com (http://www.patrickvanderheyden.com)

[framingthelight]

I would like to thank ALL of those altruistic souls who have posted the information regarding this subject of "adding descriptions to categories."

My very simple site displays Categories instead of individual galleries, and the ability to post a description on each of the categories was very important to me. I followed the instructions, specifically from Post #83 etc., and I was very happily surprised that it worked very quickly. Thank you.

I was happy enough with the small but important customizations that could be had with the Easy Customizer, but I got hooked on trying more and more improvements, thanks to the advice I have gotten from the posts on this discussion board. My website is so much better thanks to all of you!

Again, my most sincere THANKS !

[jfriend]

I would like to thank ALL of those altruistic souls who have posted the information regarding this subject of "adding descriptions to categories."

My very simple site displays Categories instead of individual galleries, and the ability to post a description on each of the categories was very important to me. I followed the instructions, specifically from Post #83 etc., and I was very happily surprised that it worked very quickly. Thank you.

I was happy enough with the small but important customizations that could be had with the Easy Customizer, but I got hooked on trying more and more improvements, thanks to the advice I have gotten from the posts on this discussion board. My website is so much better thanks to all of you!

Again, my most sincere THANKS ! Glad it worked out for you.

[PatV]

Ok, I've finaly been able to add descriptions in Categories and sub-categories, thanks to that post #83 which I missed earlier... My objective was to add personalized breadcrumbs which is now working fine.

I however have a question concerning these "Category Name Galleries" (http://www.patrickvanderheyden.com/Clients/785636) or "Category name Sub-Categories"(http://www.patrickvanderheyden.com/Clients/ )default description which I cannot find how to remove. I tried following what's mentioned into this thread:

http://www.dgrin.com/showthread.php?t=56660&highlight=hide+Sub-Categories but with no success. I find that strange because I never did anything special to this Category: http://www.patrickvanderheyden.com/stills and no default description is displayed there.


I've been also trying to resize the default width of the categories layout (which seems to be using journal layout) again with no success. The whole page was being resized when going into a category.... That way I could aligned text on the left of the screen the same way I do on all my other webpages. Any way this could be done in CSS ? I would like to have the Breadcrumbs at the same location than all other breadcrumbs (In my case I specified 75px to the right of the screen).

Thanks,
Patrick

[PatV]

I gave another shot at it this morning and finally found the class that has to be hidden.

#subCatGalleryTitle {display: none}
As for the Category width, I'till trying to figure that out. My best guess was to set
.category {width: auto;} But this still gets overwritten by Smugmug default value back to 750px thereafter. If I was able to set to "auto" value last, that would work. Any idea if this can be done ?

Thanks, Patrick

[jfriend]

I gave another shot at it this morning and finally found the class that has to be hidden.

#subCatGalleryTitle {display: none}
As for the Category width, I'till trying to figure that out. My best guess was to set
.category {width: auto;} But this still gets overwritten by Smugmug default value back to 750px thereafter. If I was able to set to "auto" value last, that would work. Any idea if this can be done ?

Thanks, Patrick

Use this to make the category with auto sizing to the screen:

#category {width: auto;}

Then, if you want your thumbs to align left, you need to set a height on the category description and perhaps tame the margins you have on the ul.

.categoryDescription {height:30px;}

[PatV]

Use this to make the category with auto sizing to the screen:

#category {width: auto;}

Then, if you want your thumbs to align left, you need to set a height on the category description and perhaps tame the margins you have on the ul.

.categoryDescription {height:30px;}
That is great !

I also tried this morning, must have mistype the class at that moment as there was no effect.

Any way I could center the .box ? problem is now the second row has no offset compared to the first row (see http://www.patrickvanderheyden.com/Clients/) or {http://www.patrickvanderheyden.com/Clients/785636 and make the browser smaller so only 1 or 2 galleries fit on the first row.)

I tried setting a width to the .box, but that only limited the number of galleries per row, but did not fixed the problem of the second and all other rows following.

[PatV]

That is great !

I also tried this morning, must have mistype the class at that moment as there was no effect.

Any way I could center the .box ? problem is now the second row has no offset compared to the first row (see http://www.patrickvanderheyden.com/Clients/) or {http://www.patrickvanderheyden.com/Clients/785636 and make the browser smaller so only 1 or 2 galleries fit on the first row.)

I tried setting a width to the .box, but that only limited the number of galleries per row, but did not fixed the problem of the second and all other rows following.

I finally decided to remove the .categoryDescription {height:30px;} it was causing a mess. I fxed some margin of the .box and adjusted the .minibBox as well as the .albumLarge so I could fit more icons per row should there be a need.

Thanks for your help, I appreciate !

Patrick

[Bluegrass]

Hi.

I inserted the code from comment #83 into the "Bottom Javascript" section.

I also added this line into the "Top Javascript", per comment #23.
addEvent(window, "load", addCategoryDescription);

I now see "This is a test" as a small description next to my "Jam Sessions" category "thumbnail" on my home page. However, I was hoping to see this description appear at the top of the category when I open the thumbnail. That is what I really need.

Will you please take a look at my site and let me know what I'm doing wrong? http://pearlbluegrass.smugmug.com/

Thanks in advance for any help you can offer.
...Sue

[jfriend]

Hi.

I inserted the code from comment #83 into the "Bottom Javascript" section.

I also added this line into the "Top Javascript", per comment #23.
addEvent(window, "load", addCategoryDescription);

I now see "This is a test" as a small description next to my "Jam Sessions" category "thumbnail" on my home page. However, I was hoping to see this description appear at the top of the category when I open the thumbnail. That is what I really need.

Will you please take a look at my site and let me know what I'm doing wrong? http://pearlbluegrass.smugmug.com/

Thanks in advance for any help you can offer.
...Sue Because this thread has wandered all over the place for how to do this and has many versions of the code, I wrote up a clean set of instructions for this customization over here (http://www.dgrin.com/showthread.php?t=135040). For example, the latest instructions do give you a description where you are wanting it and they do not have you doing the addEvent call.


I'd suggest you read those and see if that helps you get things going. Also, in the future, there's a list of a bunch of javascript customizations including the category description one here (http://www.dgrin.com/showthread.php?t=135068).

[Bluegrass]

Because this thread has wandered all over the place for how to do this and has many versions of the code, I wrote up a clean set of instructions for this customization over here (http://www.dgrin.com/showthread.php?t=135040). For example, the latest instructions do give you a description where you are wanting it and they do not have you doing the addEvent call.


I'd suggest you read those and see if that helps you get things going. Also, in the future, there's a list of a bunch of javascript customizations including the category description one here (http://www.dgrin.com/showthread.php?t=135068).
========

Hi, John -

Thank you very much for the quick reply. Your instructions with the screen shots are excellent and that's exactly what I'd like to do.

Unfortunately, I still seem to only get the description next to the Thumbnail (which I okay) but I don't get a description at the top of the category page which is what I'm really after.

I don't think I missed anything when cutting/pasting the code into the Bottom JavaScript section of the Site-wide Customization page.

Could you take another look at what I've done and see if you can spot what I've done differently ? http://pearlbluegrass.smugmug.com/

Many thx!
...Sue

[jfriend]

Hi.

I inserted the code from comment #83 into the "Bottom Javascript" section.

I also added this line into the "Top Javascript", per comment #23.
addEvent(window, "load", addCategoryDescription);

I now see "This is a test" as a small description next to my "Jam Sessions" category "thumbnail" on my home page. However, I was hoping to see this description appear at the top of the category when I open the thumbnail. That is what I really need.

Will you please take a look at my site and let me know what I'm doing wrong? http://pearlbluegrass.smugmug.com/

Thanks in advance for any help you can offer.
...Sue
In this category, http://pearlbluegrass.smugmug.com/Jam%20Sessions, I see a category sub-title "Place description of Jam Sessions here...". It is overlapping the Galleries title because of your CSS.

If you remove this line of your CSS:

#galleriesBox {margin-top: -15px;}

the objects won't overlap.

FYI, negative margins are always evil and frequently cause this kind of problem. There are nearly always better ways to solve spacing problems than using a negative margin by increasing or reducing the existing padding or margins of neighboring objects without negative margins.

If you want to change the color of the category description, you can do so with something like this CSS:

.categoryDescription {color:#FFFFFF;}

If you want different colors in the two places it displays, that can be done too.

[Bluegrass]

In this category, http://pearlbluegrass.smugmug.com/Jam%20Sessions, I see a category sub-title "Place description of Jam Sessions here...". It is overlapping the Galleries title because of your CSS.

If you remove this line of your CSS:

#galleriesBox {margin-top: -15px;}

the objects won't overlap.

FYI, negative margins are always evil and frequently cause this kind of problem. There are nearly always better ways to solve spacing problems than using a negative margin by increasing or reducing the existing padding or margins of neighboring objects without negative margins.

If you want to change the color of the category description, you can do so with something like this CSS:

.categoryDescription {color:#FFFFFF;}

If you want different colors in the two places it displays, that can be done too.

========================

Hi, John -

Thanks so much for your help. I decided to change the theme I had chosen for my home page so that I could have better spacing without using negative margins.

Once I did that, I was able to get the category descriptions to display just as you described. My only "gotcha's" were the things mentioned previously like remembering to use 'single quotes' in my href statements and also remembering that I needed to keep the info for a single category all on one line.

Thanks again for your assistance. I really appreciate it.
...Sue (http://pearlbluegrass.smugmug.com)

[digitalsmug]

Here are the classes on a category page, does this help you?
are there any other diagrams like this showing the name of classes on the smugmug pages?

[jfriend]

are there any other diagrams like this showing the name of classes on the smugmug pages?The best way to get this info is to install the free add-on called Firebug for Firefox. You can then see all classes and IDs in any webpage. I use it exclusively for seeing what CSS identifiers are in the Smugmug pages. Better than documentation.