Hiding .html extension in links - html

Say I have a link like this on public_html/index.html:
Link to picture
Since the "link to picture" has its own folder and uses index.html, normally that extension would be hidden if I type in "www.mywebsite.com/pictures". But if I first go to "www.mywebsite.com", then click that link, it would display in the address bar as "www.mywebsite.com/pictures/index.html". How would I hide the "index.html" in links? I've tried this but it doesn't work:
Link to picture <---this simply opens the file directory
Thanks.

Add the following to your httpd.conf file:
DirectoryIndex index.html
And by default if you don't pass in a filename index.html gets rendered instead of the directory content

Related

Is there a way to make directory listings open in new tabs?

If I have a site that has a directory listing, such as this one, can I modify it to open in new tabs by default when someone clicks on a file or folder? Does this relate to the .htaccess file?
Take this link for example. OJI/
Add attribute target="_blank", and you'll get OJI/. Now, click the modified link will do.
So I found out that first you need to specify a header file in .htaccess:
HeaderName header.html
Then you need to place a "header.html" in the directory, and put this line in the file:
<base target="_blank">
Now every file in that directory will open in a new tab

Html File path to subfolder

Using atom code editor I have a folder "login". I also have a subfolder "register".
I can access the login.html in my browser from a button on the index.html. However, once I am on the login.html, I can not get to register.html
Once I try to access the register page from a button on my login page in my browser I am given the following:
/myproject/Login/Login/Register/register.html
If I remove one of the /login I am given the page I want. Not sure why my file path is not directly working from the button on my login.html
<a class="txt2" href="Login/Register/register.html">
I had to change to
<a class="txt2" href="../Login/Register/register.html">

Setting a button in html

How do I set up a link button in html?
I want to set a button from the homepage so that user may be viewed by a log in screen. I have two index.html files, one for the homepage, and one for the login screen. How do I set it so when users click on log in they will be presented with the login screen.
I tried <li>Sign Up/lOG IN</li>.
My goal was to use href= location of index.html.
When I click the link it takes me to an error page. The top link would be the address to the index file that has the login html.
You don't have .html on your url. Try:
<li>Sign Up/lOG IN</li>
Also, you are using a relative link, so the position of the file where you have this link is important. Right now it will look one directory up for a file named index.html. If the file with the link is foo.html make sure in the same folder you have a folder named login that has a file named index.html.

Linking from a subfolder back to the root folder index.html file

I am having trouble linking from a subfolder index file back to my root folder index file.
I have a logo in the nav bar of example.com/blog that I would like to have link back to example.com
I have tested various linking options for the logo image including
<a href="../index.html">
<a href="http://www.example.com">
<a href="../">
And none of them seem to work. The logo image continues to link to example.com/blog/index.html
The strange thing is that if I right click on the image and then select open in a new window/tab, then it will load example.com just fine.
I am at a complete loss.
Could this be something related to my .htaccess file?
Additional Info
I added a "Home" text link to the nav bar using the below syntax and it works perfectly.
Home
The image for some reason will not link back to the rootfolder index.html file using the same syntax. It keeps loading http://www.example.com/blog/index.html
Try using a javascript redirect
function home() {
window.location.replace("http://example.com");
}
<button onclick="home()">hi</button>
Replace http://example.com with your website.

how to display first page in localhost?

I am using Xamp to create a website, I am having a folder named HTML which has a page called Cart.html, the folder HTML is found in htdocs and I want Cart.html to appear as soon as localhost is being input in the browser. That is when I input http:// localhost/, the Cart.html page should appear. I am unable to do, can u suggest me how to do it.
Simple HTACCESS rule:
Redirect 301 index.html Cart.html
Assuming they are in the same folder, otherwise replace with whatever needed
Rename the cart.html to index.html & put it in htdocs as 'htdocs/index.html'
You can create a .htaccess file with the following contents. The only problem here is that any sub folder will look for "Cart.html" as its default page
DirectoryIndex Cart.html
If you do not need the index.html file at all, I recommend deleting it and putting this DirectoryIndex instead
DirectoryIndex index.html Cart.html
This will cause all folders to look for "index.html" first and if it doesn't exist it will use "Cart.html"