The safest approach is to create a new MP4, keep the original GIF, embed the MP4 with the Video block, and test it before deleting the old file. A video may be smaller than an equivalent GIF, but the reduction depends on the content, resolution, duration, and encoding settings. The workflow below is suitable for short animated GIFs that do not require transparency.
You need permission to edit the post and upload media to WordPress 7.1, the original GIF, a conversion tool such as FFmpeg, and a phone for testing. This does not require SSH, DNS changes, firewall configuration, web-server changes, database changes, PHP, or PHP-FPM if the current upload limit is sufficient; only a server administrator should change those limits.
When Should You Convert a GIF to Video?
Consider converting a GIF when it illustrates only a short motion, fills the frame, or has a solid background and is using substantial storage. Do not assume that MP4 is always smaller: compare file sizes at a similar perceived quality after encoding. In a web.dev example, one animation fell from 3.7 MB as a GIF to 551 KB as an MP4 and 341 KB as a WebM file; this is an illustration, not a fixed saving for every file (according to web.dev).
| Case | Initial choice | What to check |
|---|---|---|
| Short animation with a solid background or full-frame coverage | MP4 | Compare file size, colors, and text clarity. |
| Further optimization is needed and providing multiple formats is acceptable | MP4, with WebM as a possible addition | Check the browser, theme, and how WordPress serves each source. |
| Transparency is required | Keep the GIF or try a format with an alpha channel | A standard H.264 MP4 is not a safe choice for transparent backgrounds. |
| Users must start playback themselves | Video with controls and no autoplay | Do not enable autoplay; add a poster and keep the controls. |
| It is only a still image or has very little motion | Still image, WebP, or AVIF | Make sure the motion does not convey essential information. |
If the GIF contains small text, transparency, unusual colors, or fast motion, treat the MP4 as a test version. You can also refer to how to optimize AVIF and HEIC images in WordPress when choosing a format for images that do not need motion.
Prepare and Keep a Fallback
- Download the original GIF to your computer and do not overwrite it.
- Record the file size, frame dimensions, duration, and aspect ratio. You can view this information with a video player or media-analysis tool.
- Record the post, page, or block that currently uses the GIF. If you know the media URL, save it for comparison.
- Check the upload limit in Media → Add New. If the MP4 exceeds the limit, reduce the video’s dimensions first; only the hosting administrator should change server limits after assessing the impact.
- Do not delete the GIF from the Media Library until you have tested the post and confirmed that nothing else still references the file.
Create an MP4 from a GIF with FFmpeg
FFmpeg runs on your computer, not in the WordPress dashboard. Install FFmpeg from its official website or a trusted package manager for your operating system. After installation, open Terminal on macOS or Linux, or Command Prompt or PowerShell on Windows, and run the version-check command:
ffmpeg -version
If version information appears, FFmpeg is ready. If you receive a “command not found” or “is not recognized” error, reinstall it and make sure the directory containing the executable has been added to PATH, or invoke FFmpeg with its full path.
Place the GIF in an easy-to-find folder. In Terminal or Command Prompt, move to that folder with cd, then replace input.gif with the source filename and output.mp4 with the output filename:
ffmpeg -i "input.gif" -c:v libx264 -crf 23 -pix_fmt yuv420p -movflags +faststart -an "output.mp4"
The command above creates a silent H.264 video, uses a broadly compatible pixel format, and moves the index required for streaming to the beginning of the file. The value crf is a starting point, not a guarantee of fixed quality: a lower value generally produces higher quality and a larger file; a higher value generally produces a smaller file but can make noise or loss of detail more apparent. FFmpeg’s documentation describes the relevant codecs and encoding options (according to ffmpeg.org).
Once the command finishes, open output.mp4 in a media player on your computer. The expected result is a video that plays through, preserves the correct aspect ratio, contains no unintended audio, and retains all important details. If the file is too large, try again with -crf 26; if text looks blurry, try a lower value such as -crf 20. These are starting values to test, as the result also depends on the source GIF.
Troubleshooting common conversion issues
- The file is still too large: Slightly increase the CRF value or reduce the video width, then check the text and motion details again.
- The video is distorted: Do not stretch it in the editor; preserve the original aspect ratio and check the theme’s CSS.
- Transparency is lost: A standard MP4 does not preserve an alpha channel like a GIF with a transparent background; keep the GIF or try a format that supports an alpha channel.
- The colors have changed: Compare the result with the original GIF in the same media player; if color or text is important, prioritize readability rather than reducing file size alone.
- The first frame is unsuitable: Use a separate poster image in the Video block instead of selecting a poor frame as the thumbnail.
Upload the MP4 to WordPress 7.1
- Sign in to the WordPress administration area with an account that has permission to upload media.
- Go to Media → Add New, or open the post you need to edit directly.
- Upload the file
output.mp4and wait for the process to finish. - Open the media details to verify that the file appears in the Media Library, has a URL, and can be previewed.
- If WordPress reports that the file exceeds the limit, do not change the file extension to bypass the restriction. Reduce the file size or ask the hosting administrator to check the upload limit, available storage, and current PHP configuration.
WordPress supports uploading videos and selecting existing files from the Media Library through the Video block. Button labels may vary slightly depending on the interface language, but the basic path and functionality correspond to the official documentation (see WordPress.org; WordPress.org).
Replace the GIF with a Video block

- Open the post or page that contains the old GIF.
- Keep the GIF in the post while testing, or create a draft before replacing content that has already been published.
- Click the +, search for Video and select Media Library.
- Select the file
output.mp4you uploaded. - In the Video block settings, enable Autoplay, Loop, Muted and Play inline if the goal is to mimic a GIF.
- Enable Controls if users need to pause or seek through the video. If you disable the controls to create a GIF-like experience, make sure the content does not require users to stop or adjust the video.
- Select Poster image if the first frame is unsuitable or a replacement image is needed before the video loads.
- Save the draft or update the post, then view the page outside the administration area.
Autoplay generally works reliably only when the video is muted; this is why Muted must be used together with Autoplay. Loop creates a repeating loop, while Play inline asks the video to play within the content area on supported devices rather than prioritizing full-screen playback. Browsers or devices may still apply their own policies, so autoplay should never be treated as absolutely guaranteed.
The Video block supports options such as a poster image, captions and playback controls, depending on the block’s configuration (according to WordPress.org).
When to Use Custom HTML
Use custom HTML only when the theme or a specialized layout requires it. Replace https://example.com/wp-content/uploads/ten-video.mp4 with the actual file URL from the Media Library; do not leave the example URL unchanged:
<video autoplay loop muted playsinline controls>
<source src="https://example.com/wp-content/uploads/ten-video.mp4" type="video/mp4">
Trình duyệt của bạn không hỗ trợ video HTML5.
</video>
For beginners, the Video block is usually more suitable because WordPress manages the media URL and settings through the interface. After inserting the HTML, open the preview and check both the desktop and mobile layouts; valid HTML may still be constrained by the theme’s CSS or change how the video is displayed.
Check Before Deleting the GIF
- Open the post URL in a private window to avoid confusing the preview with the version shown to logged-in administrators.
- Check whether the video appears at the correct width, aspect ratio and position.
- On a phone, confirm that the video autoplays when muted, loops and plays inline as intended.
- Test on a slow connection or use DevTools to check whether the poster appears before the video loads.
- Compare the text, arrows, captions, colors, playback speed and final frame with the original GIF.
- Compare the file sizes and the actual amount of data transferred; do not compare file extensions alone.
- Search the post, page and related blocks to ensure that the old GIF URL is no longer a required resource.
Delete the GIF only after the updated post has been stable and you have confirmed that no other post, page or block still references it. Deleting media can break content that uses the old URL (according to WordPress.org).
Rollback When the Video Is Not Suitable
- Keep the original GIF in the Media Library.
- Open the post and remove the Video block, or use Undo if you have just made the change.
- Reinsert an Image block or another block suitable for the GIF in your editor.
- Select the original GIF from the Media Library and save the post.
- Open the public-facing page on both a desktop computer and a phone to confirm that the content has been restored.
- Delete the test MP4 only after confirming that no block or page still uses it.
Roll back if the video removes transparency, makes the text difficult to read, significantly distorts the colors, fails to play on the target device, or creates a worse experience. Reducing file size is not more important than keeping the content accessible.
Completion Checklist
- The original GIF has been retained, and the locations where the file is used have been recorded.
- Ran
ffmpeg -versionand created an MP4 from the correct source file. - Opened the MP4 outside WordPress to check its quality, playback speed, colors and aspect ratio.
- Uploaded the MP4 to the Media Library without exceeding the file-size limit.
- Inserted the MP4 with the Video block and selected Autoplay, Loop, Muted and Play inline where appropriate.
- Selected a poster image or enabled controls when required for the intended experience.
- Checked the published version on a desktop, a phone and a slow connection.
- Confirmed that the old GIF is no longer referenced before deleting it.
- Know how to restore the GIF if the video reduces quality or usability.

