I was wondering wether there is a way to include some html content inside another html using only html?
A replacement to PHP's
<?php include("file.php"); ?>
Is this possible?
EDIT:
This has brought up some confusion, what I needed was "almost an html tag" that had the functionality of including a html document in another.
Have you tried:
<object type="text/html" data="file.html"></object>
It cannot be done purely by HTML. (There are iframes, however, but I don't think that qualifies in this case.)
It can be done using JavaScript. You get the other file via Ajax, and place its contents inside an HTML element on the current page.
Shameless plug of a library that I wrote the solve this.
https://github.com/LexmarkWeb/csi.js
<div data-include="/path/to/include.html"></div>
The above will take the contents of /path/to/include.html and replace the div with it.
HTML does not have a feature to include additional content natively. However most web servers do have server-side include statements:
SSI in Apache
SSI in IIS
the only thing would be an iframe which is pure html. but you also can use javascript to get the page via ajax and include it into your dom hirarchy
Yes there is but you need to enable it in your config or .htaccess:
Options +Includes
AddType text/html .shtml
AddHandler server-parsed .shtml
Of course with that youd need to rename any file doing the including to .shtml... or you could jsut use:
Options +Includes
AddType text/html .html
AddHandler server-parsed .html
the syntax itself is similar to comment:
<!--#include virtual="/footer.html" -->
There's no such thing. You'd have to use a server-side scripting language or JavaScript to do something like this.
If you're using Apache, you can try Server Side Includes.
This might be a few years late but this is how i did it !
in the first line after put this line !
<SCRIPT LANGUAGE="JavaScript" src="http://yourdomain.com/header.js">
then create a file called "header.js" and enter the content of the file you want to include !
like so....
<!-- Begin
document.write('<center>');
document.write('a link 1');
document.write('a link 1');
document.write('a link 1');
document.write('a link 1');
document.write('<hr>');
document.write('</center>');
// End -->
Hope this help !
Almost 10 years later, some people may still have doubts about this. So I'm going to explain a simple solution that we have today in 2020.
I always use the jquery .load() function and never had a problem with that.
Exemple: ( "#content" ).load( "includes/menu.html" );
The lack of Include\Import in Html is really frustrating!
A good alternative is "Server Side Includes (SSI)" in case "PHP" is not supported!
SSI is supported by almost any (if not all) web host server!
<!--#include virtual="layout.html" -->
The file that contains the above line must end with ".shtml" or ".shtm" extensions!
It's really annoying that something as easy as Include\Import can't be performed by the browser itself!
Like php or Node.js, preprocessing the html using Javascript itself before the HTML Load process start should be supported in any browser!
Now in 2022 I use Vanilla Javascript fetch().
This is how to include
file: "newfile.html" into
div: "container"
// HTML
<div id="container"></div>
// JS
const loadHtmlFile = (fileName, containerId) => {
fetch(fileName).then(function (response) {
return response.text();
}).then(function (html) {
containerId.innerHTML = html;
}).catch(function (err) {
console.warn('Something went wrong.', err);
});
}
loadHtmlFile("newfile.html", container)
Related
I've got this javascript code:
$(document)
.load(function(){
$.post(
'result_source.php?term='+<?php echo $_REQUEST['term']; ?>
);alert('abc123');
});
and it doesn't alert('abc123');. If I remove the
+<?php echo $_REQUEST['term']; ?>
it does alert('abc123').
Thanks
You need to take the PHP part out of the concatenation. The PHP is effectively pasted in to the javascript page before it is processed, so unless your $_REQUEST['term'] is the name of a javascript variable you are using, it will cause errors.
Change it to: $(document).load(function(){$.post('result_source.php?term=<?php echo $_REQUEST['term']; ?>');alert('abc123');});
Bear in mind this won't work inside external javascript files, unless you create an .htaccess or something to configure the server so it parses .js files as PHP before outputting to the browser
PHP will not run in an external JavaScript file unless you create a .htaccess file or configure the server so it parses .js files as PHP before outputting to the browser.
If you put that in a file(with a .php extension), in <script> tags, it will work, though.
I have an HTML file that has a rather long navigation menu inside of it. I want to take that menu out of the HTML and place it into an external PHP page and then call it with
<?php include 'navigation.php'; ?> in the HTML file.
I have tried just adding this into the HTML file but it doesn't display anything as well as no errors on the page.
What do I need to do (if it's even possible) to keep the files HTML and use the php require function?
Add this in in your httpd.conf and then you can process PHP code on HTML pages
AddHandler application/x-httpd-php .php .html
Q: Did you give the page a .php suffix? That should be all you need to do.
Remember the way PHP works - you basically "embed" your PHP code in an HTML page, and the server executes the PHP before it serves (the rest of) the HTML.
But in order for PHP to "see" your code, you need to make sure your "HTML page" has a .php suffix.
As a crude workaround, you can add ".html" to the list of file suffixes that PHP will parse.
But this could cause other things to break.
If you want to embed PHP code in your "index.html", the best, cleanest approach is to simply rename it "index.php".
IMHO...
I have some php variables that need to be used in javascript. Instead of passing vars back and forth using ajax, I chose to parse js files as php. Here's a simple example of what I did:
#.htaccess
AddType application/x-httpd-php .js
//scripts.js
//or for security reason, I could just use scripts.php and add header at the top)
header("Content-type: text/javascript");
alert("Hello <?php echo $_SESSION['username']; ?>");
I'v been using this method for a while, and I haven't noticed any obvious problems.
Are there any side effects doing things this way? Thanks.
I can't see any problem with this, but an easier solution for me was:
<script type="text/javascript">
var username = "<?=$_SESSION["username"]?>";
</script>
in the head-Zone of the template or index.
I'd like to input some code, for example a menu in HTML from another file so that I can edit that menu and then all the menus for all the sites would change as they'd be linked to that page. Is there a way to do so without making all the pages .php?
Server side includes are going to be the best way to do this, but if that's really not an option you could do it with JavaScript - load the contents of another file using AJAX when the first page loads, and insert that content into a specified element on the first page.
For example (using jQuery, because it's simpler to write out here):
$.get('page2.html', function(data) { $('#whereToPutContent').html(data); });
You don't need to make all the pages in php. As long as the page you're going to include doesn't have php code, it can be pure html, or txt, or whatever.
The include HAS to be in a php page, that's all.
So, in your PHP page, just use include (or require) and you're set. For example:
<?php
include ('menu.html');
?>
Yes, it's possible with frames or AJAX (use <script src>). However, frames are deprecated and AJAX is only reliable if the browser has JavaScript enabled.
So PHP is the (only) solution here. Here are the four possibilities:
<?php
include 'menu.html';
require 'menu.html';
include_once 'menu.html';
require_once 'menu.html';
?>
You probably want to use include_once for a menu so that it is only include one time. Or if you are sure that it is only included one time you can just use include. require stops the script if it can't find the file, so that's probably not what you want.
You may use server-side includes (SSI):
include ./includes/include.html
or
include ./includes/include.ssi
or
include ./includes/include.shtml
iframes:
<iframe src="http://website.com/index.html">
<p>Your browser does not support iframes.</p>
</iframe>
or javascript (AJAX):
STEP 1: add code to html file
<script language="JavaScript" SRC="http://yourwebsite.com/js/file.js"></script>
STEP 2: configure [apache] server by adding to .htaccess file. Add this line:
AddType application/x-javascript .js
The pages including the menu page would have to be PHP yes, the menu page itself doesn't have to be. For this you can use: include()
include './file.html';
you can dynamically display menus (or whatever) with JavaScript.
I am using a WP template that allows me to incorporate arbitrary HTML. Unfortunately, I have to use this particular widget and can't use other WP widgets.
I have on my webserver /some/path/serve_image.php that spits out a random HREF'd IMG SRC with a caption and some other info from a MySQL query.
Now...how can I say "take that output and treat it as HTML"? If I just put "/some/path/serve_image.php" I get that literal string.
I tried:
<script type="javascript" src="/some/path/serve_image.php"></script>
but that didn't work. I tried changing everything in serve_image.php to be document.write() calls and that didn't seem to work either. I'm not the world's greatest JS guy...
So if I have a URL on the net that spits out some HTML and I want to include that HTML in my web page, what's the best way to do that? Sort of like what Google does with Adsense - you source their show_ads.js.
Why no? Add
header('Content-Type: application/javascript');
And output JavaScript Like:
echo("var image = \"".$images[array_rand($images)]."\";");
echo("$('img.randim').attr('src', image);
No. JavaScript and PHP are two completely separate languages. In fact, if it was JavaScript, you aren't even loading it the right way.
<script type="text/javascript"></script>
The way you're trying to do it would throw a parse error, because it would try to use the PHP as JavaScript. Some browsers would even reject it, because PHP files have a text/html MIME type, while JavaScript should be application/javascript.
PHP has to be done server side, so loading it in the client just doesn't work.
What I think you're after is this:
<?php
require('/some/path/serve_image.php');
?>
Just place that wherever you want the image to be.