Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm not a novice to Wordpress Theme Design & Development. I've actually been doing it for a few years now and in recent years, it has become more than a hobby and is slowing shaping into a career choice.

However, I have a somewhat simple yet puzzling question to ask here...

Forever, I've been uploading the images I use through my custom themes into their own "img" or "images" directory under the themes directory under wp-content. Of course, for posts I just used the Media Uploader built within Wordpress itself.

But, now that I'm trying to be more professional and produce grade-A work consistently I recently thought about how I handle my images. You see, using my old method I also did NOT use Wordpress template tags for the image paths. I was doing the old fashion HTML method with it's relative path and if I encountered a problem, I just put the WHOLE path in there to save time. That is a huge no, no. I'm well aware but this wasn't client work...

Anyway, to get to my point - what IS the best practice for using images in Wordpress? I'm now beginning to think more inline with this process:

For theme development I now have a "inc" directory within my theme's directory that then has a "imgs" and "js" directories, etc. When designing the theme, I'm now using Wordpress template tags for my paths to work properly throughout the theme. For my posts, I'm still using the Media Uploader and the normal /upload directory.

Is my new method the best practice? Thank you!! Again, I'm just trying to clean up my workflow and methods so I'm more in-line with the Codex and other top tier Wordpress projects out there.

Thanks!

share|improve this question
2  
Broad questions don't get much traction around here, if you can just give a code example of how your doing it and ask if there is a "better way" it would be "better". –  Wyck Aug 23 '12 at 4:10
    
See, this isn't a question that is on a certain string of code, it's a best practices question and is more to see how others in the Wordpress community are doing things. Reading the Codex and going "by the book" is one thing, but I find I gain more perspective when I bounce these kind of ideas/questions off others. I will make an attempt to clarify that better next time Wyck, thanks for your comment. –  thatguycraig Aug 23 '12 at 19:35
1  
Please have a look at WPSE's faq, wordpress.stackexchange.com/faq , –  Wyck Aug 23 '12 at 19:57

3 Answers 3

I guess from the question you are asking, is there a way to code the image url that is better than typing in the whole url? This is what I do, to ensure that if the domain name ever changes...(which they do in my work because I always build the sites on a project domain and then move them over), you will want to do it this way:

<img src="<?php echo get_bloginfo('template_url'); ?>/images/image-name.jpg alt="whatever" />

You can also use this (and yes I know it is not the technically correct way to call css) when using css in a template:

<style>
#div {
     background-image: url(<?php echo get_bloginfo('template_url'); ?>/images/image-name.jpg);
}
</style>

It works for inline css as well:

<h2 style="background-image: url(<?php echo get_bloginfo('template_url'); ?>/images/image-name.jpg);">Some Title</h2>

I think this is what you were asking...

share|improve this answer

Your description sounds like a fine practice.

A good rule of thumb is to use a WordPress function instead of hard-coding or custom-coding whenever possible. That way you achieve full portability to any WordPress installation regardless of any plugins or other dependencies. How you structure files within your theme's directory is entirely up to you, but for ease of maintenance and scalability your method is a good one. Just make sure, as it sounds like you already are, that any paths to resources are utilizing WordPress functions to write the URLs.

share|improve this answer

In my opnion, yes you are using it right. I always think in 2 main things when i develop wordpress themes:

  • Make it easy for my client
  • Make it portable

I mean that you always use site_url() and all kinds of functions provided by wordpress instead of hardcoding urls. So if your client wants to move the theme to another domain it wont brake.

For javascript and stylesheet be sure to use wp_enqueue_scripts and wp_enqueue_style and be sure that you include them only on the needed pages. This apply to front and back end. One of the worst and popular practice is to includes files everywhere no matter is we need them or not, making the site slow and unoptimized.

So really no matter if you you /inc /assets or whatever you feel more confortable but its always nice to have all organized, and will help a lot if external people need to edit your theme.

share|improve this answer
    
thanks for the input! I'm developing a true Starter theme so, I want it flawless... even these hurdles that seem so small, make a big difference! Thought of I was on the right path, I do use wp_enqueue_* as well so, getting there! LOL –  thatguycraig Aug 23 '12 at 19:33

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.