PHP video transformations

Last updated: Oct-18-2022

PHP video transformation overview

After uploading videos to Cloudinary, they can be transformed in many ways.

The syntax for transforming and delivering videos is generally the same as that for images, and you can apply the majority of available image transformations to video as well. For example, you can resize, crop, rotate, set video quality and format or use auto quality and/or auto_format, add text or image overlays to your videos, and more.

There are also a number of special options you can use for transforming and delivering video content. For example, you can adjust their size, shape, speed, duration, quality, and appearance. There are also some features that are specific to audio.

This section introduces you to the basics of PHP video streaming and transformation. For complete details on all video transformation functionality, see Video transformations and the Transformation URL API Reference.

PHP video transformation functionality

In addition to transformation features that are equally relevant for images and video, such as resizing, cropping, rotating, adding text or image overlays, and setting video quality or format, there are a variety of special transformations you can use for video. For example, you can:

You can optionally specify all of the above transformations to videos using methods that generate image tags or via direct URL-building directives.

Video tag helper method

You can optionally specify all of the above transformations within a VideoTag method, which automatically generates an HTML5 video tag including the transformation URL sources for the main formats supported by web browsers, as well as a poster thumbnail image. This enables the browser to automatically select and play the video format it supports. The video files are created dynamically when first accessed by your users.

For example:

Copy to clipboard
(new VideoTag('dog'))
    ->resize(Resize::pad(480, 360))
    ->videoEdit(VideoEdit::trim()->duration(10))
    ->quality(70)
    ->fallback('Your browser does not support HTML5 video tags.')
    ->setAttributes(['controls', 'loop']);

The above code results in the following HTML:

Copy to clipboard
<video controls loop poster="https://res.cloudinary.com/demo/video/upload/c_pad,h_360,w_480/du_10/q_70/dog.jpg">
  Your browser does not support HTML5 video tags.
  <source src="https://res.cloudinary.com/demo/video/upload/c_pad,h_360,w_480/du_10/q_70/vc_h265/dog.mp4" type="video/mp4; codecs=hev1">
  <source src="https://res.cloudinary.com/demo/video/upload/c_pad,h_360,w_480/du_10/q_70/vc_vp9/dog.webm" type="video/webm; codecs=vp9">
  <source src="https://res.cloudinary.com/demo/video/upload/c_pad,h_360,w_480/du_10/q_70/vc_auto/dog.mp4" type="video/mp4">
  <source src="https://res.cloudinary.com/demo/video/upload/c_pad,h_360,w_480/du_10/q_70/vc_auto/dog.webm" type="video/webm">
</video>

For details, see the video tag documentation.

Direct URL builder

The VideoTag method described above generates an HTML5 video tag. In certain conditions, you might want to generate a transformation URL directly, without the containing video tag. To return only the URL, use the video helper method, and call the toUrl() method.

Note
Instead of calling the toUrl()method you also have the option to cast the video method to a string (string)$cld->video(), or place the method inside a string "{$cld->video()}"

Here's an example:

Copy to clipboard
cld->video('docs/sunglasses.mp4')
    ->videoEdit(
        VideoEdit::trim()
            ->startOffset(7.5)
            ->endOffset(10.0)
    )
    ->effect(Effect::boomerang())
    ->resize(Resize::scale()->width(0.2))->toUrl();

// Output: "https://res.cloudinary.com/demo/video/upload/so_7.5,eo_10.0/e_boomerang/c_scale,w_0.2/v1/docs/sunglasses.mp4"

Video transformation examples

This section provides examples of using PHP code to apply some of the video transformation features mentioned in the previous section.

Example 1:

The following example resizes the dog video to 40% of it's original size and rotates it by 20 degrees. It also adds a semi-transparent cloudinary logo in the bottom right corner, using a southeast gravity with adjusted x and y coordinates to reach the corner of the rotated video.

PHP (cloudinary_php 2.x):
Copy to clipboard
(new VideoTag('dog.mp4'))
  ->rotate(Rotate::byAngle(20))
  ->resize(Resize::scale()->width(0.4))
  ->overlay(
      Overlay::source(Source::image('cloudinary_icon_white')
        ->transformation((new ImageTransformation())
          ->resize(Resize::scale()->width(60))
          ->adjust(Adjust::opacity(50))))
      ->position((new Position())
        ->gravity(Gravity::compass(Compass::southEast()))
        ->offsetX(60)->offsetY(15)
  ));

Example 2:

The following example adjusts the brightness of a skiing video, and sets its radius to max in order to give a telescope-like effect. It then appends a copy of the video in reverse, and then plays it forwards again in slow motion.

PHP (cloudinary_php 2.x):
Copy to clipboard
(new VideoTag('ski_jump.mp4'))
  ->videoEdit(
      VideoEdit::concatenate(Concatenate::videoSource('ski_jump')
        ->transformation((new VideoTransformation())
          ->effect(Effect::reverse()))))
    ->videoEdit(
        VideoEdit::concatenate(Concatenate::videoSource('ski_jump')
          ->transformation((new VideoTransformation())
            ->effect(Effect::accelerate()->rate(-50)))))
          ->roundCorners(RoundCorners::max())
          ->adjust(Adjust::brightness()->level(10));

Example 3:

The following example generates a <video> tag for a video that will loop continuously in an HTML5 video player with default controls. When the video loads a default poster is displayed based on the middle frame of the video. The tag automatically includes the source URLs for all supported formats, with the requested transformations: use the first 10 seconds of the original video, pad to 480x360, and generate at 70 quality to control file size.

Copy to clipboard
(new VideoTag('dog'))
    ->resize(Resize::pad(480, 360))
    ->videoEdit(VideoEdit::trim()->duration(10))
    ->quality(70)
    ->fallback('Your browser does not support HTML5 video tags.')
    ->setAttributes(['controls', 'loop']);

Example 4:

The following example uses direct URL building. It delivers the 2 seconds of a video between seconds 1 and 3 and loops 3 times. The video is resized to a fraction of its width.

Copy to clipboard
cld->video('docs/sunglasses.mp4')
  ->resize(Resize::scale()->width(0.2))
  ->videoEdit(VideoEdit::trim()->startOffset(1.0)
->endOffset(3.0))
  ->effect(Effect::loop(3))->toUrl();

Example 5:

The following example uses direct URL building. It delivers the 2.5 seconds of a video between seconds 7.5 and 10 with a light blue border, and then appends a boomeranged (reversed) version of that same clip, resizing the video to a fraction of its original size. An overlay is applied to the top right corner (north_east) of the video with a height 25 pixels and opacity of 90.

Copy to clipboard
cld->video('docs/sunglasses.mp4')
    ->videoEdit(VideoEdit::trim()->startOffset(7.5)->endOffset(10.0))
    ->effect(Effect::boomerang())
    ->resize(Resize::scale()->width(0.2))
    ->overlay(
        Overlay::source(
            Source::image('cloudinary')
                ->transformation(
                    (new ImageTransformation())
                        ->adjust(Adjust::opacity(90))
                        ->resize(Resize::scale()->height(25))
                )
        )
        ->position(
            (new Position())
                ->gravity(
                    Gravity::compass(Compass::northEast())
                )
        )
    )->toUrl();
  ));

See also

✔️ Feedback sent!

Rate this page: