• Resolved jtm12

    (@jtm12)


    After updating this plugin, I noticed that the play button over my videos changed from a static play button to a spinning play button.

    I would like to go back to a static button.

    I see that the button has a class of vjs-big-play-button.

    Would the old button still exist in the plugin, allowing me to use it, or do I need to create my own play button icon?

    And what is the best option for overriding the spinning one?

    Thank you.

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor wpvideogallery

    (@wpvideogallery)

    Kindly try adding the following PHP code to the bottom of your theme’s functions.php file,

    function aiovg_custom_player_css() {
        echo '<style type="text/css">#player:hover .vjs-big-play-button, #player:focus .vjs-big-play-button { transform: none !important; }</style>';
    }
    add_action( 'aiovg_player_head', 'aiovg_custom_player_css' );

    This should remove the spinning effect.

    Thread Starter jtm12

    (@jtm12)

    As always, thank you for the excellent help. That worked perfectly.

    For anyone who wants to put it back the way it was:

    function aiovg_custom_player_css() {
        echo '<style type="text/css">
                #player .vjs-big-play-button {
                    border-radius: 50%;
                    background: unset;
                    background-color: rgba(43,51,63,.7);
                    width: 80px;
                    height: 80px;
                    margin-top: -40px;
                    margin-left: -40px;
                    transition: all .4s;
                }
                #player .vjs-big-play-button .vjs-icon-placeholder {
                    display: block;
                }
                #player .vjs-big-play-button .vjs-icon-placeholder:before {
                    content: "\f101";
                    font-family: VideoJS;
                    font-weight: 400;
                    font-style: normal;
                    text-align: center;
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    font-size: 1.7em;
                    line-height: 1.6em;
                }
                #player:hover .vjs-big-play-button,
                #player:focus .vjs-big-play-button {
                    transform: none !important;
                    background: rgba(115,133,159,.5);
                }
            </style>';
    }
    add_action( 'aiovg_player_head', 'aiovg_custom_player_css' );
Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Replace spinning play button with static button’ is closed to new replies.