Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Konrad Pilch
2,435 PointsIs theres something wrong with this?
As the questions syas, is there something wrong with this?
background: url('/wp-content/themes/aurepor/images/vertical.png') no-repeat center;
5 Answers
Jeff Kinley
21,207 PointsHi Konrad,
If you are going to use relative paths, I think I'd use something like this:
background: url('../images/vertical.png') no-repeat center;
The way you have it, if you change themes and use the same custom css the link will break. Remember: relative paths are in relation to the css file.
kofi amoussou
Courses Plus Student 7,381 Pointsif its in your style.css and which is not in a folder then
```css
background: url('images/flower-bg.jpg') no-repeat center;
```
Konrad Pilch
2,435 PointsIt doesnt work like that in wordpress
Konrad Pilch
2,435 Pointsnot even background-image works
Jeff Kinley
21,207 PointsI assure you relative paths to the images folder do work in WordPress. I have it working on one of my demo sites right now. It seems to me there are some other issues going on. Can you zip up your theme file and put on dropbox so that I can download it?
Zac Gordon
Treehouse Guest TeacherYeah, they are correct that relative links work in WordPress and are the best practice. This code above looks correct if you are editing the style.css file and you have an images folder inside of your theme folder.
Jeff Kinley
21,207 PointsWhere is this css? In a stylesheets file, or are you using it inline?
Hmmm. I'd say double check that the image is in the images folder and make sure that the extension is correct. For example, sometimes, I have .jpg in the link and the image is a .png. Or I spell the file name wrong.
Konrad Pilch
2,435 PointsIm making WordPress theme, so the website is already looking how it should. And yes, this is in stylesheets. Unless i could try to put it inline? but yet, how would i do that with WordPress?
Jeff Kinley
21,207 PointsI realize that but are you editing a styles.css file or are you adding this to a inline style within the WordPress template?
Konrad Pilch
2,435 PointsAa
<div class="vertical"></div>
But yet, the way im doing, it worked in my previous project. and i have no clue why it wont work now.
Jeff Kinley
21,207 PointsKonrad,
You have to take a look at the file structure of the theme you are using. Relative paths do work in stylesheets in WordPress. For example, check out this post:
http://stackoverflow.com/questions/5815452/how-to-use-relative-absolute-paths-in-css-urls
I also confirmed on one of my projects. However, my main.css file was in a css directory which was in assets directory. To be able to make a relative path work I had to do this:
background: url('../../images/flower-bg.jpg') no-repeat center;
I believe this is the better way to do it because it will help prevent broken links when you migrate to production, change your theme, etc. Before I knew better, I use to hardcode my background images using absolute paths.
Konrad Pilch
2,435 PointsWell, i have tried what you wrote. The thing is that i heared the way you showed me is the hardcored way as you need to declare the full path for it so it wont break .
its into style.css , whole css. And im using only style.css for it since thats the standard of the wordpress theme dev. Theres nothing bad to hardcode them into inline . Im comming from wp-content since thats where is the whole WordPress core code so i believe it should go form there.
But as i wrote before, when i developerd it into a static site, i did what you told me right now. Now when i was developing my theme, i used the code above i showed you and it worked because the code you showed me now wont work.
Because none of the ways , mine or your work. I tried everything you told me, and everything i knew. I have checked everything and all, i even cleanred whole htdocs its jsut wont work, wont pull any iamges. Its like 2-3 days like that.
Jeff Kinley
21,207 PointsAre you developing this somewhere live? If you create an account for me, I might be able to take a look.
Konrad Pilch
2,435 PointsIts on localserver.
Konrad Pilch
2,435 PointsKonrad Pilch
2,435 PointsHI,
This does not work. From my previous experience i had to include /wp-contact/themes/my folder name/images/filename.png.
I believe thats how wordpress works, i did it last time as well, in my last projects, but in this one it doesnt work. Maybe ur way works as well, but it doesnt work for me now, neither mine.