Getting rid of those pesky pipes

[wellman]

Well after receiving so much help on this forum, I thought I could contribute a VERY small nugget of wisdom. I don't know about anyone else, but I hate it when pipe (|) separators are on the end of a line. This ends up happening if you have camera info enabled for your galleries. To turn this off, place the following snippet into your customization footer.

<script type="text/javascript">
// Remove trailing pipe (|) from "other sizes"
var objElement = document.getElementById("exifOtherSizes")
if (objElement != null) {
  var str = new String(objElement.innerHTML);
  str = str.replace('|', '')
  objElement.innerHTML = str;
}
</script>

The example above removes the pipe from the "exifOtherSizes" element of the camera info. Use the FF Webdeveloper Extension to get the IDs of other elements you want to clean up.

[Andy]

This is great, Greg - but I can't seem to make it work on the pipe on the footer .... I'm not sure if JT blocks that or not.

A.

[{JT}]

I will have an easier solution for this soon ;)

But - most people don't have this problem with because their "other sizes" is not the last thing in the list. Normally it is keywords or something else.

Originally Posted by Andy

This is great, Greg - but I can't seem to make it work on the pipe on the footer .... I'm not sure if JT blocks that or not.

A.

[wellman]

Originally Posted by {JT}

But - most people don't have this problem with because their "other sizes" is not the last thing in the list. Normally it is keywords or something else.

Good point.

[Andy]

Originally Posted by wellman

Well after receiving so much help on this forum, I thought I could contribute a VERY small nugget of wisdom. I don't know about anyone else, but I hate it when pipe (|) separators are on the end of a line. This ends up happening if you have camera info enabled for your galleries. To turn this off, place the following snippet into your customization footer.

<script type="text/javascript">
// Remove trailing pipe (|) from "other sizes"
var objElement = document.getElementById("exifOtherSizes")
if (objElement != null) {
  var str = new String(objElement.innerHTML);
  str = str.replace('|', '')
  objElement.innerHTML = str;
}
</script>

The example above removes the pipe from the "exifOtherSizes" element of the camera info. Use the FF Webdeveloper Extension to get the IDs of other elements you want to clean up.

I want to go "pipeless" in my footer - but no joy. Any ideas?

[ivar]

Originally Posted by Andy

I want to go "pipeless" in my footer - but no joy. Any ideas?

Andy, add this to your Javascript.

addEvent(window, "load", rem_pipes);

function rem_pipes () {
   for (var i = 0; i<3; i++) {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str = new String(objElement.innerHTML);
         str = str.replace('|', '')
         objElement.innerHTML = str;
      }
   }
}

It's for your footer only, not for your feeds. Normally, the code is read only once, so only the first pipe is removed. I put a loop in there for you, so it takes out all of the pipes. I assumed you just wanted the pipes removed, but you can also replace them by something else

I used it on my site to see if it works, and it works great.

[wellman]

Originally Posted by ivar

I used it on my site to see if it works, and it works great.

Nice!

[Andy]

Originally Posted by ivar

Andy, add this to your Javascript.

Thanks, Ivar! OK It's gone from my homepage but not from the #feeds part.

[ivar]

Originally Posted by Andy

Thanks, Ivar! OK It's gone from my homepage but not from the #feeds part.

Yep, by design, but that is easy enough to change.

addEvent(window, "load", rem_pipes);

function rem_pipes () {
   for (var i = 0; i<3; i++) {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str_a = new String(objElement.innerHTML);
         str_a = str_a.replace('|', '')
         objElement.innerHTML = str_a;
      }
      var objElement = document.getElementById("feeds")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace('|', '')
         objElement.innerHTML = str_b;
      }
   }
}

[Andy]

Originally Posted by ivar

Yep, by design, but that is easy enough to change.

addEvent(window, "load", rem_pipes);

function rem_pipes () {
   for (var i = 0; i<3; i++) {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str_a = new String(objElement.innerHTML);
         str_a = str_a.replace('|', '')
         objElement.innerHTML = str_a;
      }
      var objElement = document.getElementById("feeds")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace('|', '')
         objElement.innerHTML = str_b;
      }
   }
}

THANK YOU, IVAR Wonderful, wonderful....

Pipes gone. Wonderful. Now I can use this bit of CSS:

#feeds .note {display: none;}

which removes the "what are feeds?" link.

[Andy]

I actually didn't like it with nothing there, so I just used a dot separator instead...

&middot

http://www.htmlcodetutorial.com/char...amsupp_69.html

[ivar]

Originally Posted by Andy

I actually didn't like it with nothing there, so I just used a dot separator instead...

&middot

http://www.htmlcodetutorial.com/char...amsupp_69.html

Looks good, i like it. You can always go for the classic "laying down pipe" ( - ) or another of the i don't know how many symbols there are.

[Andy]

It only works now for the first of my three feeds boxes on my homepage

www.moonriverphotography.com

anyone got a fix?

[devbobo]

Hey Ivar,

I have modified your code. Read up on using regular expressions, they are much more powerful than having to loop through code multiple times.

Cheers,

David

addEvent(window, "load", rem_pipes);

function rem_pipes () {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str_a = new String(objElement.innerHTML);
         str_a = str_a.replace(/\|/g, '')
         objElement.innerHTML = str_a;
      }
      var objElement = document.getElementById("feeds")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace(/\|/g, '')
         objElement.innerHTML = str_b;
      }
}

[ivar]

thanks David, i need to read up, i know.... I'm stuck in the oldschool stuff from years ago

[Andy]

Neither Devs nor Ivars removes the pipes from box 2 and 3 on the homepage

[ivar]

Originally Posted by Andy

Neither Devs nor Ivars removes the pipes from box 2 and 3 on the homepage

Mine shouldn't work, but dev's should. It works on my site...

[Andy]

I had some dupe JS (user error )
and, I added section for feedHelp

// fix the pesky pipes

addEvent(window, "load", rem_pipes);

function rem_pipes () {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str_a = new String(objElement.innerHTML);
         str_a = str_a.replace(/\|/g, '')
         objElement.innerHTML = str_a;
      }

      var objElement = document.getElementById("allFeeds")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace(/\|/g, '')
         objElement.innerHTML = str_b;
      }
      var objElement = document.getElementById("feedHelp")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace(/\|/g, '')
         objElement.innerHTML = str_b;
      }
}

[ivar]

Originally Posted by Andy

I had some dupe JS (user error )
and, I added section for feedHelp

// fix the pesky pipes

addEvent(window, "load", rem_pipes);

function rem_pipes () {
      var objElement = document.getElementById("footer")
      if (objElement != null) 
      {
         var str_a = new String(objElement.innerHTML);
         str_a = str_a.replace(/\|/g, '')
         objElement.innerHTML = str_a;
      }

      var objElement = document.getElementById("allFeeds")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace(/\|/g, '')
         objElement.innerHTML = str_b;
      }
      var objElement = document.getElementById("feedHelp")
      if (objElement != null) 
      {
         var str_b = new String(objElement.innerHTML);
         str_b = str_b.replace(/\|/g, '')
         objElement.innerHTML = str_b;
      }
}

Devbobo,

Lets see if i understand this correctly. Because all pipes are located in children of #cobrand_footer, can i use the following and still achieve what Andy is getting above?

 addEvent(window, "load", rem_pipes);

function rem_pipes () {
var objElement = document.getElementById("cobrand_footer")
   if (objElement != null) {
      var str = new String(objElement.innerHTML);
      str = str.replace(/\|/g, '')
      objElement.innerHTML = str;
   }
}

will the /g search through all of the children?

[bigwebguy]

Originally Posted by ivar

...will the /g search through all of the children?

sorta kinda...you're on the right track.

/g enables "global" matching. When using the replace() method, specify this modifier to replace all matches, rather than only the first one.

taken from this site: http://www.regular-expressions.info/javascript.html