Always get the correct directory - html

I know this is a noob question, but I haven't really encountered this yet or have dealt with it using .NET's RelativeUrl(). I just modified the directory structure of some flat HTML files and everything is broken. Of course I know why and how to fix it, but I was wondering if there was a failsafe, non-backend solution to always getting the correct path for your assets (img, script, css, etc)
Right now I know I'm going to have to do "../../[directory]/[file]" but I was hoping there was something easier that I just haven't come across.
Thanks

Have you come across root-relative paths? Basically they're paths that are, obviously I suppose, relative to the root of the website, of the form:
/directoryName/fileName.html
Further information: http://www.motive.co.nz/glossary/linking.php

you can simply go from the root folder everytime by putting a "/" before your path
e.g.
<img src='/images/image.jpg' />

Related

Html directory link not working if the directory is not from the beginning

My problem is that I have a bunch of HTML files but in simple I have public_html/pages folder + index.html/under pages folder a dmca.html is located.
So when I want to locate the file using href = "pages/dmca.html" it doesn't work and on another side when I use "../../public_html/pages/dmca.html" from the beginning it works is it normal or something wrong so I can only use the simple way as I have mentioned above(the link)
You have to look where is the .html file located on the hierarchy. If you are in dmca.html and you have a href on that page to second.html, you will need to jump backwards to the pages directory, and then go to the file: ../second.html
Now, if you are in index.html, and you have a href linking to dmca.html, you will need to hop back one level, enter pages directory, and choose the .html file. So it would be like this: ../pages/dmca.html
-public_html
|
|--index.html
|--pages
|--dmca.html
|--second.html
If I have not explained myself correctly, or I've understood the question wrong, please tell me.
What is happening, if I understand the problem properly, is that you are in index.html, and you want to href dmca.html, but the route you use pages/dmca.html, doesn't work, but if you use ../../public_html/pages/dmca.html, then, it does work. And I guess you are asking why is this happening.
Well, what happens when you use pages/dmca.html is that you are saying: search for a subdirectory called 'pages' and go to the file inside it called dmca.html. This would be correct if you had this hierarchy:
-public_html
|
|--index.html
|--pages
|--dmca.html
|--second.html
But index.html is a file, so it can't contain subdirectories. That's why you have to go one level up the hierarchy, and then, once you are in public_html/ you can choose to load index.html or go to the subdirectory public_html/pages and choose a file from it.
Right now I'm working on my web page, and... rethinking about it, I have to say that you were right, I mean, what you were doing was supposed to work.
Look at my directories. I have a htdocs folder, inside it I have some .png, index.html, and a folder called "prova", inside the folder "prova" I have index2. You can see that it is the same case as yours. I have an href on index.html that says href="prova/index2.html" and it works for me. Actually what I've said to you on the morning is wrong. I'm sorry :/
Because if I write ../prova/inedx2.html what happens is that the folder "htdocs" is removed from the URL. Remaining as: "PortàtilHP_antic_pare/prova/index2.html" You can see that the folder between "PortàtilHP_antic_pare" and "prova", which should be "htdocs", has disappeared.
So now I'm wondering how my answer has been useful for you. I guess I have understand it wrong, and somehow, my answer has made you change something that somehow has worked.

can't load svg from filepath in json file

I'm trying to load SVG image from JSON file that contains a path like this -
<img src="../images/filename.svg"/>
and the image doesn't load.
When i try to do this it works-
<img src="/static/media/filename.9f72c13b.svg"/>
What is the difference? Why does the second work and the first doesn't ?
Is there a way to change all of the first paths to be like the second?
Thank you!
../ in a path means one level up from the current folder. So your first path is a relative path, and the second one is an absolute path. Besides, those are pointing to 2 different file-names (filename.svg and filename.9f72c13b.svg). First, you need to figure out to which file you want to refer, and then make sure it's present in that your specified location.
Is there a way to change all of the first paths to be like the second?
Yes, you can just use a simple text-replacing feature of your text-editor, say for example notepad++ which can do replace text with regular expressions and in multiple files simultaneously.
A note about the 'current directory': it's a bad idea to rely on assumptions about it, because on some platforms it may not be what you want, or it may even change from version to version.

cPanel not updating the css file

I have been getting this weird problem where, when I upload a new CSS file to the public_html folder in cPanel, it is not updating on the website.
Whats really weird about it was that I uploaded the entire website again. Every html file, every folder, everything. And when I checked the CSS file it was the updated version, but the browser was somehow reading the old one.
To fix this issue I had to change the name of the CSS file (in all of the html files too because without it they were still using the old one even tho it was nowhere in the folder) and re upload the whole website again.
So, am I missing something here? Is this supposed to happen? Or is this actually weird and shouldn't happen at all?
I've also run into this problem. It seems to be a caching issue. Trying this person's trick is how I narrowed it down to being a caching issue:
https://www.sitepoint.com/community/t/css-html-files-updating-on-cpanel-but-not-on-website/271683/5
Smells like cache to me.
If your recent changes are NOT there, then play a trick on the URL by changing the path a little. For example if the path was /themes/mytheme/assets/custom.css or whatever it is, change the version and do something like /themes/mythemes/assets/custom.css?v=1234567
By changing the URL in this way, it would bypass any kind of cache that would be looking for the previous URL. In other words, you should now see your correct CSS file.

Bootstrap CSS & JSP

hope you're doing fine.
I am currently stuck with my Web App project. This is the context: I would like to code a Web App using J2E. There's a free template that I liked and thus I decided to download it. When starting to use it I notice the CSS isn't applied.
Instead of having this, I have this:
However I do not see where the error is. The CSS & Bootstrap files should be visible in the JSP file and IntelliJ recognizes them. However I can't display these files (whether css or even pictures) that are referenced in "href".
Here's the project structure and code, maybe something's wrong there.
I'm used to HTML and to my understanding JSP isn't too different. Are the referencings different though?
Thanks in advance for any help you'll give,
Fares
YES.
Found the answer. Put resources in different folder than WEB-INF.
I believe that, your HTML file is inside the WEB-INF folder, for the to work either remove the WEB-INF path
<link href='style/stylesheet.css'>
or move your HTML one folder up.

Base URL that works for html in files and on website?

Like many developers I put my images in /images, css in /css, and js in /js. This way, no matter what the URL/directory structure, the site can simply reference /css/style.css or /js/jquery.
Problem is when I try opening the html from a directory, the paths are screwed up. It assumes / is C:/
I'd like to be able to preview html files in a directory before putting them into a CMS on the web, but don't know how. Can somehow be used to handle this with minimal hassle?
Using root-relative links is great but, as you see, can cause issues when working locally.
Ideally, you'd set up a local web server on your machine and preview that way rather than just using the file system.
By putting a slash in front of your path, you're making it an absolute path. You should use absolute paths as rarely as possible - instead, use relative paths.
Say you have a directory structure like this:
/website
/html
/css
style.css
test.html
script.js
/newcss
newstyle.css
If you're in test.html and you need to refer to style.css, the relative path would be css/style.css. If you need to refer to script.js, the relative path would be just script.js. If you need to refer to newstyle.css, the relative path would be ../newcss/newstyle.css (the .. means "go up one directory level").
This has the benefit of making your code portable - you could copy the website folder anywhere you wanted, on any system, even to your websever, and it would work. Both *nix and Windows systems obey these rules.
You could consider setting up a local server like XAMPP. That way, your files will be previewable on http://127.0.0.1 and your absolute paths can be made to work just like on the web. XAMPP comes with a default htdocs directory into which you would put your file structure.
It may take some time of setting it up and getting into it, though.