10

I'm trying what I thought would be something really simple of masking my url but cannot seem to get it to work. I want to be able to link to images in my img tag without having to type in the full url.

i.e.

Current url:  http://server.com/wp-content/themes/standard/images/img.jpg
or
<img src = "http://server.com/wp-content/themes/standard/images/img.jpg" />

However on my pages I want to just do

<img src="http://server.com/images/img.jpg" />

However nothing seems to be working on my localhost. I am running the Apache server on a windows 7 machine. I am trying to use a .htaccess to do what I've mentioned above. Here is my .htaccess file in the root of my website.

UPDATE: I tried ZweiBlumen suggestion below but that did not seem to work. I then tried Geerts suggestion and added the re-write method to my misc.php of my admin folder. I then went to my permalinks page and hit save. The result of doing this meant my .htaccess folder was rewritten and the output it produced is below.

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteRule ^css/(.*) /wp-content/themes/standard/css/$1 [QSA,L]
RewriteRule ^js/(.*) /wp-content/themes/standard/js/$1 [QSA,L]
RewriteRule ^images/(.*) /wp-content/themes/standard/images/$1 [QSA,L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

However, I still cannot navigate to my images folder such as:

http://localhost/images/myimage.jpg.

All I get is a page not found. Joshua's suggestion worked perfectly however I'm hoping to use this in conjunction with masking the images URL.

Is there anything else I might be doing wrong, or should check?

UPDATE:

For anyone reading this, I just tried again and it has worked using a combination of Geerts and Joshuas methods. My Firefox browser appears to have been caching the page which was causing me to think it wasn't.

The reason I went with this over putting it in the .htaccess file is that this file is overwritten every time I go to the permalinks Admin page and so I don't won't to overwrite this by accident. I guess I could turn this off somehow but not sure how to do that. All three answers helped to some degree.

3 Answers 3

10

Check out the Roots WordPress Theme. They seem to do exactly what you want with the URLs.

Here's a snippet from their roots-htaccess.php file:

add_action( 'generate_rewrite_rules', 'roots_add_rewrites' );

function roots_add_rewrites($content) {
  $theme_name = next( explode( '/themes/', get_stylesheet_directory() ) );
  global $wp_rewrite;
  $roots_new_non_wp_rules = array(
    'css/(.*)' => 'wp-content/themes/' . $theme_name . '/css/$1',
    'js/(.*)'  => 'wp-content/themes/' . $theme_name . '/js/$1',
    'img/(.*)' => 'wp-content/themes/' . $theme_name . '/img/$1',
  );
  $wp_rewrite->non_wp_rules += $roots_new_non_wp_rules;
}

Note: if you can pull this off directly in a .htaccess file, as in ZweiBlumen's answer, you should pick that solution since it most probably is more optimized.

6
  • 1
    Although not quite what I was looking for this method did end up putting the rules in the .htaccess via the admin permalinks page upon save. I have ended up using this method in conjunction with that of Joshuas and it works perfectly. Thanks for the help.
    – dreza
    Commented Dec 1, 2011 at 8:54
  • Cool, for performance it's a good thing they put the rewriterules in the .htaccess too.
    – Geert
    Commented Dec 1, 2011 at 10:51
  • I would think this method is perfectly fine compared to hard-coding them into your .htaccess. Because here you can also manage it based on a theme's functions.php and turn off these rules if needed.
    – Jake
    Commented Apr 27, 2012 at 15:38
  • This is actually the best method for Wordpress. WP Rewrite's rules are only generated when updating the permalinks structure, so what you're doing here is essentially writing it into your .htaccess anyway; albeit in a more manageable fashion as Jake says.
    – pospi
    Commented Feb 25, 2013 at 5:13
  • 1
    Probably shouldn't have wp-content/themes hard coded, as they're moving targets. global $wp_theme_directories could be used to loop through all registered theme directories and identify the currently active theme. And WP_CONTENT_DIR could be used to get the define()ed name of the content dir. Anyway, +1 on this answer.
    – kaiser
    Commented Sep 1, 2013 at 19:13
6

If the issue is only with images, but not css or javascript, I think there's a typo in your RewriteRule. I think your missing a "1" after the "$":

RewriteRule ^images/(.*)$ wp-content/themes/standard/images/$1 [L]

Also, you might want to try putting those extra statements below the initial rule, ie below this line:

RewriteRule ^index\.php$ - [L]

Not sure though.

1
  • shucks. didn't see that. Thanks I'll give that a go.
    – dreza
    Commented Nov 30, 2011 at 19:17
4

Why don't you create a shortcode for that in the following manner.

function img_folder_shortcode( ) {
   return get_stylesheet_directory_uri() . '/images';
}
add_shortcode( 'img_folder', 'img_folder_shortcode' );

And then use the following shortcode anywhere in the content area.

[img_folder]/img.jpg
<img src="[img_folder]/img.jpg" alt="img" />
1
  • hmmm, I like the ability to use the [img_folder] in the content area, although I was really only wanting to have the /images url not the entire wp-content exposed. However might look at combining this with Geert's and ZweiBlumens answer if I get those going.
    – dreza
    Commented Nov 30, 2011 at 19:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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