RMRS

STANDARD OPERATION PROCEDURES (SOPs)

  • Writer SOPs
  • Content Management SOPs
  • Copywriting SOPs
  • Onboarding/Offboarding SOPs
  • Standard Operation Procedures

Infusionsoft – SOP to create optin form

January 25, 2018 Yuri

How to create optin forms and incorporate them into WordPress web-site via OptimizePress.

… Read the rest

SOP | Tech embed, infusionsoft, optimizepress, optin, subscriber, user

SOP – Embed YouTube Videos Lightly and Mobile Responsive

October 17, 2016 Yuri

2016-10-17_13-48-14

 <div class="youtube-player" data-id="XXXXXXX"></div>

1. Find YouTube video id. Just watch the video on YouTube and click share. You will get the URL like this:

 https://youtu.be/n8yLEsWPg-0

The last part after slash is the ID you need: https://youtu.be/……n8yLEsWPg-0

2. Place this exact code and replace the “XXXXXX” ID with the one you’ve got in the first step above.

 <div class="youtube-player" data-id="XXXXXXX"></div>

Video to explain:

The script comes from Labnol

Script:

     <script>
     
        /* Light YouTube Embeds by @labnol */
        /* Web: http://labnol.org/?p=27941 */
     
        document.addEventListener("DOMContentLoaded",
            function() {
                var div, n,
                    v = document.getElementsByClassName("youtube-player");
                for (n = 0; n < v.length; n++) {
                    div = document.createElement("div");
                    div.setAttribute("data-id", v[n].dataset.id);
                    div.innerHTML = labnolThumb(v[n].dataset.id);
                    div.onclick = labnolIframe;
                    v[n].appendChild(div);
                }
            });
     
        function labnolThumb(id) {
            var thumb = '<img src="https://i.ytimg.com/vi/ID/hqdefault.jpg">',
                play = '<div class="play"></div>';
            return thumb.replace("ID", id) + play;
        }
     
        function labnolIframe() {
            var iframe = document.createElement("iframe");
            var embed = "https://www.youtube.com/embed/ID?autoplay=1";
            iframe.setAttribute("src", embed.replace("ID", this.dataset.id));
            iframe.setAttribute("frameborder", "0");
            iframe.setAttribute("allowfullscreen", "1");
            this.parentNode.replaceChild(iframe, this);
        }
     
    </script>

CSS:

     .youtube-player {
        position: relative;
        padding-bottom: 56.23%;
        /* Use 75% for 4:3 videos */
        height: 0;
        overflow: hidden;
        max-width: 100%;
        background: #000;
        margin: 5px;
    }
    
    .youtube-player iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 100;
        background: transparent;
    }
    
    .youtube-player img {
        bottom: 0;
        display: block;
        left: 0;
        margin: auto;
        max-width: 100%;
        width: 100%;
        position: absolute;
        right: 0;
        top: 0;
        border: none;
        height: auto;
        cursor: pointer;
        -webkit-transition: .4s all;
        -moz-transition: .4s all;
        transition: .4s all;
    }
    
    .youtube-player img:hover {
        -webkit-filter: brightness(75%);
    }
    
    .youtube-player .play {
        height: 72px;
        width: 72px;
        left: 50%;
        top: 50%;
        margin-left: -36px;
        margin-top: -36px;
        position: absolute;
        background: url("//i.imgur.com/TxzC70f.png") no-repeat;
        cursor: pointer;
    }
… Read the rest

SOP | Tech embed, mobile optimized, responsive, video, Youtube

The Team

  • Dane Macato (3)
  • Gavin Parker (2)
  • Jamie Briones (9)
  • Jane Flores (19)
  • Michael Medina (4)
  • RMRS1 (109)
  • Thomas Marshall (3)
  • Tina Myk (23)
  • Yuri (103)

MOST VIEWED

  • How to insert a GIF in Ma... 4.8k views | by RMRS1
  • Ideal Image size for Chat... 4.5k views | by RMRS1
  • Antonio Centeno’s S... 3.5k views | by RMRS1
  • Color trends for men and... 2.4k views | by Tina
  • SOP – Embed YouTube... 2.3k views | by Yuri
  • Refund Email Templates SO... 1.7k views | by RMRS1
  • Email Management SOP 1.4k views | by jamie
  • SOP To Add Secondary User... 1.3k views | by Yuri
  • Finding CTR Click Through... 1.3k views | by RMRS1
  • Creating ClickFunnels Spl... 1.2k views | by Yuri
  • RMRS Team Holidays 1.2k views | by jamie
  • Checklist For Writing An... 0.9k views | by RMRS1
  • Thumbnail Creation Checkl... 853 views | by RMRS1
  • Payment Systems for RMRS... 800 views | by jamie
  • SOP – Create or Del... 767 views | by Jane
  • SOP Infusionsoft –... 712 views | by Yuri
  • Zoom – SOP To Sched... 683 views | by Yuri
  • DeadlineFunnel – Ho... 682 views | by Yuri
  • Infusionsoft – Camp... 609 views | by Yuri
  • SOP To Create Amazon Affi... 607 views | by Yuri

Copyright © 2021 · RealMenRealStyle - Standard Operation Procedures ·

Copyright © 2021 · Daily Dish Pro Theme on Genesis Framework · WordPress · Log in