Is index.html meant to be just the first page among many separate HTML pages, or is it supposed to be the only page, and the other pages are just snippets put inside of it? And by supposed to, I mean, what is the best/most common practice?
I used to think the former, but I just tried using HTML5-Boilerplate and it's setup seemed like it was implying the latter. All this awful meta stuff and imports (is there a term for that?) is in the index.html, and I don't want to have to put that in every single page. Same goes with the navigation bar and the footer which is on every page. And the project structure doesn't have an html folder (obviously I could make my own, but I took it as implying I didn't need one). It sounds ideal if instead of loading a different html page I just leave a placeholder and insert another file, but I don't know how to do that other than an iframe, which would be ugly. How would this approach work, if it is the right way?
If you couldn't tell I'm very much a beginner. I feel like this must be a common question but I don't know what the term(s) for this is, so I've been having trouble searching. Thank you
Many web servers will have a 'default document' that is returned when you specify just a path and no file name. So browsing to http://example.com will return the default document from the document root directory of that domain.
Quite often the default document can be named index.html, index.htm or -if PHP is installed- index.php, but they can be other names as well, depending on the configuration.
Some sites are built up from many actual html files, while other, more dynamic sites usually look like they consist of many html pages, but actually they just have a single entry page (like index.php) that handles all requests and generates output based on the url.
HTML5 Boilerplate (assuming you mean this one) describes a structure for a site. This structure is mostly the build-up of HTML, CSS and JavaScript. The index.html included with it is only a skeleton HTML file. It describes what your output should look like. How that output is generated is up to you. You can create a big folder full of separate HTML files, or a dynamic site with a single entry point, like described above. The HTML5 document, the CSS and all the other front-end stuff are interpreted by the browser, and it doesn't care how that content was generated.
Is index.html meant to be just the first page among many separate HTML
pages, or is it supposed to be the only page... I mean, what is the
best/most common practice?
index.html is best left as the "home page" or "landing page".
When opening your site's root directory in a browser, index.html will be opened by default. If you have no index.html page, you will get a directory listing of all of your files on that server (live or localhost), acting just like a file explorer on your local machine.
All this awful meta stuff and imports (is there a term for that?) is
in the index.html, and I don't want to have to put that in every
single page. Same goes with the navigation bar and the footer which is
on every page.
This doesn't have much to do with the index.html page. If you do not want to have all of your nav, header, footer, scripts, ect. repeated on every page, you will have to use PHP (specifically: includes). Otherwise, if you are using only HTML, you will have to repeat the same information on every page.
The rest of your question goes a little off topic, since explaining index.html does not really go into iframes or any of what you might put into a page.
Many websites use htaccess files to determine which web page in your website acts as a default page. index.html is generally used as the base page in most htaccess files, followed by home.html if index.html cannot be found. Of course, these files and the order can be changed but this is default behavior. Here is an example of how web host ipage orders their .htacess priority:
index.html
index.htm
default.htm
default.html
Default.htm
home.html
home.htm
Home.chtml
Home.html
Home.htm
index.py
index.php
index.shtml
default.shtml
index.php3
index.pl
index.cgi
Related
So, in the WordPress page, I need to link the pdf in wp-contents so I linked it with the relative URL as href="/wp-content/uploads/2017/03/test.pdf"
when I click it since my root in localhost is localhost/test it takes me to localhost/wp-content/uploads/2017/03/test.pdf (which doesn't serve the file). However, I don't think it'll be an issue in the server. Still, I want to know if this is the correct way?
Also, so I'm in page localhost/test/page22 Now on the page, I have an anchor tag as href="/page23" it takes me to page23 correctly, but when I'm in a different sub page say localhost/test/page/page2 now, the link takes me to localhost/test/page/page23 which is not correct as it should be localhost/test/page23. How can I solve these issues
WordPress provides functions for getting the URL of resources you should use these instead of having your code generate the URL. In this case you should call wp_get_attachment_url().
I have a wordpress-driven project and want to add 1 single page to that project, that has entirely nothing to do with wordpress at all, but just consists of plain html - no links from the one to the other; nothing. This page shall be accessible via abc.com/folder while the original wordpress-project is still all over abc.com
What would be the best way to do this? Just add the folder and page, or do I also need to do something on the htaccess-file?
thanks
Just create that folder and name your html index.html inside that folder. This way that html file can be accessed via abc.com/folder
is it possible to create a page outside of the cms?
For example:
I would like to use jquery .load() to load a segment into a current page.
Is it possible to create a html or .ss file somewhere in the theme folder eg: self-contained-page.html so if I then visit www.domain.com/self-contained-paged.html I will be able to visit this page.
While you can of course serve static files, you can also "ajaxify" parts of your page. Not sure if that's what you want to do, but in case someone else is trying to do something similar.
While you could use some fancy tools like pjax or history.js, you can also do it manually. I've recently done this with SS 2.4, but SS 3 should be pretty similar:
In your controller, add a public function so you can access it via /yourpage/load (or whatever you want to call it):
public function load(){
return $this->renderWith(array('AjaxLoad'));
}
In your templates/Layout add a file AjaxLoad.ss.
If you only want to serve that page via your jQuery .load(), simply add the content right inside the file.
If you want to use the piece of content both on your regular page and want to replace it with the ajaxified version, use <% include PageSnippet %> both on the general and the ajaxified page. Then simply define your content in templates/Include/PageSnippet.ss.
You can see it in action at http://www.contentaward.at/content-lab-vienna/608#details (click on the small images at the bottom of the page). Hope this makes it clear.
there is no problem with serving static html files from anywhere in your silverstripe installation, just note to always add the file extension to your urls, as otherwise silverstripe's url routing (using mod_rewrite, see the .htaccess file) will kick in.
also note to always use the full path to the file, so in case you placed your file in 'themes/mytheme/test.html' the url will be 'http://www.domain.com/themes/mytheme/test.html'
You can of course reference a html file in the theme folder just as you would do with a css file, f.e. :
www.domain.com/themes/yourtheme/self-contained-paged.html
If you dont mind to not have it in the theme folder you can also place it into root dir.
Or you can modify your .htaccess and apply some mod_rewrite or redirect rules to point into the theme folder.
If you want to use .ss files you probably have to use CMS pages.
For example I have site http://localhost/site
In IIS I set that 404 error causes redirection to default.aspx
If I type something like http://localhost/site/nodirectory , (there are no such folder) all works perfectly.
But if I only add slah at end http://localhost/site/nodirectory/, page can't display css and images.
Images and css are located in their own folder. I tried different paths: "gfx/logo.gif", "/gfx/logo.gif"
Does anyone have some ideas about that?
If your css and images are relative paths, say ResolveClientUrl("~/gfx/logo.gif") this renders to the client as src="gfx/logo.gif", which the browser with a slash thinks is /nodirectory/gfx/logo.gif instead of just /gfx/logo.gif.
To resolve this, don't use .ResolveClientUrl(), use .ResolveUrl(), this will make the src render src="/gfx/logo.gif" The beginning / makes it definitive, it's that path from the root of the domain.
You'll see this same hebavior if you're doing paths that start with ../ or gfx/ yourself...make them relative to the application base so there's no chance of confusion.
There are a couple of options...
1)
In your HTML page, make the path to CSS and scripts relative...
"/scripts/myscript.js"
Where the scripts folder is the first folder after the root folder
2)
You can add the base tag to your page, which means ALL page resources will be treated as relative to the root location you specify...
<base href="http://www.mysite.com">
More info about these two options.
If you can, option 1 is perhaps a bit cleaner. You know explicitly the resources that you are affecting. Using the base tag will affect ALL relative paths on your page. Images, Links, Scripts, CSS et al. The second option works best if you developed your 404 page assuming it would be in the root folder, but it could actually be referenced from any non-existent directory. You just put your root address in the base tag and it will all behave exactly as you expect.
With either option, the images can be relative to the location of your CSS file.
I am using WebRequest to retrieve a html page from the web and then displaying it using Response.Write.
The resulting page looks different from the original mostly in font and layout.
What could be the possible reasons and how to fix it?
Most probably, the HTML you retrieve contains relative URLs for loading images, stylesheets, scripts. These URLs are not correct for the page as you serve it from your site. You can fix this by converting all of the relative URLs into absolute URLs or by including a BASE tag in the head of the HTML, pointing to the URL of the original page.
Be advised though that deeplinking to images and other resources is considered bad practice. The source site may not like what you are doing.
The reason might be that the original html page contains relative (to the original site) paths to the stylesheet files so when you render the html in your site it cannot find the css.
Does the remote web site include CSS, JavaScript, or images?
If so, are any of the above resources referenced with relative links (i.e.: /javascript/script.js)?
If so, when the browser receives the HTML from your server, the relative links (which were originally relative to the source server) are now relative to your server.
You can fix this by either changing the HTML to use absolute links (i.e.: http://www.server.com/javascript/script.js). This is more complicated than it sounds: you'll need to catch <link href="..."/>, <a href="..."/>, <form action="..."/>, <script src="..."/>, <img src="..."/>, etc.
A more limited solution would be to place the actual resources onto your server in the same structure as they exist on the original server.
The remote site might look at the User-Agent and serve different content based on that.
Also, you should compare the HTML you can retrieve from the remote site, with the HTML you get by visiting the site in a browser. If they are not different, you are probably missing images and/or css and javascript, because of relative paths, as already suggested in another answer.