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.
Related
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.
Friends, i'm stuccoed with images in wordpress - please, help me understand where search for solution.
If you create webpage - www.wordpress.local/page1/01-0001 and you upload an image 01-0001 on that page, you can see, that when you'll visit www.wordpress.local/page1/01-0001, you'll see the page with image, not the page, that you created with text and images.
Any ideas how to solve it ?
PS Not renaming images :)
When you use the WordPress-uploader, the images are stored in /wp-content/uploads/, and WordPress takes care of using filenames that aren't already in use.
If you upload an image, e.g. via FTP, that has the same name as a WordPress-page, the server has to decide what it should serve; either the WordPress-page or the image. One URL = one file served.
In your case, the server decides for the image. You could of course change this configuration; but in all cases, one of the two files won't be accessible.
If you want to make both files accessible, you either need to rename the image or the WordPress-page.
I've added some html code in my Blocks content and enabled Full HTML filter.
I've used relative paths for my images, such as "sites/all/themes/zen/zen/image.png"
I guess this is not correct because I need to change my paths depending on I'm in the home page or "node/id" page.
I guess I cannot use PHP inside blocks, thus I cannot use $base_url... how can add images path with only html ?
thanks
The previous answers provide a part of the solution, but here's a fuller scoop:
Hand-written HTML
If your site lives at example.com (i.e. it's the "root" site), then adding a front slash to your relative path will solve the issue, as others have suggested:
<img src="/sites/all/themes/zen/zen/image.png">
However, if your site lives at example.com/my-drupal-site, then you'll need to write it like this:
<img src="/my-drupal-site/sites/all/themes/zen/zen/image.png">
It really is better if you can use PHP to determine the appropriate path. If you're calling an image from a theme, you can use the Drupal function drupal_get_path to get the path like this:
$img_path = drupal_get_path('theme', 'zen') . '/zen/image.png';
And then you could be really Drupaly about it and use the theme_image function to generate the HTML for the image:
$img = theme('image', $img_path, 'My Image - Alt Text', 'My Image - Title Text');
Where $img now holds the HTML for the <img> tag and its src, alt, and title attributes. See the API documentation for drupal_get_path and theme_image for more information.
Point-and-click Solution
As jeffreymb points out, your easiest bet is to use a combination of a WYSIWYG editor and a built-in file handling module called IMCE to gloss over all these details for you. If you don't have access to the "PHP code" input format, this is the best solution.
So, steps:
Install the WYSIWYG module, as well as a WYSIWYG editor (I suggest CKEditor).
Install the IMCE module and IMCE WYSIWYG Bridge module, and enable the IMCE button for your WYSIWYG editor in its configuration settings for available Buttons.
See this post for a little more detail on that setup process, and make sure to read the documentation that the WYSIWYG module displays on its configuration page.
Once you have IMCE installed and integrated with your WYSIWYG, when you click the "Image" button in your WYSIWYG toolbar, your normal dialog should appear but with a new little icon to open the IMCE file browser. This file browser allows you to browse your files folder for images or to upload new files. It also supports a modicum of image manipulation, and will automatically generate the necessary HTML once you've selected an image.
I would recommend using the Pathologic module for this case. It is a filter that you can add to your input formats to convert relative URLs like that into proper URLs using your site's base URL. Plus it's useful if you have images in your RSS content as sites that re-publish the content (like feed aggregators, etc.) have the link to the full URL.
I use the CKeditor and IMCE modules to do this on my sites.
It is very user friendly and not that hard to set up.
Instead of the relative path, use the absolute path. So it'd be:
<img src="/sites/all/themes/zen/zen/image.png">
Note the slash at the beginning. The slash should be the only thing you need to do to convert your existing relative paths to absolute ones for use in straight HTML.
If you start your image paths with a slash ("/sites/all/themes/zen/zen/image.png") this will always be relative to your drupal root directory.
You could also simply select "PHP code" as the Input format, and use $base_url as you say.
I does this with cck blocks . The cck blocks is drupal module,it can put drupal fields into blocks
I am using WebRequest to retrieve a html page from the web and then displaying it using Response.Write.
The resulting page looks different from the original mostly in font and layout.
What could be the possible reasons and how to fix it?
Most probably, the HTML you retrieve contains relative URLs for loading images, stylesheets, scripts. These URLs are not correct for the page as you serve it from your site. You can fix this by converting all of the relative URLs into absolute URLs or by including a BASE tag in the head of the HTML, pointing to the URL of the original page.
Be advised though that deeplinking to images and other resources is considered bad practice. The source site may not like what you are doing.
The reason might be that the original html page contains relative (to the original site) paths to the stylesheet files so when you render the html in your site it cannot find the css.
Does the remote web site include CSS, JavaScript, or images?
If so, are any of the above resources referenced with relative links (i.e.: /javascript/script.js)?
If so, when the browser receives the HTML from your server, the relative links (which were originally relative to the source server) are now relative to your server.
You can fix this by either changing the HTML to use absolute links (i.e.: http://www.server.com/javascript/script.js). This is more complicated than it sounds: you'll need to catch <link href="..."/>, <a href="..."/>, <form action="..."/>, <script src="..."/>, <img src="..."/>, etc.
A more limited solution would be to place the actual resources onto your server in the same structure as they exist on the original server.
The remote site might look at the User-Agent and serve different content based on that.
Also, you should compare the HTML you can retrieve from the remote site, with the HTML you get by visiting the site in a browser. If they are not different, you are probably missing images and/or css and javascript, because of relative paths, as already suggested in another answer.
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