用户友好的剪贴缩略图?

时间:2010-09-13 作者:Jan Fabry

有没有办法让我的用户定义帖子缩略图的裁剪区域?缩略图始终是现有的帖子附件,我不希望为每个缩略图创建额外的附件。

帖子缩略图应为200x100像素,并且来自帖子中使用的图像之一。因此,在我的理想世界中,当您单击“设置特色图像”链接时,您将获得已包含图像的概览,当您单击其中一个图像时,您可以自己定义裁剪区域(移动或调整其大小,但保持2x1纵横比)。单击“确定”后,新的帖子缩略图将与原始附件一起保存(在_wp_attachment_metadata[\'sizes\'][\'post-thumbnail\'] 元数据字段),而不是作为新附件。不允许使用已经用作其他帖子缩略图的图像,或者至少给出警告。

我相信包含的图像编辑器将不适合我的需要,因为您可以选择编辑所有版本的图像,或常规缩略图,但不仅仅是后期缩略图。我还发现,知道我正在编辑的版本有点混乱,所以我认为我的用户会遇到更多的问题。

是否有一个插件可以满足我的需要,或者可以轻松扩展到我的需要?

更新:示例UI

我非常喜欢Mac OS X通讯簿图像选择器的界面:您可以选择一个图像,并通过滑块调整固定比例缩略图裁剪器的大小。也可以拖动基础图像。您可以将此想法扩展到多种图像大小(我有一个post-thumbnailpost-thumbnail-1/2 例如,这是该尺寸的一半)。让用户使用复选框选择他现在正在编辑的尺寸,并在屏幕上绘制适当的裁剪矩形。

The Address Book image cropper in action

6 个回复
最合适的回答,由SO网友:Jan Fabry 整理而成

代码仍然很混乱,但它似乎可以工作,即使在IE 8上也是如此。我计划在存储库中发布它,但在此期间,您可以使用my current version. 要访问它,请在添加或编辑图像时单击“编辑图像”,它将取代常用的图像编辑器(它们很难组合)。由于大多数管理区域使用常规缩略图,而我的当前版本编辑帖子缩略图,因此代码似乎没有任何效果,但请通过显示帖子缩略图来尝试,您应该会看到它发生了变化。

此插件需要我的On-Demand Image Resizer, 这也是一个混乱,做实际的调整。

Example image in the cropper

SO网友:Wyck

最好的选择是使用基于javascript的图像裁剪,然后将php与ImageMagick或image GD结合使用。

它必须被写入您的函数或作为插件,因为我目前还不知道任何现成的wordpress插件,这令人惊讶。

有一个YUI图像裁剪和基于php的保存选项http://developer.yahoo.com/yui/examples/imagecropper/conn_crop.html

下面是一个关于如何在php中使用jquery裁剪器的不同教程http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop/

第三个选项与上面的链接非常相似,使用相同的jquery裁剪器,但代码不同。http://www.leonkessler.com/blog/?p=132

下面是另一个使用jquery的jcrop的示例,http://www.talkincode.com/jcrop-extension-implementation-in-php-932.html

谁想要一个新插件,这肯定会很受欢迎:)

SO网友:Raphael

您可能希望使用CSS以获得更大的灵活性,修复主题中的缩略图(如果需要)并避免文件混乱:

http://www.seifi.org/css/creating-thumbnails-using-the-css-clip-property.html

请记住,将加载整个图像,因此不要使用3MB原件。

根据1月的要求更新:如果您确实想要动态剪辑,请考虑:

对于用户=管理员,通过PHP创建CSS;您只需链接到读取适当设置并相应调整剪裁参数的php即可

SO网友:gabrielk

我们有时会使用一个名为WP Post Thumbnail的旧插件。它并不完美,最新版本的WP也有一些小错误(自2008年以来一直没有更新,因此不一定可靠)。http://wordpress.org/extend/plugins/wp-post-thumbnail/

SO网友:tomcat23

我相信您正在寻找:http://wordpress.org/support/topic/scissors-for-wordpress-29-also-works-on-30-hurray

我还没有尝试过这个,但它应该为您提供您想要的功能。

此处显示原始插件页面。http://wordpress.org/extend/plugins/scissors/

我也在做一个项目,需要这个。

SO网友:NetConstructor.com

我认为这个问题的最终解决方案是修改http://www.seoadsensethemes.com/wordpress-wp-post-thumbnail-plugin/

并对其进行自定义,以便在函数中定义任何自定义图像大小。php文件(使用add_image_size( \'new_thumb\', 200, 100, true ); ) 当您想要修改图像时,自动使用并获取代码以替换(或扩展)“编辑”链接。

利用这种方法,wordpress可以像往常一样继续创建其适用的图像大小,但如果您想专门修改任何特定图像的裁剪区域,您可以这样做,这反过来会替换自动生成的该大小的图像。嗯。。。虽然这听起来让人困惑,但再看一遍,我感觉到的正是我所缺少的。

目前,我相信该插件会将这些自定义图像大小保存到帖子中的自定义字段中,而不是保存适用图像的帖子。

相关推荐

Remove <p></p> after images

我对<p></p> 出现在my之后的标记<img....>. 以下是我在本地主机上查看生成的页面时显示的内容。。。<img src=\"/wp-content/themes/wunderful/assets/images/feedback-danielle.png\" alt=\"Danielle Johnson Deal Town FC Treasurer\"> <p></p> 请注意随机生成的<p>&

用户友好的剪贴缩略图? - 小码农CODE - 行之有效找到问题解决它

用户友好的剪贴缩略图?

时间:2010-09-13 作者:Jan Fabry

有没有办法让我的用户定义帖子缩略图的裁剪区域?缩略图始终是现有的帖子附件,我不希望为每个缩略图创建额外的附件。

帖子缩略图应为200x100像素,并且来自帖子中使用的图像之一。因此,在我的理想世界中,当您单击“设置特色图像”链接时,您将获得已包含图像的概览,当您单击其中一个图像时,您可以自己定义裁剪区域(移动或调整其大小,但保持2x1纵横比)。单击“确定”后,新的帖子缩略图将与原始附件一起保存(在_wp_attachment_metadata[\'sizes\'][\'post-thumbnail\'] 元数据字段),而不是作为新附件。不允许使用已经用作其他帖子缩略图的图像,或者至少给出警告。

我相信包含的图像编辑器将不适合我的需要,因为您可以选择编辑所有版本的图像,或常规缩略图,但不仅仅是后期缩略图。我还发现,知道我正在编辑的版本有点混乱,所以我认为我的用户会遇到更多的问题。

是否有一个插件可以满足我的需要,或者可以轻松扩展到我的需要?

更新:示例UI

我非常喜欢Mac OS X通讯簿图像选择器的界面:您可以选择一个图像,并通过滑块调整固定比例缩略图裁剪器的大小。也可以拖动基础图像。您可以将此想法扩展到多种图像大小(我有一个post-thumbnailpost-thumbnail-1/2 例如,这是该尺寸的一半)。让用户使用复选框选择他现在正在编辑的尺寸,并在屏幕上绘制适当的裁剪矩形。

The Address Book image cropper in action

6 个回复
最合适的回答,由SO网友:Jan Fabry 整理而成

代码仍然很混乱,但它似乎可以工作,即使在IE 8上也是如此。我计划在存储库中发布它,但在此期间,您可以使用my current version. 要访问它,请在添加或编辑图像时单击“编辑图像”,它将取代常用的图像编辑器(它们很难组合)。由于大多数管理区域使用常规缩略图,而我的当前版本编辑帖子缩略图,因此代码似乎没有任何效果,但请通过显示帖子缩略图来尝试,您应该会看到它发生了变化。

此插件需要我的On-Demand Image Resizer, 这也是一个混乱,做实际的调整。

Example image in the cropper

SO网友:Wyck

最好的选择是使用基于javascript的图像裁剪,然后将php与ImageMagick或image GD结合使用。

它必须被写入您的函数或作为插件,因为我目前还不知道任何现成的wordpress插件,这令人惊讶。

有一个YUI图像裁剪和基于php的保存选项http://developer.yahoo.com/yui/examples/imagecropper/conn_crop.html

下面是一个关于如何在php中使用jquery裁剪器的不同教程http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop/

第三个选项与上面的链接非常相似,使用相同的jquery裁剪器,但代码不同。http://www.leonkessler.com/blog/?p=132

下面是另一个使用jquery的jcrop的示例,http://www.talkincode.com/jcrop-extension-implementation-in-php-932.html

谁想要一个新插件,这肯定会很受欢迎:)

SO网友:Raphael

您可能希望使用CSS以获得更大的灵活性,修复主题中的缩略图(如果需要)并避免文件混乱:

http://www.seifi.org/css/creating-thumbnails-using-the-css-clip-property.html

请记住,将加载整个图像,因此不要使用3MB原件。

根据1月的要求更新:如果您确实想要动态剪辑,请考虑:

对于用户=管理员,通过PHP创建CSS;您只需链接到读取适当设置并相应调整剪裁参数的php即可

SO网友:gabrielk

我们有时会使用一个名为WP Post Thumbnail的旧插件。它并不完美,最新版本的WP也有一些小错误(自2008年以来一直没有更新,因此不一定可靠)。http://wordpress.org/extend/plugins/wp-post-thumbnail/

SO网友:tomcat23

我相信您正在寻找:http://wordpress.org/support/topic/scissors-for-wordpress-29-also-works-on-30-hurray

我还没有尝试过这个,但它应该为您提供您想要的功能。

此处显示原始插件页面。http://wordpress.org/extend/plugins/scissors/

我也在做一个项目,需要这个。

SO网友:NetConstructor.com

我认为这个问题的最终解决方案是修改http://www.seoadsensethemes.com/wordpress-wp-post-thumbnail-plugin/

并对其进行自定义,以便在函数中定义任何自定义图像大小。php文件(使用add_image_size( \'new_thumb\', 200, 100, true ); ) 当您想要修改图像时,自动使用并获取代码以替换(或扩展)“编辑”链接。

利用这种方法,wordpress可以像往常一样继续创建其适用的图像大小,但如果您想专门修改任何特定图像的裁剪区域,您可以这样做,这反过来会替换自动生成的该大小的图像。嗯。。。虽然这听起来让人困惑,但再看一遍,我感觉到的正是我所缺少的。

目前,我相信该插件会将这些自定义图像大小保存到帖子中的自定义字段中,而不是保存适用图像的帖子。

相关推荐

Images with overlay

我有一些图片在一个容器中,我想添加一个覆盖和图标。这不是现成的,但我找到了一些有用的代码:HTML:<div class=\"main\"> <span class=\"featured\"><img src=\"http://joshrodg.com/IMG_001-258x258.jpg\" title=\"\" alt=\"\"></span> </div> CSS:.featured {