Most of the web applications will not let you use HTML as form input for security reasons. And this is why BlogEngine has BBCode extension - to provide you with ability to define which HTML tags you want visitors be able to use. But it has it's own limitations and can't handle some of the HTML tags without little overhead. For example, I wanted to let visitors to use images in their comments, so I went to extension manager/BBCode and defined [img] code. Problem here is that image tag has specific syntax and BBCode does not set to handle it. I had to modify Parse method to process image tag properly. All I did is added a check to see if code is "img" and, if it is, I use custom parsing. Otherwise BBCode uses default code processing.

if (code == "img")
{
  string regex = @"\[img\].*\[/img\]";
  MatchCollection matches = Regex.Matches(body, regex);
 
  if (matches.Count > 0)
  {
    foreach (Match match in matches)
    {
      string imgSrc = match.Value.Replace(""").Replace("" />", "").Trim();
      string imgTag = string.Format("<img title=\"\" src=\"{0}\" />", imgSrc);
      body = body.Replace(match.Value, imgTag);
    }
  }
}
else ...

One more thing. Because visitors can not upload images to the site, all images suppose to be on the internet and have "http:" or "www" in the source path. And BlogEngine has "ResolveLinks" extension that will automatically turn everything with "http:", "www" etc. into the hyperlinks in the comments. That is great, but obviously I need to ask this extension leave alone my images.

if (e.Body.Contains("src=\"" + match.Value) || e.Body.Contains("[img]" + match.Value))
  continue;

With this taken care of, everything seems to be working just fine. Now if you want to illustrate your point with image in the comment, just type in path to the image, select it and click BBCode "img" button.

BBCode.zip (2.72 kb)

Share/Save/Bookmark
Signature

Comments

1/30/2008 9:47:43 PM #

rtur

http://rtur.net/darkblog/image.axd?picture=katuberling.png

This is an example of the image you can use in your comments. Just copy or type in a path to your image file, select it and click "img" button (on the right and just above input box)

rtur |

1/31/2008 4:04:57 AM #

Cristiano

Good work!

IMHO there is a aproblem: to give the possibility to the users of "insert" images in the web page is a risk. If the images contains malicious code ? What do you think ?

Cristiano |

1/31/2008 9:32:11 AM #

rtur.net

IMHO there is a aproblem: to give the possibility to the users of "insert" images in the web page is a risk. If the images contains malicious code ? What do you think ?

Yes, there is certain risk involved and this is why it will never be a part of core BlogEngine code.
I might consider adding some validation though, for example pinging image path making sure it exists etc...

rtur.net |

3/31/2008 5:32:29 PM #

Lucas

http://artegami.com/wp-content/uploads/2007/05/optimisim.jpg

Lucas |

3/31/2008 5:35:02 PM #

Lucas

hola

Lucas |

9/18/2008 12:03:02 AM #

Test

http://rtur.net/darkblog/image.axd?picture=katuberling.png

Test |

11/11/2008 8:01:02 AM #

jordi

kjdhksgdkhsd

jordi |

3/17/2009 12:33:01 AM #

Slim Fit Blog

its more unique to see people who's slight making the comment

Slim Fit Blog |

Comments are closed