dcsimg
www.webdeveloper.com
Results 1 to 13 of 13

Thread: Howto hide .html in website address

  1. #1
    Join Date
    Jan 2015
    Posts
    3

    Howto hide .html in website address

    I created first website davidzeplin.com... I am struggled to remove "index.html" or "aboutme.html"

    Most website like yahoo, espn, and others doesn't show "index.html at the end...

    I would hope for:
    davidzeplin.com/
    davidzeplin.com/aboutme/
    and others...

    I tried to remove "text" or "html" in line 5... Still not success... 8-/

    <head>
    <title>Welcome to Zeplin</title>
    <meta name="description" content="website description" />
    <meta name="keywords" content="website keywords, website keywords" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <!-- modernizr enables HTML5 elements and feature detects -->
    <script type="text/javascript" src="js/modv1.js"></script>
    </head>

  2. #2
    Join Date
    Mar 2005
    Location
    Behind you...
    Posts
    1,159
    Okay, so really there are a couple of things to note and more than one way to achieve this.

    Firstly, when you see URLS like "davidzeplin.com/aboutme/", the 'extension' isn't really being removed but rather, the file (page name) itself is being omitted. "But then why does the page load!?" you ask? Because by default, servers are (almost always) configured to load an 'index' file found in a directory when a filename is not specified. So in reality, going to a page like "davidzeplin.com/aboutme/" is actually loading "davidzeplin.com/aboutme/index.html" (or .php). This 'trick' requires no real extra work on your end other than putting an index.html (or .php) file in a folder and then making sure you call the URL without the filename at the end.



    Of course there is yet another way to achieve similar results, and typically this is more common with larger sites like yahoo where there will be a large number of URLs, generally created dynamically (aka blog/article posts). This would be the work of the .htaccess file. Basically the .htaccess file contains some rules that your server uses to handle request for files/pages. Using this file, you can set up rules that can remove file extensions, append a trailing slash or mask a page URL to something entirely different.

    I found a fairly nice little page that explains how to remove the file extension and add a trailing slash here: http://alexcican.com/post/how-to-rem...with-htaccess/
    But I don't want to just post a link and walk away, as sometimes the links die and then another poor soul is later unable to get the solution from this topic. The gist of the solution is that in your .htaccess file (typically found in your root directory. If not, you can create one) would contain the following lines:
    Code:
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^([^/]+)/$ $1.html
    RewriteRule ^([^/]+)/([^/]+)/$ /$1/$2.html
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/)$
    RewriteRule (.*)$ /$1/ [R=301,L]
    That code specifically would remove the extension '.html' and replace it with a slash (/).

  3. #3
    You will have to add the following lines of code to your .htaccess

    Code:
    RewriteEngine On
    
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME}.php -f
    RewriteRule ^(.+?)/?$ $1.php [L]
    
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME}.html -f
    RewriteRule ^(.+?)/?$ $1.html [L]

  4. #4
    Join Date
    Jan 2015
    Location
    India
    Posts
    2
    Create an .htaccess file in your website's root directory with the following content:

    RewriteEngine on
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME}\.html -f
    RewriteRule ^(.*)$ $1.html

    When you've added the above file you can access the following url:

    www.example.com/contactus.html

    by using this url:

    www.example.com/contactus

  5. #5
    Join Date
    Jan 2015
    Posts
    3
    Thanks for quick prompt response!

    Sup3rkirby, I appreciate the link you provided... And seems their site function is not right? or I might not follow instruction...

    However, if I copy & paste and do I need to change "REQUEST_FILENAME" to my file like index.html, aboutme.html.. etc?? Or just leave it and save as .htaccess and put in root directory?

    Thanks again

  6. #6
    Join Date
    Mar 2005
    Location
    Behind you...
    Posts
    1,159
    You're going to want to leave "REQUEST_FILENAME" as is. The server knows to replace this with the webpage being requested/loaded.

  7. #7
    Join Date
    Mar 2012
    Posts
    2,332
    A word of caution: Using a .htaccess file will slow down your server!!! So I'd really not recommend its use for cosmetic purposes (like hiding the file extensions). More info here...

  8. #8
    Join Date
    Jan 2015
    Posts
    3
    I think I didn't clear first time... I just need for public like I am using GoDaddy as web hosting... Will that possible to place .htaccess in it... I tried, but not working...

    As for set up web server at my own with apache2, I have not tried it yet...

  9. #9
    Join Date
    Mar 2005
    Location
    Behind you...
    Posts
    1,159
    The page I linked to mentioned that GoDaddy users needed to also enable MultiViews in order for any of this to work. Try adding this to the first line of your .htaccess file:
    Code:
    Options -MultiViews

  10. #10
    Join Date
    Jan 2015
    Posts
    4
    You can specify a default file to load without showing the file name by using the following command in the .httaccess file

    DirectoryIndex filename.ext

    replace "filename.ext" with the name of the file you want to use.

    By the way you can use this in any directory to specify the default file that will load.

    Do some research on the .htaccess file command options. There are a lot of gems to be found.

    Some web sites also have a function in cpanel or the equivalent that lets you specify a default file name, again without showing what the file name is.

  11. #11
    Join Date
    Jan 2015
    Posts
    5
    You only need to specify a default file to load without displaying the file name then
    replacing "filename.ext" with the name of the file you want to use.

    *** link removed by moderator - last warning - no spam please ***
    Last edited by jedaisoul; 01-24-2015 at 11:58 AM.

  12. #12
    Join Date
    Jan 2015
    Posts
    1
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)\.html$ /$1 [L,R=301]

  13. #13
    Join Date
    Feb 2015
    Posts
    18
    try this

    RewriteCond %{REQUEST_FILENAME}.html -f
    RewriteRule !.*\.html$ %{REQUEST_FILENAME}.html

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles