Hi, I’m working on my portfolio page right now and I thought I understood just fine how to use an image as a background but it is simply not working. What I have done is done a google search and found an image that I wanted to use for the background. I then took the URL and and put it into my CSS code for the body tag as “background-title:” and put "class=“background-title” in the body tag of my HTML. I assumed that this would apply the image from the URL to the body as the background. I’m obviously a newbie at this but it is driving me nuts. Any suggestions would be awesome. Thanks!
What you are doing with the image it’s called “hotlinking” and companies don’t line that, because every time someone opens your portfolio page that image gets called on that business/persons server using their bandwidth, so i’ll recommend that you open a Dropbox account or open a google blog and post the image there, then get the link.
i’d like to see your Codepen link to look at your code but according to your post -put it into my CSS code for the body tag as “background-title:” but instead of that, you should use Background-image: url(''); and put the url of your image withing the quotes in the parenthesis.
For more info. about this topic, take a look at: w3schools.
I think that I remember hearing that term “hotlinking” before, not really sure I understood it until now. It makes a lot of sense why companies wouldn’t appreciate that, I wasn’t sure how to do it any other way though. Would posting to a Google Drive account do the same thing? I have never used Dropbox before but I could open an account.
I will definitely check out the info on w3schools and I will try and change my code and post it later for you to see. Thanks so much for your input, I was banging my head against the metaphorical wall trying to figure it out!
So, you can publicly link to a document stored on your private drive (like Dropbox, MS Drive, etc)?
I just tried to use a link created in Google Drive as a background on my site and it didn’t work. I’m about to try Dropbox now to see if that works and the Google Drive doesn’t for some weird reason. My guess is that I am just doing it wrong somehow.
…Yep, I’m still doing something wrong…will update more later.
You’ll need to do this
HTML
<p class="background-title">Stuff
CSS
.background-title {
background-image: url(www.whatever.com.jpg);
}
I think so anayway
Yes, all you need to do is click the share button and copy the link to use it on your site; the way im doing it now is, since i have a google blog that im not usisng. I post my pictures on it and use the link for my projects.
1 Like
That makes a lot of sense, I’ll have to go back and look at my code with fresh eyes here shortly.
This is the code that I have for my background image and for some reason it is not setting the image to the background. I’m kind of at a loss right now. Anyway, here is the code:
CSS:
.background-title {
background-image: url(“https://drive.google.com/file/d/0B-Sf0DMccfCkbjBZMjlPT1pFWVk/view?usp=sharing”);
background-repeat: repeat-y;
}
HTML:
<body class=“background-title”>
…
</body>
Looks like something wrong with the Url you provided, because when i put my own img url works fine…
Well I’m glad to hear that the code seems to be correct. I’m not sure what the deal is because I just copy and pasted the link I got from my Google Drive. I’ll look more into it. Thanks man.
Maybe your image is in private mode in Google Drive, maybe you need to use a share link to the image or try to use an image from google to test.
That’s the weird thing, it’s definitely not, I made sure of that. I don’t know what is up with it.
You can use: background: url(‘https://drive.google.com/uc?export=view&id=0BykIL0bev3__amU1bWpOOURVMkE’)
id you can get from here: https://drive.google.com/file/d/0BykIL0bev3__amU1bWpOOURVMkE/view
can we use pictures taken from google as background of our portfolio pages?
i’ve found some great wallpapers to use, but I do not know if it is forbiden to take and use images with rights.
somebody help me?