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

WordPress From Bootstrap to WordPress Setup a Bootstrap Theme Add Bootstrap CSS via the functions.php File

how to we load images and javascript files ?

I see how we implemented the css file/folder, but how would we call the same type of function to load our images folder or JS folder? I can't get anything to work..

Matthew Meo
Matthew Meo
2,341 Points

do you mean to load a javascript file/folder into your page like a <script src="something.js"></script> type thing? Can you explain it a bit more?

The tutorial 'from bootstrap to wordpress' does a good job at touching the fundamental functions and novice development process,

But my problem is, none of the paths that are rooted in my index "../img/brownfox.jpg" are loading to my page.

I figured a similar protocall would need to happen to get the JS links going as well as they are place in the "../js/theme.js" in my local folder.

Hopefully you understand what I am talking about.

Matthew Meo
Matthew Meo
2,341 Points

Ok, cool. This helps. Right off the bat, I'm wondering if the link is off by a folder. Perhaps instead of "../img/brownfox.jpg" is it just "img/brownfox.jpg"? Either way, a good test is to go to the actual web page and right click to load the image in a new tab. Double check that the link that shows up in the browser is what you expect it to be. Hopefully this helps a bit.

The link shows up in the browser as I expect it, but all the images on my page have the temporary 'missing' image instead. I don't know if I have to have a function in my functions.php file that calls the link to the image folder. I am very new to WP development.

Matthew Meo
Matthew Meo
2,341 Points

Ahh, darnit. Was really hoping that would help. I'm not a wordpress guy yet, so I'm not sure. If the links are all matched up properly, then perhaps it is something in that functions.php (but I'm not sure how wordpress works, sorry). The thing that caught me was the use of "../js" leading to the root folder because nearly every structure doesn't contain the "../" before img or js folder. So I thought it was not finding your root folder. Sorry I couldn't be more help.

2 Answers

Hi Maxwell,

The Working with CSS and JS in WordPress Themes section of the WordPress Theme Development course goes through this well.

If you're familiar with WordPress in general and would like to customise it I would recommend this one or even the full WordPress Development track.

If you'd like to see what WordPress can do pre-customisation I'd recommend the Learn WordPress track.

Hope that helps.

-Rich

Zac Gordon
STAFF
Zac Gordon
Treehouse Guest Teacher

To include JS files, you have to link to them from the functions.php file. We cover this later in the course.