HTML - Declaring File Locations From Web Root
I'm trying to fix up my code a bit so all the files I'm pointing to are relative to the root of the site. Most of my links used to look something like this (all these link examples came from same file)...
<link href="css/styles.css" type="text/css" rel="stylesheet"> <script src="scripts/jquery.min.js" type="text/javascript"></script> <?php include('includes/header.html');?> <img src="images/maps/pic1.jpg"> The above was fine as long as my site stayed small, with few pages all in same directory. However, bigger projects require pages in different folders, sometimes in subfolders, yet all these pages share certain characteristics - headers, footers, etc. So I need to start specifying links to those files relative to the root. Here are the same examples, but now starting from the root of my site. They all work, except for my includes. <link href=" / css/styles.css" type="text/css" rel="stylesheet"> <script src=" / scripts/jquery.min.js" type="text/javascript"></script> <?php include(' / includes/header.html');?> <img src=" / images/maps/pic1.jpg"> Any idea why the includes won't work? Works fine as long as I don't put that / in there. Similar TutorialsOK, what i need to know is how to access files in different folders on my website... for example i have 2 folders inside of my main folder o Main Folder - Sub folder 1 - Sub folder 2 Inside subfolder 1 is my images Inside subfolder 2 is extra html files... o Main Folder - Sub folder 1 ----- +Tutorial.html - Sub folder 2 ----- +image.png i want Tutorial.html to access the images inside subfolder 2, hwo would i do this? i know how to access an item in a subfolder: <img src="./Tutorial.html/image.png"> but my images and my html file are in different folders and i dont want to copy and paste because i want to update my files altogether.. how do i access the files from a different subfolder? Hey guys, I am trying to insert a picture into a .htm file. However, I want to have my files more organize, so I have put the picture in a seperate folder, inside the folder that the .htm file is in. I used the code that is used to do so, however, when I do so, it shows a broke image file. This is my code: <img src="/images/bob saget.gif" Does anyone have any tips and resolutions to why this isn't working? Thanks, Calum I'm building my first real web site and am running into some problems getting the (simple) site to display properly across different browsers. In Firefox and Chrome everything seems to display normally, but in IE the format appears very different from what it should be: the div for the site information links is way out of place, and the left navigation menu is as well. After discovering doctypes I found that using Strict 4.01 eliminated the inconsistencies across browsers, but broke a lot of my formatting and positioning (in particular, margins). I am currently using Transitional. Any recommendations on what could be done would be appreciated. Through searching I have found numerous references to problems with IE using the box model correctly, but that isn't supposed to apply to IE8/IE9. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <meta name="description" content="PAGE DESCRIPTION!"> <link rel="stylesheet" type="text/css" href="mystyle.css"> <script type="text/javascript" src="myscript.js"></script> <title>Index Page!</title> </head> <body> <div id="container" style="background-color:#abc;"> <div id="header"> <h1 style="margin-bottom:0; text-align:center;">Title</h1> </div> <div id="siteinfo"> <div style="margin:10;background-color:#CCCCCC;"> <ul id="thehoriz" style="text-align:center;"> <li class="siteinfo"><a href="site.htm" class=siteinfo>Site</a></li> <li class="siteinfo"><a href="info.htm" class=siteinfo>Info</a></li> <li class="siteinfo"><a href="goes.htm" class=siteinfo>Goes</a></li> <li class="siteinfo"><a href="here.htm" class=siteinfo>Here</a></li> </ul> </div> </div> <div id="menu" style="float:left;width:200px"> <div style="margin-right:10;padding:10;margin-bottom:30;border-right:5px solid;border-bottom:5px solid;;background-color:#EFC700;"> <b>Section 1</b><br> <ul id="thevert"> <li class="tips"><a href="Page 1.htm" class=tips>Home</a></li> <li class="tips"><a href="Page 2.htm" class=tips>News</a></li> <li class="tips"><a href="Page 3.htm" class=tips>Contact</a></li> <li class="tips"><a href="Page 4.htm" class=tips>About</a></li> </ul> </div> </div> <div id="content" style="background-color:#EEEEEE;margin-right:10;padding:10;border:5px solid"> <p>Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here Content goes here </p> <p>Content goes here</p> <p>Content goes here</p> <p>Content goes here</p> <p>Content goes here</p> <p>Content goes here</p> </div> <div id="footer" style="clear:both;"> <div style="margin-top:30px;background-color:#FFA500;text-align:center;"> <p>Copyright (C) 2011 nothing.com</p> <h4>Footer Sample</h4> Page loaded at Tuesday, 04-Oct-2011 15:00:03 PDT </div> </div> </div> </body> </html> My sticky footer now floats in the middle of the page after i declared a doc type. Any suggestions for a quick fix? doctype: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> HTML Code: <body> <div id="wrap"> <div id="header"></div> <div id="logoimg"></div> <div id="logotext"></div> <div id="searchbox"> <img src="" align="absmiddle" vspace="2px"/> <label for="searchfield">search: area, position, area+position</label><br> <input type="text" name="searchfield" value="" id="searchfield"/> <div id="geist"></div> </div> <div id="main"></div> </div> <div id="footer"></div> Code: body { background-color: #99ccff; background-image: url(http://); background-repeat: repeat-x; overflow: auto; margin: 0; padding: 0; height: 100%; } #wrap{ min-height: 100%; margin-top: -151px; } #footer { margin: auto; width: 100%; height: 100px; /* Height of the footer */ background: #3e4041; border-top: 1px solid #e0e0e0; clear: both; margin-top: 50px; } /*Opera Fix*/ body:before {/* thanks to Maleika (Kohoutec)*/ content:""; height:100%; float:left; width:0; margin-top:-32767px;/* thank you Erik J - negate effect of float*/ margin-bottom: 51px; } h1, h2, p { padding:0 10px; } #outer:after {/* thank you Erik J - instead of using display table for ie8*/ clear:both; display:block; height:1%; content:" "; } How would you make a directory before the root. Apple.com for example if you click on store, it will go to store.apple.com I want to make a feature for iphones on my website, so that if an iphone is viewing it, it will be redirected to mobile.website.com or something like that. I dont know how to make the root before the website =/ How do u specify the root folder in HTML without specifying an absolute address? (e.g. does "..//" mean root folder? I mean, like in ms-dos you could specify ..\\ to go back to the root folder) I'm building a menu by using php includes, e.g.: My index file contains: <?php include ('website/menu/titlelogo.html'); ?> In the titlelogo.html file, there is a link to titlelogo.jpg and lots of other stuff, from the perspective of the index file. It works fine until I change folder. Then of course, the stuff in the titlelogo.html is not from the perspective of the new folder. So I need to specify a root address to get around this. Absolute addresses aren't accepted for php (i.e. by absolute address I mean http://etc.) Please excuse me if I'm not describing this in the right terms. I come from a programming background, I'm only a basic html user. Its breaking my website, and no google searches have helped me find a solution! Anyone know how I can sovle this? Thanks Hi guys, I'm wondering if there is an easy way to provide links or image links to a file in the root directory of my domain. I know there's the "/" method but it will not do for me because I maintain the files offline on my PC, and if I used "/" then it will not refer correctly. Example: Code: <IMG SRC="/example.gif"> This will work 100% of the time when it's uploaded on the web, regardless of which directory the HTML file is at, I will still open the same "example.gif" at the root dir. Perfect. But since I'm maintaining the files offline (before uploading), this causes a problem as I will have numerous "broken links". FYI I even tried to map my folder to a drive (W, or placing the entire file system on a USB drive, but none of those work. I realise I could use Code: <IMG SRC="../../example.gif"> and so on, but shouldn't there be an easier method? Hi gurus, Excuse my rookie question. I am trying to build a small HTML page which has a formula in it . Please see attachement. Its something like: M = nth Root of ABC ----------------------------- - 1 _____________ XYZ I am trying some combinations of and √ but cannot make it work. Is there a way to do it other than using the image tag. THanks, KOn Hello, NVM. solved, delete please. I have a little problem with my server, I know it is EASILY solved, but I don't know how. The pages work fine if they are in ROOT, like index.html in ROOT is fine, but when I make a new HTML in a subfolder, ROOT/folder/index.php All the coding messes up and cannot load the files from the root. E.G: My CSS is in my root, cssmovietick.css, this works fine for the php files in the root, but when I go into the sub folder, it cannot find it. Here is the code to find the CSS. Quote: <link href="cssmovietick.css" rel="stylesheet" type="text/css" /> I'm pretty sure you understand Hi all, Sorry for such an elementary question but up until now I have always used ../ for my references. So I don't have to duplicate code I decided to use ~/ for some referenced links and it doesn't seem to work. Get 404 on the requests. Ok.. what am I missing? Much thanks! s-one I am working on an ebook site and must provide it to a service that hosts ebooks and does marketing and other things for their clients beyond simply hosting. They have given me an instruction that I don't know what it means, and when I try it, it breaks my ability to preview the work I'm doing. I can only assume that whatever they're doing really needs it to be this way and that it won't truly be broken in their database. Btw, I'm building the individual pages and their database is linking the pages in the prev/next buttons. Here's the instruction: Make sure to label any links or images in a global, root-based manner, since once it's called on from within another folder the links will be broken if you do not. Example: img src="static/contact.jpg" SHOULD BE img src="/static/contact.jpg" What does it mean? Do I need to take any precautions not mentioned here? Sorry but any question I ask them just seems to baffle them and makes me wish I had never asked it. Thanks, Gary Hey. I was wondering if this php code can be put into html? HTML Code: include($phpbb_root_path . 'PATH' . $phpEx); Or is there some other html code with does that same job? So here's the sitch: Our website, Watershedpdx.com, works from its outside IP address UNLESS you are inside our local area network. It's a Comcast issue, and their router seems unable to rout internal requests for our own IP from the internal and around to the router. I know I could modify the .hosts file on every computer and such, but for now, I've opted for a slightly different solution: If I'm inside the building, I check our own website with it's local IP: http://10.1.10.197 Now, the issue comes up because I'm streaming video to the web at http://10.1.10.197:8079 and http://10.1.10.197:8078 Is there a way to reference this in the code without the IP address? For this to be visible to the internet, I link it in the code as http://watershedpdx.com:8078 - but then the computers in the building can't see it. Is there a reference like http://..:8078 that would work? Hi, I'm running a personal server on my PC and have an image gallery script that serves up files outside of the root directory. I am trying to add image tags to folders on my hard drive and it will not display. If I go to the address directly, it shows up fine. Here's what I'm working with: <img src='file:///media/sda3/pic/toronto/beach000.jpg'> shows nothing but going to the address does. Anybody know what to do? Hi all, I am trying to get the faveicon on my webpage. I have read some places that IE needs the image to be in the root folder of the web server. Is this true? Has anyone got it to work with the image in a different folder? The reason I ask is because I have some trouble accessing files in the root folder. If it is possible not to use it I would prefer to. Thanks in advance for any help, Jehan Wicked simple question: I have three images located in my "images folder" My Top level looks like this -images- (folder) -party- (folder) index.html In my "party" folder I have a page called "events.html" and I need to know how to call an image in my "events.html" located on the top level folder "image" I know if i move the event.htmls to the top level I could call it by this: <img src="/images/picture1.gif"> However I DONT want to move the events.html, so how do I call the image? O and I am not looking for the answer : put the "http://www.sitename.com/images/" in the image tag ANY HELP THANKS!!!!! Hi all, I have a query that I hope somebody can help with as my site has been brought to a standstill because of this problem. I have just posted the new version of my site online and I have a folder below the domain root which contains things like database info, form scripts etc. When I process the form I get a 404 error. the action is something like HTML Code: action="../includes/process_form.php" There is no need to any output from these files as they process the information and direct to the relevant files above the domain root using php header scripts. At the beginning of most of my files I have the following PHP Code: <?php $security = 'secure'; require('../includes/default.php'); require('../includes/error_handlers.php'); require('../includes/db.php'); ?> and there is no problem with these whatsoever. I had all of the scripts working fine when I tested them at domainroot.co.uk/take2/public/ domainroot.co.uk/take2/includes/ Does anybody have any ideas why this is happening Any help would be appreciated John The following common code is not working in Firefox (3.0.11). It works in Safari (4.02) and IE7. When I say not working, I mean that when I click the submit button, the address does not change to the form processing url: Code: <!-- The data encoding type, enctype, MUST be specified as below --> <form enctype="multipart/form-data" action="uploader.php" method="POST"> <!-- MAX_FILE_SIZE must precede the file input field --> <input type="hidden" name="MAX_FILE_SIZE" value="30000" /> <!-- Name of input element determines name in $_FILES array --> Send this file: <input name="mp3file" type="file" /> <input type="submit" name="submit" value="Send File" /> </form> The file uploader.php does nothing, it is blank, I'm merely trying to establish communication. Once again, the code functions in IE and Safari so I dont think this is PHP related. I have a project written in ASP.NET under Visual Studio 2005 with C#. I am also using Infragistics objects for .NET Advantage 2007. In my page to attach resources to a record I have written a browser and am displaying previously chosen resources here. But when I click the upload button the page opens a new window (which is not a dialog window, but a normal one) which is exactly the same as my dialog window. How can this possibly happen? Can anyone help me? |