we are using LC ES4, does anyone have idea how we can integrate the XDP with a website and display them as HTML pages, rather as pdf previews.
You can folow https://helpx.adobe.com/aem-forms/6-1/preview-xdp-forms-html.html by the by right place to post this query is http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/aem-forms.html
I don't think preview from Designer is the question you're asking. To render an HTML version of an XDP from your website you have a couple of options, there is a forms portal you can use from your site, another option is to simply point to a URL to render the template. To get an example of the URL use Form Manager to preview the form and this will give you an appropriate URL sample.