Thursday, June 5, 2008

How to Paste HTML content in blogspot?

Problem in pasting HTML content in your blog?

This is because all the blogs does not allow to directly use html in their content area due to security reasons.

The area for writing the content in Blogspot is commonly known as What You See Is What You Get (WYSIWYS) editor.

This WYSIWYG editor interprets the pasted HTML as true HTML. It will render exactly whatever you paste in it as HTML. This might spoil the look and feel of your blog.

Why this happens?

Special characters used for HTML language like <,>,",& etc should be treated in special manner.
Example:
 < can be treated as <
 > can be treated as >
 " can be treated as "e;
 & can be treated as &

So writing these special characters in this manner and pasting it in blog can solve your problem. But this may be a tedious task to perform manually.

So here is the solution for it.

Step 1) After making the below code working in .Net 2.0 copy the HTML you want to put in your blog and paste in the text area.

Step 2) Click Encode HTML button.

Step 3) 2nd step will generate the encoded html below the button.

Step 4) Copy the output from 4th step to your blog content (WYSIWYG) editor.


Following sample code converts HTML to Encoded HTML format using Code behind Modal in .Net.

<%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="false" CodeFile="Default.aspx.cs" Inherits="_Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head runat="server">
    <title>Encode HTML</title>
</head>
<body>
    <form id="form1" runat="server">
<div>
           <asp:TextBox ID="txtHTML" runat="server" Columns="75" Rows="10" TextMode="MultiLine"></asp:TextBox>     
           <asp:Button ID="btnEncode" runat="server" Text="Encode HTML" OnClick="btnEncode_Click" />
           <asp:Literal ID="litEncodedHTML" runat="server" Mode="Encode"></asp:Literal></div>
    </form>
</body>
</html>

using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls; 
 
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    { 
 
    } 
 
    protected void btnEncode_Click(object sender, EventArgs e)
    {
        litEncousing System;dedHTML.Text = Server.HtmlEncode(txtHTML.Text.Trim());
    }
} 

Note: Those who are unaware of .Net they can use the same logic with their know language. The main crux here is Server.HtmlEncode() method which transforms the HTML to encoded HTML.

5 comments:

Sandeep said...

no such HTML Encode button available

Dhaval Upadhyaya said...

Hi sandeep. Just copy and past the code given in the above sample and run the page. The page will show a textbox and a button. If still not getting it then let me know so that I will upload the entire example for you.

manish talior said...

i need to get different look in my blog

seenucena404 said...

o

geoge said...

FURY2F http://fnYwlOpd2n9t4Vx6A3lbk.com