I am trying to display a "preview" of an HTML email. I have the HTML in my database and now I need to render it in an iframe, or popup window or something. I am trying to inject the html into a div tag on the page, but it won't display anything. Here is the problem I am running into (I have nested HTML tags):
<html>
<body>
<h1>My page</h1>
<div id="email-body">
<html>
<body>
<p>email</p>
</body>
</html>
</div>
</body>
</html>
You can write HTML to a popup window.
var preview = window.open("", /* options */);
preview.document.write(html);
preview.document.close();
But like me, many dislike popup windows. Another consideration is to just display only the <body> contents. Even better, most mail clients just supports it. With a content type of text/html, you can send a HTML mail as if it is going to be part of a HTML <body>.
<p>email</p>
This way you can for preview just inject it in some div in the main page the usual way.
If you like to style elements, but dislike inline styles, you can also add <style> element. Most of those mail clients also just supports it.
<style>p { font-family: arial, sans-serif; }</style>
<p>email</p>
From HTML purist's view this is indeed syntactically invalid. But it works (also in webbrowsers!) and eases the stuff a lot up.
Assuming that the markup looks exactly like you showed in your post, you could just strip the tags out like this (run this on the email field after you get it from your db):
$email = preg_replace('/\<\/?(html|body)\>/', '', $email);
This will leave you just the body content of the email. This will work as long as the email doesn't have anything in between <html> and <body>, such as a <head> section.
That won't work because you can't have two HTML structures in a document.
The only way to do this that I can see is using an iframe.
Related
I have a static html document with an iframe in its html code as this
<iframe src="http://192.168.1.1/test.php"></iframe>
and test.php simply echoes a line of text:
<?php
echo '
<div class="notice">
Welcome My friend
</div>';
?>
What's strange however is that the iframe loads redundant code which I didn't add and which breaks the final DOM with a nested element:
<html>
<head>
</head>
<body>
<div class="login">...</div>
</body>
</html>
How can I avoid this extra unrequested html from being generated?
Iframe is used to embed another document within the current HTML document. So it is normal behavior of iframe tag. And you cannot handle [using CSS] or modify html code which rendered from iframe. So may be that causes your page is breaking.
I'm trying to use the following code to replace <body> tag from page with <body id="khanqah">
echo str_replace("%body%", "khanqah", "<body id='%body%'>");
It does adds <body id="khanqah"> to the page but the actual <body> tag still presents. I mean there are two body tags now, one <body> and the other <body id="khanqah">
Also the <body id="khanqah"> tag is adding at the top of page, see this: http://i.imgur.com/6zYWTv8.jpg (screenshot of page source)
Is there any way I can work around?
It's not really replacing anything in the HTML, it's just echoing the return value of str_replace("%body%", "khanqah", "<body id='%body%'>") which happens to be the string <body id="khanqah">.
You can only replace the HTML's body element with PHP if you are outputting the HTML with PHP (changing it before outputting it). PHP works server-side, so once the HTML reaches the client it cannot modify it.
You can use JavaScript, which works client-side, to do this.
To change the id of the body dynamically using jQuery (which is the easiest way), you can do
$('body').attr('id', 'khanqah');
I want to send the actual page by email, i can send it the problem is that when i open the mail the html dont have the css is obviously but how i can make that look seems the browser?
First I set in a hiddein input the html of the page:
var codigo = $("body").html();
$("#codigohtml").val(codigo);
And then i take it by selector .val() and put this in the message of the email i put the type of the mail to html.. the problem is with the css.
Thanks for your time!
Rather than having a separate CSS stylesheet, just put your CSS directly in your head tag:
<head>
<style>
/* CSS goes here */
</style>
</head>
<body>
<!-- Rest of email -->
</body>
I have a possible stupid question, but I'll ask it anyway.
Does it matter what goes first, PHP or HTML code?
For example: Does PHP go before HTML, after HTML or does it matter at all?
<?php
echo "This is text";
?>
<html>
<head>
</head>
<body>
<center>
<font size="2">This is text</font>
</center>
</body>
</html>
Or:
<html>
<head>
</head>
<body>
<center>
<font size="2">This is text</font>
</center>
</body>
</html>
<?php
echo "This is text";
?>
Or:
<html>
<head>
</head>
<body>
<?php
echo "This is text";
?>
</body>
</html>
The third one is the correct way (assuming you want the text to echo out in the body).
PHP can jump in and out of HTML as you have shown above.
<html>
<head>
</head>
<body>
<center>
<font size="2"><?php echo "This is text"; ?></font>
</center>
</body>
</html>
Personally I put the PHP as much as possible at the top of the page or even better outside the html page completely by using the html pages as purely views in the MVC pattern.
HTML doesn't go anywhere, but PHP script goes to server executes and response is returned to client side. Now that response is displayed/handled along with HTML code. HTML is only for browser where PHP script is used invoke service or do operations on database.
So, first PHP(Server) and then HTML(Client).
Add your php code before the html code.
This allows you to change the out type, set requied variables, add http response headers if you require, etc.
You can have a lot of php embeded tags in between the html.
The html in your question would be invalid, if you echoed output before or after .
Make sure your out is valid html.
Don't be bad to the browser just cause they will try to work with whatever you give them.
Onlything you have to maintain valid html structure. so you canot put anything outside the html tag. so third option is the most valid thing. but if you use any of others, it will print anything you want.
Not being a php person, will try to ans this in general sense. HTML is for browsers and php is serverside. When your pages reaches to the browser, there is only HTML, while, if I am not wrong as php should behave similarly yo jsp, at serverside html is seen as simple strings that need to be printed out at stream. So ideally, this should not matter what come first.
From good practice perspective, as this is php code(in my case jsp) whose output will be html, I try to give more feel of java to my code file.
Im trying to find a way to display the title of the generated page in the body as text.
I have tried using the following code to display the title.
<script type="text/javascript">
document.write('You have visited the page ' + document.title );
</script>
Although the code does what i want, i think that i must use another way to do it, more SEO friendly! When i open the page and check the code, i see this code and not the result of (document.title).
Add the title to the server-side script that generates this page. You'll need to post some of your server-side code to get a more specific answer. In general:
<?php
$title = "My Page"
echo <<<EOT
<html>
<head>
<title>$title</title>
</head>
<body>
You have visited the page $title
</body>
</html>
EOT
?>
Javascript does not affect the source code of the page. It gets rendered after the page loads and you see the result. Use PHP for sorting like this.
Any client side generated html isn't going to appear in the source. You need to do it server side, in PHP or whatever, if you want it in the source.