将图像添加到块 html [英] Adding images into blocks html

查看:21
本文介绍了将图像添加到块 html的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在 Blocks 内容中添加了一些 html 代码并启用了 Full HTML 过滤器.

I've added some html code in my Blocks content and enabled Full HTML filter.

我为我的图像使用了相对路径,例如sites/all/themes/zen/zen/image.png"

I've used relative paths for my images, such as "sites/all/themes/zen/zen/image.png"

我想这是不正确的,因为我需要根据我在主页或节点/id"页面中更改我的路径.

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.

我想我不能在块内使用 PHP,因此我不能使用 $base_url...如何仅使用 html 添加图像路径?

I guess I cannot use PHP inside blocks, thus I cannot use $base_url... how can add images path with only html ?

谢谢

推荐答案

前面的答案提供了解决方案的一部分,但这里有一个更完整的独家新闻:

The previous answers provide a part of the solution, but here's a fuller scoop:

如果您的站点位于 example.com(即它是根"站点),那么在您的相对路径中添加前斜杠将解决问题,正如其他人所建议的:

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">

但是,如果您的站点位于 example.com/my-drupal-site,那么您需要这样编写:

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">

如果能用PHP来确定合适的路径就更好了.如果您从主题中调用图像,您可以使用 Drupal 函数 drupal_get_path 来获取这样的路径:

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';

然后你可以真正了解它并使用 theme_image 函数为图像生成 HTML:

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');

$img 现在保存 <img> 标签及其 srcalt 的 HTML, 和 title 属性.请参阅 drupal_get_paththeme_image 了解更多信息.

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.

正如 jeffreymb 指出的那样,最简单的方法是结合使用 WYSIWYG 编辑器和名为 IMCE 的内置文件处理模块来为您掩盖所有这些细节.如果您无法访问PHP 代码"输入格式,这是最好的解决方案.

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.

所以,步骤:

  1. 安装 WYSIWYG 模块,以及 WYSIWYG 编辑器(我建议使用 CKEditor).
  2. 安装 IMCE 模块和 IMCE WYSIWYG Bridge 模块,并在可用按钮的配置设置中为您的 WYSIWYG 编辑器启用 IMCE 按钮.

参见这篇文章,了解有关该设置过程的更多详细信息,并确保阅读 WYSIWYG 模块在其配置页面上显示的文档.

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.

一旦您安装了 IMCE 并与您的所见即所得集成,当您单击所见即所得工具栏中的图像"按钮时,您的正常对话框应该会出现,但带有一个新的小图标来打开 IMCE 文件浏览器.此文件浏览器允许您浏览 files 文件夹中的图像或上传新文件.它还支持少量的图像处理,一旦您选择了图像,它就会自动生成必要的 HTML.

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.

这篇关于将图像添加到块 html的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆