I want to make a simple little website, but I'm honestly not quite sure about how to structure the files.
To display a html-page under the link
samplesite.com/test
should I rather use:
main/test/index.html
Or:
main/test.html
Regardless the domain, the web browser will always look for the index.html of your project. So the domain.com/index.html is the way to go.
Answering the question based from the title. For html file structure, it is good to have the index.html on your root/project directory this:
Putting other web assets in different directory will help you to have a better file organization, you can also download some design/templating framework like zurb foundation and check the file structure.
The main page (opening page ) should be index.html coz when you upload it on apache /public_html folder by default it looks for index.html (or php in case you use php) so if your website is www.dummy.com ,by default when you go on it it serves index.html and to get test.html you have to use www.dummy.com/test.html
Related
I was wondering if there is a file format around where I can put (one or multiple) .css and (one or multiple) .html files, for example as a .zip (or similar) file AND your favourite browser can recognize it and opens it as a sort of static local "web page".
My use case would be to create html reports of some program execution, style it with a standardized css file and upload it on a cloud service, such that anyone with access can view it direcly in the browser.
I know a litte about html and css, but not enough to answer this question myself.
And "combine html and css" is not searchable on the web, so I'm asking you.
I'm not looking for a solution which bakes everything into one file.
I'm also not looking for an unzipped version of this (a folder), since that is not uploadable to most cloud storages I am aiming for.
Thank you.
AFAIK, there is no file format for that, but what you can do is create a folder in your htdocs or public folder and add all your .css and .html files in there. Then access it in localhost/yourfolder or if you are using a host http://yourdomain.com/yourfolder. For your HTML files to display the style correctly, they should be linked with the .css files or with the style inside each .html file between <style></style> tags in the <head> section.
You will see something like this, where you and others can preview and navigate through all HTML and CSS files.
Note: I've never done this on a host only on localhost, if you are using a host you will probably need to create permisions to access this folder, in that case contact your host so they can explain.
What do you want exactly?
I have a website in Hugo. However I have a peculiar situation.
Scientists and Electrical Engineers and others may have specific needs. For Eg: Having a single page that shows a simulation. Or in my case using webbluetooth and webusb that I have written from scratch in HTML, CSS and JS. Moreover these pages may be generated by custom scripts. So you can have git submodules inside your hugo site that specifically cater to generating these custom, single page html that you just want to add to your website.
So all I want is to have a menu item or sidebar whatever the existing theme supports, but instead of showing the default html, it should show my custom, hard-coded, already ready and prepared html file - which may as well be an index.html file in a folder with all the necessary contents ready and cooked - something like the _site folder that jekyll creates.
What do you mean by custom html?
I mean it doesn't take the formatting of the hugo theme. It has its own formatting, but because its just a single page in the whole website its not fruitful to have its own layout written in Hugo or maybe its just worth the effort to do that cause you already have it working using some other technology.
What have you done so far and what works?
I am actually coming from a Jekyll background where it's as simple as changing the layout frontmatter and making it nil or even something that doesn't exist at all and jekyll does a great job of showing custom HTML in an existing theme. Tried the same with Hugo but that didn't work.
What are you testing on?
hugo-coder and(or) hugo-academic
Any specific requests?
Ideally I would like to have submodules in my hugo site folder where those submodules generate custom html in known folders and then somehow make a corresponding markdown file in Hugo that is responsible for showing the custom html.
I want to avoid writing the whole html in the markdown itself. But if no other solution is possible then I guess I don't have a choice.
Do let me know if its possible and worthwhile to pursue this and any references that might help.
So I don't know if this is the perfect solution but it somehow works for the moment. I will not accept it as its not perfect and I am waiting for some of the more experienced folks to answer.
I got something working by doing the following -
I had a page built using Jekyll. Jekyll builds the site in a folder called _site.
I copied the _site folder into static folder of Hugo and renamed it correspondingly to CustomHTML OR you could use the flag -d <destination folder> or declare it in the _config.yml file : destination: <destination folder>
Since I am testing it on hugo-acdemic theme, for that I added the following to the config.toml file to show it in the menu -
[[menu.main]]
name = "CustomHTML"
url = "CustomHTML/index.html"
weight = 50
hugo serve And it worked.
Cool thing is that I didn't have to bother about CSS and anything else. Hugo rendered the index.html in _site properly.
EDIT
Looks like the Hugo folks also suggest doing the same way.
I just came up with an idea. Instead of using an .htaccess file to remove .html from the URL, why not just use a simple folder structure and in each folder add an index.html?
For instance:
example.com/index.html → Home
example.com/about/index.html → About
Now simply use a hyperlink on the homepage to the about folder, since typically index.html files are opened automatically.
The upside of this kind of navigation, is that it would be easily possible to create sub pages with no crazy database / .htaccess setup.
Now my question is: is there any reason not to create a webpage like that and is it legitimate to use multiple index.html files?
I appreciate all the help.
With the index.html route, there would be three URL's that can access the same page. For example for an about page:
www.yourwebsite.com/about
www.yourwebsite.com/about/
www.yourwebsite.com/about/index.html
Using the .htaccess file would likely give you more benefit from an SEO perspective. You can tell the search engine which one to use, by using 301 redirects. See more about how Google does this here:
https://webmasters.googleblog.com/2010/04/to-slash-or-not-to-slash.html
Of course you could set up your website using folders and index.html's, and still
use the .htaccess file to take care of the SEO. But, depending on your sites size and structure, this might be more work.
The only downsides would be having to create a folder in addition to a file whenever you want to create a new page, and having to take more time to navigate into a folder in order to edit a page.
As long as you are using Apache, or a similar server software, multiple index files will function normally and be served from each folder.
I want to make a single page HTML site. I have made the template, but I wanted to know how to make it go live on my hosting.
I have tried many things but none of them work, I don't want to use any CMS, just a plain and simple HTML site. I have both a domain and hosting.
If as "template" you mean HTML file than you should name your file as index.html and upload it via FTP to the work directory of your hosting server.
When we launch a website, we usually see webpage name (menu.php or admin.aspx) but I would like to hide that name and show only virtual path or just website name. I don't want it for the first page because I did that with default.aspx but I want to implement it for the whole website.
Showing www.abcd.com/faq/ instead of www.abcd.com/faq/faq.html
Note: My code is not MVC code and server is Apache.
Use .htaccess to rewrite the URL. Millions of tutorials are out there for that ;)
What you are asking is achieved using (for xampp, wamp, lamp or any other apache powered webserver setup) htaccess rewriterules. The rules take the URL and break it into parts that can be modified or used as variables to feed other pages - whilst still keeping the URL you typed. Neat huh!
Showing www.abcd.com/faq/ instead of www.abcd.com/faq/faq.html
call the file placed into the folder faq simply index.html (not faq.html) and then www.abcd.com/faq/
will display the page without the filename. (Make sure, you have defined index.html as a valid Directory index.)
There are more options with using mod_rewrite etc - but since you seem to use a prety static directory based navigation layout, that would be the easiest way.