Navigation
Archive / Add a play button to lightbox video
This is archived content. Visit our new forum.
  • Author
    Posts
  • May 6, 2015 at 11:06 am #267274
    carbagby
    Participant

    I am adding a video to my homepage that opens as a lightbox. From the static thumbnail, you can’t tell it’s a video to play so I want to add a hovering and responsive play button. I tried to add an icon, but that didn’t work. Any suggestions??

    need a play button

    May 6, 2015 at 4:26 pm #267535
    Friech
    Moderator

    Hi There,

    Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    Cheers!

    May 6, 2015 at 6:47 pm #267643
    carbagby
    Participant

    http://52.5.44.33/wordpress

    May 6, 2015 at 6:50 pm #267644
    carbagby
    Participant

    http://52.5.44.33/wordpress thank you!!

    May 6, 2015 at 10:32 pm #267797
    Rad
    Moderator

    Hi there,

    Please add this css at your child theme’s style.css (not customizer)

    a.x-video-icon {
position: relative;
}
a.x-video-icon:before {
content: "\f01d";
position: absolute;
font-family: "FontAwesome";
font-size: 150px;
top: 10%;
left: 38%;
color: rgba(255, 255, 255, 0.5);
}
a.x-video-icon:hover:before {
color: rgba(255, 255, 255, 1);
}

    Then add x-video-icon at your image shortcode’s class attribute/option.

    Eg. [image class="x-video-icon"]

    Hope this helps.

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-267274 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>