I turned on URL rewriting on Drupal, and some URL image are broken.
For example :
local/tw/sites/all/themes/tw/images/1-p1.jpg become
local/tw/content/sites/all/themes/tw/images/1-p1.jpg
or
local/tw/sites/all/themes/tw/images/2-p1.jpg become
local/tw/node/sites/all/themes/tw/images/2-p1.jpg
Any ideas?
If you used relative path, and you're talking about contents within nodes, it's perfectly normal, since "node/" is interpreted like a directory.
You could fix this problem adding a "/" before image src, or using module like Path Filter that provides a simple file:relative/path/to/file syntax.
Related
I've done my searching and the topics haven't been of help.
I'm trying to have the background image of my header repeat across the X axis of the header div.
When I make CSS with a long URL such as
background-image:url('http://site.com/images/logo.png'); everything works fine
When I try to shorten the CSS to something such as ~/images/ or even having the CSS and site file already in the root folder and using /images/ I get nothing
background-image:url('~/images/logo.png')
background-image:url('/images/logo.png')
This is possibly because you're not shortening your URLs appropriately.
Assuming an absolute path of:
url('www.example.com/images/imageName.png');
A root-relative URL would be:
url('/images/imageName.png');
And a relative path (assuming your CSS file is in www.example.com/css/cssStylesheet.css) would be:
url('../images/imageName.png'); /* parent directory, then the images directory */
The ~ prefixed url format is unknown to me, though I suspect it's an ASP, or .NET, form? Though I'm unable to advise on that.
Questions that might be of use to you:
How do I turn a relative URL into a full URL?
Using relative URL in CSS file, what location is it relative to?
Absolute urls, relative urls, and...?
A URL containing "~" is something that's specific to ASP.NET, it's processed server-side and transformed into a "proper" URL such as http://mysite/my_virtual_directory/images/logo.png. Web Browsers don't have any way to do this as they don't know to what "~" refers.
You need to ensure that the URLs you use in your CSS file are "understandable" by the browser, so either have them "fully qualified" (http://mysite/my_virtual_directory/images/logo.png) or starting from the "beginning" (/my_virtual_directory/images/logo.png).
I'm developing a site locally using xampp. The path the images are using is
/devsite/sites/default/files/icon_facebook.jpg
When I check out of the site on my server the path remains the same for the images, even though the image is now at
/~devsite/sites/default/files/icon_facebook.jpg
Are the image URLs just hard-coded by the wysiwyg including the wrong base path? Is there something I can do to make them work?
When you're using wysiwyg, the image path is saved along with the rest of the HTML, and the filters don't convert it. So under some conditions - especially if you're moving from a subdirectory to the HTML root - you'll have images that are misplaced.
The pathologic module might be of some help here. Otherwise you could use Views Bulk Operations to do a string_replace() operation your HTML fields.
Try setting the $base_url in sites/default/settings.php. I'm not sure how the WYSIWYG is setting images, but it's pretty standard that it should be using a path relative to the base url.
I'm loading a background-image with a url like this:
background-image: url(../../images/folder/imageName.png);
For certain pages, this works fine, but on others, it only works if I put a slash at the front like this:
background-image: url(/../../images/folder/imageName.png);
Its bizarre to me that this would work sometimes and not others. Also, my gut feeling is telling me that starting these urls with a slash is just plain wrong.
Does anyone have any insight on this?
Starting urls without a protocol (http://, etc) means it is relative to the current document. If the different pages are in different folders then the file that relative URL points to will change, which is probably your problem.
Starting a URL with a slash makes it relative to the entire domain/subdomain the page is on. I consider this a good practice so would encourage you to use it.
In your example however you are following it with ../../, which are "directory above" hints, which are ignored because you are already at the base of the domain.
I think I figured it out. My stylesheet is at an address like this:
http://localhost/rootDirectory//pageName/stylesheet.css
Note the two slashes between rootDirectory and pageName. It seems that when my images used the .. to go back directories, it treated the empty space between those slashes as a directory itself (while loading the stylesheet did not treat it as its own directory and had no affect on the path loaded).
So this is why for some stylesheets, ../../ seemd to work, and for others it didn't (as a matter of fact, ../../../ worked instead)
I'm using the iis7 URL Rewrite module and it's working fine, except for two things. Being new to this, I might be missing something obvious.
1) My URL gets converted from
www.mysite.com/search.aspx?fName=John&sName=Smith
to www.mysite.com/John/Smith. This works fine, but if I add a trailing / , a few images on the site disappear, wheras a few don't. (They're all in the same location). However, the search results are fine.
2) Is it possible to make cerain querystrings optional? Server side, this is implemented (i.e. if nothing is entered, then assume a default value). But how would this work with the URL rewrite module?
e.g. www.mysite.com/John would search for John and use a default value for the sName parameter.
Thanks for any help.
I can't help with the optional query string parameters I'm afraid, but the images one should be fairly easy:
How are you declaring the image paths in your markup? If you are using relative paths (i.e. src="../Images/someimage.png" then adding a trailing slash to the URL is telling the browser that the /Images/ folder is under the folder /John/ instead of being at the root of the site.
If you are using HTML <img /> tags, you should prefer a virtual path: src="/Images/someimage.png" - this tells the browser to request the image path from the root of your site.
If your application isn't running in the root of the site, you can also use the ResolveUrl method that is part of the page and control object tree, this allows you to pass in a virtual path of the form ~/Images/someimage.png and the framework will work out what the correct path should be.
I'm using urlrewiter.net in order to implement friendly url's.
It's a great and easy to use package!
Nevertheless, while using subfolders I had problems with the relative links to images and to other inner pages.
I tried to use ~ (server side) and it didn't do the trick.
Is there another solution?
Because of these issues, I've started to be always give relative (to the root) URLs, so let's say you have an images subdirectory:
http://www.contoso.com/images/blah.jpg
You'd always reference it via "/images/blah.jpg" .. and no matter what the base page/context is, that image will be accessible.
You should probably segment your site so static elements (images, css, etc) are in separate location from your dynamically generated urls. I've used URlRewriter extensively in the past, and it worked great, but our site was setup so that our resources were segmented like that.
You can simply add base tag to your HTML headers. This will force browsers to use specified location to resolve relative links. Maybe this article will help you: SEO-Friendly URLs and Relative Links