Do I need to update CSS to upload new images? - html

I want to start by saying that I did not build said website. I was given FTP access to the site and can download it's entirety.
What we are interested in is replacing the images as they are rather outdated.
If I replace the images (naming them as the ones that exist as of right now), they update just fine.
But adding more does not. Lets say that files are numbered 1-6. If I replace those with the same name, they change. If I add 7.jpg, for example, it does not show in the gallery.
Do I need to update the CSS code or upload it again?
I can provide the code in turn.

Without further details it's hard to tell what the problem is, but it looks like either someone hard-coded CSS or hardcoded HTML. But I would really need to see the code.
Please try to copy/paste at least the code for file that should render the images.

Your gallery should contain new images' name.
if you upload 7.jpg, this one is not in your gallery I guess.
I think it will not matter if you update the CSS.

A priori, to clear any doubt if the images are in cache, I suggest you refresh the page by typing ctrl + R or open a tab in incognito mode.

Related

html changes won't show up in browser

I'm working on an assignment for a class where our teacher has given us a webpage built out with html and css. We are eventually supposed to create some animations with gsap, but first need to make our own edits to the webpage itself. I am using vscode and when I edit any of the html, the changes show up in my index.html, but not in the browser. Any idea why this is?
try to right click your browser and check in the sources to make sure it really saved your changes.
Try to use live server on VS Code and then whenever you save it will show up on the page.
-> https://techstacker.com/local-live-server-vscode/
Make sure you save the file and reload the page in the browser

Save as a blank html page instead of content

I am using asp.net web form and the content is displayed let just say in the about-us.aspx.
I know it is impossible to disable Save As option in the browser file menus, but is it possible to have users saving it as a blank HTML page instead of the content?
Even if you could disable the "save as" feature, which... no, you can't. But say for an instant you could. Anyone who wanted (a copy of your webpage) could just take a screen shot and print that. Or, they could open the source code and copy/save that. Saving the file isn't the only way that they can grab your content.
Is there a reason that you don't want them to copy it?
Are you trying to prevent people (in general) from seeing the page?
If there is some other consideration, please leave a comment so we can expand on this.

JPG image renders as code

My image thumbnail links to the full size image. Now only the image is showing up as some sort of code. I have been using the same HTML editor for years, all the pages are the same. It is only this group of 5 pages that have thumbnails. Take this link for example:
ÿØÿáExifII*ÿìDucky2ÿáyhttp://ns.adobe.com/xap/1.0/ ÿíHPhotoshop 3.08BIMZ%G8BIM%üá‰È·Éx/4b4XwëÿîAdobedÀÿÛ
I also discovered that if I get this code an then go up to the history and click on the name of the photo it pops right up as it should have been. I have no idea how to fix this. I have uploaded the photos several times with two file managers, used other photo software aswell. My editor shows that these pages are fine, but IE shows that the pages have no style and all browsers show the linked image problem.
I know this doesn't make much sense to you professionals, but this is my business website and a customer told me about the problem. After 8 hours of trying to fix this I am hoping you could help.
The problem:
This problem occurs when an IMG changes or got touched (by adobe, in your case) AFTER it was uploaded to the server and the name of the new (or modified) IMG remained the same. The image shown does not get refreshed. The old image is still shown, even though the database holds the right image. I have narrowed it down to the fact that the IMAGE IS CACHED in the web browser. If we hit the RELOAD button in Firefox/Explorer/Safari, everything gets refreshed fine and the correct image just appears.
I verified that on your site running the following:
function is_cached(img_url){
var imgEle = document.createElement("img");
imgEle.src = img_url;
return imgEle.complete || (imgEle.width+imgEle.height) > 0;
}
And then I called this function which returns true or false depending on cached or not:
is_cached("photos/back_to_school_pr5_tn.jpg");
And the result came back as:
<- true
Remember: When uploading an image, its filename is not kept in the database. It is renamed as Image.jpg (to simply things out when using it). When replacing the existing image with a new one, the name doesn't change either. Just the content of the image file changes.
Solution one - No code required:
Since you are not in the coding business (as you claim), all you need to do is to rename the IMG after it's been touched by adobe.
Whenever you modify a photo in adobe or you upload a new IMG you should give it a new name since the older version of the IMG IS STILL IN CACHE.
Solution two - Coding required:
If touching the IMG with adobe is a constant thing that you do after you upload the original picture, then the above solution can be an hassle, so you might want to look into ways to force the web browser to NOT cache images from this page.
NOTE: This solution is only good for the future. In your case, the IMG is already cached.
Besides, this will only work if the actual IMG is inside your HTML, but on your site the link takes you to the actual IMG.
Solution three - Coding required:
An important addition to the above solution is that you can never force a browser to do anything. All you can do is make friendly suggestions. It's up to the browser and the user to actually follow those suggestions. A browser is free to ignore this, or a user could override the defaults.
So the best long-term solution will be to save the filename with the database. This way, if the image is changed, the src of the IMG tag will also change.
For example:
<img src="picture.jpg?1222259157.415" alt="">
where "1222259157.415" is the current time on the server. (Note: I used python's time.time() to generate that)

new picture not registering

first time poster and html noob here.
For a few hours now ive been trying to use a background picture. I downloaded an image I wanted to use, and set about trying to code it.
No matter what I tried, the image would not display. However, when I tried one of the other images I was using, it displayed just fine.
I tried using just the first letter of the existing image, and the program immediately suggested the image in a dropdown, as well as several other images with names starting with the same letter. However when I tried to use the new images first letter, it did list options, but none of them were the image I had downloaded.
I tried renaming the image, but still no luck.
I havnt included any code just yet, since this seems to not be related to the code itself (Since other images display just fine). Has anyone run into something like this before? Extensive google searches did not yeild anything for me.
In case it matters, I am specifying the background image as part of the Body css.
Thanks in advance for any help.
Please check to ensure your preferred image is located in the same parent folder as your htlm.
As #Patrick Falvey says but if the picture is not in the same folder remeber to / before your file path :)

How to link a webpage to itself without first knowing its name?

To link a page to itself (e.g. http://example.com/folder/ThisPage.html), we can simply create a href as such:
ThisPage.html:
Link
This works, but has the disadvantage of needing to be updated when the file name changes. For example, if the file name changes to ThatPage.html, our href needs to change accordingly to Link.
I'm looking for an alternative without that disadvantage. I've tried:
Link
Doesn't work as Link does, because it appends a "blank query part" (question mark) to the URL.
Link
Doesn't work as Link does, on some browsers (e.g. Opera).
How do we link a page to itself, without having to update the relevant portion when the name of the page changes?
Note: JavaScript not allowed.
Just use Link. Nobody cares about the question mark appended to the URL. It does the requirement and that is what counts right?
It's very simple, just leave the href="" blank. So that's how:
Click me to refresh page
But this is not necessarily a good idea, because the cache may not be cleared, and whatever you need it for, if the page has changed in the meantime the change may not appear despite the reload. Probably a better idea is the javascript code location.reload(); to take. But there are enough explanations on other sites, which is why I won't explain it here. You can of course also for example take a question mark (?), but this is unnecessary, actually not intended for it and can cause problems depending on the program.
Here is a short list of common hyperlinks:
Points to the root page
Link
Points to a file relative to the root page
Link
Points to a file relative to the current file
Link
Points to a file in the previous folder
Link
Points to a file in the second previous folder
Link
Points to a file in a folder below
Link
Points to the current file
Link
Points to a page with a different host but the same protocol
Link
I hope that my answer will help some people, because I found it via a search engine and saw that there is no correct answer. And it's my first answer here 😅
If you want it to go nowhere, you can use
link
But if you want it to reload the page, you'll have to go with JavaScript.
If you want to reload the page you could use the Meta refresh tag
http://www.w3.org/TR/WCAG20-TECHS/H76.html
If you want to reload the page, you really should take a look into javascript. It is the best way to do it.
Just do this:
This Very Site
Source: I saw this in the source code of Matthew Alger's website. Check it out for yourself!
Why not try ?
I looked some things up, and as it turns out, ./ refers to current directory.
You can just make a link to the same page.
Here ya go. Hope this is what you are looking for
Link