I am not sure why I can't get an image to show up in the background of this site: http://backroadsbrewing.com/
I have tried using the !important; tag, uploading the photo into the Wordpress' library, and linking within the stylesheet to the URL.
Not sure if you're able to see the code of the site without me putting it up somewhere? If you need me to post it, please let me know.
You are not linking the correct css, you are linking the editing link.
<link rel="stylesheet" href="http://backroadsbrewing.com/wp-admin/theme-editor.php?file=style.css&theme=onesie">
If you open http://backroadsbrewing.com/wp-admin/theme-editor.php?file=style.css&theme=onesie in an inkognito window or after logging out, you get redirected to login page, which is wrong.
You need to link to your generated css file instead of some wp-admin/ url (which will never work).
The correct link would be in your case:
http://backroadsbrewing.com/wp-content/themes/onesie/style.css
Regards, Max
Additionally, you have added an obsolete semicolon:
background-image: url("http://wallpapercave.com/wp/Tb3g7Fv.jpg"); !important;
# instead of
background-image: url("http://wallpapercave.com/wp/Tb3g7Fv.jpg") !important;
And you should:
never link to external pictures (they can always change or being removed)
only link to pictures where you own rights to publish (or it can get really expensive, like a customer of me payed 900€ for a single picture he used for a couple of years.
Related
I'm wondering if it matters when you save an image in a folder, like when you right click on an image, Do you choose:"Save link as" or "save image as" as I have tried both but for some reason I cannot display the image as my background for a website. Is there anything wrong with the code that I did? Every time I drag the URL into a new tab or browser I only get 6 bullet points on a blank page.
I mainly used an external CSS sheet, then decided to try to fix it by using an internal sheet on HTML, and since that did not work, instead I tried to implement it in the body tag rather than the header tag but nothing worked. Would I have to use the tag? But how else will I be able to implement a background?
file:///Users/kevinnguyen/Desktop/Screen%20Shot%202019-01-26%20at%2011.09.11%20PM.png
The one above is the HTML file.
file:///Users/kevinnguyen/Desktop/Screen%20Shot%202019-01-26%20at%2011.12.19%20PM.png
this is the external file of CSS.
I'm a new to programming as I self taught myself the basics, yet I want to learn so much of it, it's thrilling.
Your links to the images don't work because they point to files on your computer. You need to upload them somewhere and put the link here to be able to see them. Anyway, if you have background-image:url("6928140-swiss-alps.jpg") your image should be in the same folder as the css file. And it should be called 6928140-swiss-alps with the .jpg extension at the end.
I know I can add images to a html file by the following syntax
<img src="*****">
But my question is can i copy any images link from the web and add them to my html file?
i'm not talking about the copyright laws regarding this, just, can every image link be used as the image source in html?
I was writing a code in codepen where i embedded a link to an image from devianart, but the image didn't show up.
I think it depends to the website policy; Some websites don't let you to use their hosted images in your webpage, and some others do.
this is what i find on W3schools:
Definition and Usage:
The required src attribute specifies the URL of the image.
Note: When a web page loads; it is the browser, at that moment, that gets the image from a web server and inserts it into the page. Therefore, make sure that the image actually stay in the same spot in relation to the web page, otherwise your visitors will get a broken link icon. The broken link icon is shown if the browser cannot find the image.
The URL of the image.
Possible values:
An absolute URL - points to another web site (like
src="http://www.example.com/image.gif")
A relative URL - points to a file within a web site (like
src="image.gif")
Hope this is helpful :)
make sure image fully open in your browser tab/
i also check it but it work in codepen may be you doing something wrong first need to write clear what you want
try this image tag in codepen
I'm not great with html, but people I have asked are telling me it is impossible to change the color. The script comes from a separate website and is not my own. I would like to change the color of the link. All my other links are black, and I would like to keep them that way, but I want this one to be #f2f2f2. Although there isn't a color code in the script itself, is there a code I can add elsewhere to change it?
The script won't show up so I have screenshotted it and here is the link to see
<script src="http://tc.freehostedscripts.net/tcounter.php?url=kittycocaine.tumblr.com&name=x" type="text/javascript"></script>
This script is from an outside website, and is used to track activity. The website that created the script will not allow me to change anything in the script posted above.
I have total control over where I can place the script, but I would like it to show up in top left so I was just going to post it at the top of the head tags. I put the entirety of my html into pastebin in case that helps with anything
http://pastebin.com/PbuYkDbQ
Based on your question, this script is adding some url link to the page.
Is there any reason you can't style it with CSS for whatever color you want? If the inserted href doesn't include any class, you could target it to be inserted into a div with some class in it (or just re-purpose whatever element its nested in, if there are no other urls).
Your question is still unclear, but possibly what you could try is:
Surround your script with a named div, e.g. <div id="activityLink"> { your script code ... } </div>
Add a style section to the head of the html: <style> </style>
Create a CSS rule for the link color within the style block : #activityLink a { color: #f2f2f2; }
Links can have different colors depending on their state, see CSS Links page on W3schools.
If you want to do any web development, I'd strongly suggest learning CSS, a basic knowledge is quite easy to learn and very useful.
I see your file has the extension .php it has to be .js.
According to your comment, "I'm not even sure how to do that I'm sorry, what would I do?", As you said that is a file from another domain. If that domain is yours please change the file extension from .php to .js by going into your folder and right click edit it and then remove that .php and then write .js in there.
One easy way could be to search for CSS thing on google.
I'm creating a web site and the site consists of a few images. Locally, everything displays correctly, but when I upload it to my server, some of the images are not displayed. None of the GIFs / Animated GIFs are displayed at all and some of the jpeg images are not displayed (while others are OK). The only images which don't appear to be effected are PNG, which display OK.
If I check FireBug and hover over the image link, I receive the message Failed to load given URL.
If I enter a direct URL link to the image on the server, the image is downloaded so it's definitely there.
Here's my CSS:
body {
background-color: #000;
background-repeat:no-repeat;
background-position:top;
background-image:url(../images/background2.gif);
}
I created another web site using the same code, but with a different background.gif image and everything displays correctly, so I'm not sure what else is different?
Also, I have tried deleting the images from the server and re-adding them, but still no luck.
Try putting in the full path in the url:
e.g. background-image:url(http://www.your-site.com/images/background2.gif)
-if that works, then check your paths and make sure the css url matches your directory structure.
Instead of using:
background-image:url("../images/background2.gif");
Use:
background-image:url("/images/background2.gif");
Starting with "/" moves to the root directory and starts there
Starting with "../" moves one directory back and starts there
(also it's a good practice to always include quotes on paths)
Thanks for everyone's help, its turns out that this was a problem with some sort of bandwidth restriction on my work internet. If I viewed the site from anywhere else the images were all loaded..... I really though I was going mad for a while! Thanks again.
Please check the following link
http://jsfiddle.net/BbkBf/
I got two questions:
1. why is the background-image not working for the first one (you may say it's a tag is empty, but even then doesn't work).
2. why is the image not shown for the second img tag?
Is it some wordpress problem?
Because the domain in which the image is hosted is protected against hotlinking, meaning they won't let you load the image from their domain unless you are inside their domain. try uploading it to a different domain.
See example: http://jsfiddle.net/BbkBf/3/