wordpress动画效果_如何在WordPress中添加动画GIF

本文介绍了在WordPress中添加动画GIF时,为何GIF会变为静态图像,以及如何通过选择完整尺寸来确保GIF保持动画效果。此外,还提供了使用Giphypress插件方便添加GIF的建议,以及关于大型GIF可能影响网站速度的提示。
摘要由CSDN通过智能技术生成

wordpress动画效果

Do you want to add animated GIFs in your WordPress blog posts? Sometimes when you add an animated GIF in WordPress, it loses the animation and appears as a plain static image. In this article, we will show you how to properly add animated GIFs in WordPress.

您是否要在WordPress博客文章中添加动画GIF? 有时,当您在WordPress中添加动画GIF时,它会丢失动画并显示为纯静态图像。 在本文中,我们将向您展示如何在WordPress中正确添加动画GIF。

How to add animated GIFs in WordPress
为什么动画GIF在WordPress中成为静态图片? (Why Animated GIFs Become a Static Image in WordPress?)

WordPress comes with an easy to use media uploader which allows you to add images to your WordPress posts or pages. When you upload an image using the media uploader, WordPress automatically creates several copies of that image in different sizes.

WordPress随附一个易于使用的媒体上传器,可让您将图像添加到WordPress帖子或页面中。 当您使用媒体上传器上传图像时,WordPress会自动为该图像创建不同尺寸的多个副本。

There are three default WordPress image sizes: thumbnail, medium, and large. It also keeps your original image in full size.

WordPress共有三种默认图像尺寸 :缩略图,中和大。 它还可以使原始图像保持完整尺寸。

Image sizes in WordPress

When creating new image sizes for animated GIFs, WordPress ends up saving only the first frame of the GIF.

当为动画GIF创建新的图像尺寸时,WordPress最终仅保存GIF的第一帧。

Now if you add any of those image sizes into your post or page, they will be static GIF images with no animation.

现在,如果您将任何这些图像大小添加到帖子或页面中 ,它们将是没有动画的静态GIF图像。

Having said that, let’s take a look at how to properly add animated GIFs in WordPress without losing animation.

话虽如此,让我们看一下如何在WordPress中正确添加动画GIF而不丢失动画。

在WordPress中正确添加动画GIF (Properly Adding Animated GIFs in WordPress)

First, you need to edit the post or page where you want to add the animated GIF and click on the Add Media button.

首先,您需要编辑要在其中添加动画GIF的帖子或页面,然后单击“添加媒体”按钮。

Add media

This will bring up the WordPress media uploader popup. You need to click on the upload files button and select the animated GIF file from your computer to upload it.

这将弹出WordPress媒体上传器弹出窗口。 您需要单击“上传文件”按钮,然后从计算机中选择动画GIF文件进行上传。

After uploading the file, select the ‘full size’ under the ‘Attachment Display Settings’ section on the right.

上载文件后,在右侧的“附件显示设置”部分下选择“完整大小”。

Select full size

After that click on the ‘Insert into post’ button to continue.

之后,点击“插入帖子”按钮继续。

WordPress will now insert your animated GIF in the post editor.

WordPress现在将在帖子编辑器中插入动画GIF。

This full size image is the original animated GIF you uploaded to WordPress. You will be able to see the animation right away in the visual post editor.

此全尺寸图片是您上传到WordPress的原始动画GIF。 您将可以在可视化帖子编辑器中立即查看动画。

Preview of an animated GIF in WordPress post editor

You can now continue editing your post or save to preview it.

您现在可以继续编辑您的帖子或保存以预览。

在WordPress中使用动画GIF的额外提示 (Bonus Tips on Using Animated GIFs in WordPress)

Animated GIF images are usually larger in file size than other image files. That’s because they contain several compressed images used as frames to create the animation.

动画GIF图像的文件大小通常比其他图像文件大。 那是因为它们包含几个用作帧来创建动画的压缩图像。

Adding too many GIF images on a WordPress page can slow down your website. See our ultimate guide on how to improve WordPress speed and performance for more details.

在WordPress页面上添加太多GIF图片可能会降低您的网站速度。 有关更多详细信息,请参见有关如何提高WordPress速度和性能的最终指南。

If you use Giphy to find animated GIFs, then you may find the Giphypress plugin to be very useful. It allows you to search the Giphy database from your WordPress admin area and add GIFs without leaving your site. For more details see our guide on how to add GIFs from Giphy in WordPress using Giphypress.

如果您使用Giphy查找动画GIF,则可能会发现Giphypress插件非常有用。 它允许您从WordPress管理区域搜索Giphy数据库并添加GIF,而无需离开您的站点。 有关更多详细信息,请参见有关如何使用Giphypress在WordPress中从Giphy添加GIF的指南

We hope this article helped you learn how to add animated GIFs in WordPress. You may also want to see our list of 22 great WordPress plugins for managing images.

我们希望本文能帮助您学习如何在WordPress中添加动画GIF。 您可能还想查看我们的22个用于管理图像的WordPress插件的列表。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

如果您喜欢这篇文章,请订阅我们的YouTube频道 WordPress视频教程。 您也可以在TwitterFacebook上找到我们。

翻译自: https://www.wpbeginner.com/wp-tutorials/how-to-add-animated-gifs-in-wordpress/

wordpress动画效果

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值