Presto Player Aspect Ratio

Our player automatically matches YouTube videos to standard aspect ratios (1:1, 4:3, 16:9, etc.). If the aspect ratio of the video is not set correctly, you can change the aspect ratio of Presto Player videos according to your requirements by using a custom filter code.

Go through the below sections of this help document to know more about how you can add this custom filter code.

Changing the Aspect Ratio for All Videos

To change the aspect ratio of all Presto Player videos on your website, you can add the following code snippet to the functions.php file of your child theme:

add_action('wp_footer', function () { ?>
    <script>
        jQuery(function() {
            if (!wp || !wp.hooks) return;
            wp.hooks.addFilter('presto.playerSettings', 'pp-set-aspect-ratio', function(settings) {
                settings.ratio = '9:16';
                return settings;
            });
        });
    </script>
<?php });

Changing the Aspect Ratio for Individual Videos

If you want to change the aspect ratio of individual videos on your website, use the following code snippet.

This filter will be invoked for each individual player setting, allowing you to check the settings.id of the player in the callback and set the aspect ratio accordingly, so it can be different for each video:

add_action('wp_footer', function () { ?>
    <script>
        jQuery(function() {
            if (!wp || !wp.hooks) return;
            wp.hooks.addFilter('presto.playerSettings', 'pp-set-custom-aspect-ratio', function(settings) {
                switch(settings.id) {
                    case 4:
                        settings.ratio = '16:9';
                        break;
                    case 3:
                        settings.ratio = '9:16';
                        break;
                    // Add more cases as needed
                    default:
                        // Default case if no match is found
                        settings.ratio = '16:9';
                        break;
                }
                return settings;
            });
        });
    </script>
<?php });

Depending on the Video ID, the aspect ratio (settings.ratio) of the video player is set accordingly. For example, if the Video ID is 3, the aspect ratio will be set to 9:16 in this case.

How to Find the Video ID

You can find the Video ID by inspecting the website where you have the Presto Player video embedded.

Right-click on the video, select “Inspect” and look for the class attribute. For example, you might see something like class=”presto-video-id-49 presto-preset-id-1 skin-modern hydrated”. In the below attached screenshot, 49 is the Video ID.

If you have any further questions about aspect ratios, feel free to contact our support. We’re here to help you!