• Resolved ellieender

    (@rebeccaprf)


    Preface: I did not develop this site. Inherited from another developer no longer with the organization. Video has all of a sudden shrunk down to 25% of space on any pages with a video. I’ve tried resizing the video and recreating the hero block. The video fills up the whole space in the editor, but on the front end it only fills 25%.

    Anyone have suggestions as to why this is happening? Theme is a custom theme made by previous developer. Uses Gutenberg WP editor.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter ellieender

    (@rebeccaprf)

    I’ve tried deactivating all the plugins in a duplicate test site–but that didn’t solve the issue. None of the plugins are involved with design (gravity forms, Jetpack, google analytics, etc)

    Hi @rebeccaprf,

    Have you checked it on your test site with the default theme (2024 or 2025)? It may help to track the issue.

    Refer to the following tutorial for more details: https://learn.wordpress.org/lesson/embedding-media-and-third-party-content-on-your-website/

    Moderator threadi

    (@threadi)

    With Magnitude 2021, you’re using a custom theme. It contains the following CSS property:

    video.wp-block-cover__video-background { transform: translateX(-50%) translateY(-50%); }

    Once this is removed, the video will be displayed full-screen. More specifically, the code is located in this file: /wp-content/themes/magnitude2021/assets/css/styles.css

    My recommendation would therefore be:
    1. Check why this property exists in the first place. It may be relevant for displaying videos in that specific location.
    2. Contact the person who provided you with the theme. They should either adjust the code or provide an exception so that your video displays correctly.

    Thread Starter ellieender

    (@rebeccaprf)

    @threadi Thanks for the suggestions. I’ll see what I can find out by modifying the theme file in a test environment. I’ve also reached out to the developer.

    Rather than editing the theme’s styles.css (an update would wipe it), put the override in a child theme or Additional CSS. Reset the transform on that video and give it full width and height with object-fit: cover. Test with the cover block set to ‘full width’, since the original rule may exist for the narrow layout.

Viewing 5 replies - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.