សេចក្តីប្រកាសៈ អត្ថបទរបស់ពួកយើងត្រូវបានផ្លាស់ប្តូរទៅកាន់ប្លក់ថ្មីដែលមានអាសយដ្ឋាន https://rithisethtes.blogspot.com ហើយពួកយើងនឹងបិទប្លក់នេះក្នុងពេលខាងមុខ សូមអរគុណ!

របៀបតម្លើង បញ្ជីចាក់វីដេអូនៅលើប្លក់

​​   ថ្ងៃនេះខ្ញុំនឹងបង្ហាញអំពីរបៀបតម្លើងបញ្ជីចាក់វីដេអូផ្សេងៗ នៅលើ ប្លក់ដែលវីដេអូទាំងអស់នោះ អ្នកអាចទាញ តំណភ្ជាប់ពី Facebook YouTube Google Drive Vimeo... -ល- ដើម្បីឲវាបង្ហាញនៅលើ ប្លក់របស់អ្នក។ ម៉ោះ! ទៅអនុវត្តតម្លើងជាមួយខ្ញុំទាំងអស់គ្នានៅខាងក្រោមនេះតែម្តង។

១-សូមចូលទៅកាន់គណនីប្លក់របស់អ្នក
២-ចូលទៅកាន់ Theme បន្ទាប់មក Edit HTML
៣-ចម្លងកូដខាងក្រោមដាក់ពីខាងក្រោម​ <head>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous"/>
៤-ចម្លងកូដខាងក្រោមដាក់ពីខាងលើ​ </head>
<style type='text/css'>
.sd_player{margin-top:5px;width:100%;height:100%;overflow:hidden;font-size:12px;background-color:#000}
.sd_player *{margin:0;padding:0}
.sd_player a{text-decoration:none}
.sd_player li{list-style:none}
.sd_video{width:100%;background-color:#000;position:relative;overflow:hidden}
.sd_loading{position:absolute;text-align:center;bottom:41.5%;right:44%;color:#FBC02D;font-size:500%;z-index:9999;display:none;background-color:#;padding:5px}
.sd_video iframe{width:100%;height:100%;position:absolute;top:0;left:0;display:none;background-color:#000}
.sd_server{width:100%;height:100%;position:absolute;top:0;left:0;display:none}
.sd_server video{width:100%;height:100%;background-color:#000}
.sd_list{width:100%;overflow:auto;border-top:1px solid #333}
.sd_list li{clear:both;border-left:5px solid #444;border-bottom:1px solid #333;overflow:hidden;cursor:pointer}
.sd_list .selected{border-left:4px solid #FBC02D;background-color:#222222;border-right:2px solid #FBC02D}
.sd_list img{float:left;width:50px;height:45px}
.sd_list div{text-indent:10px;color:#fff}
.sd_list div h2{width:100%;font-size:120%;text-align:left;margin:0;font-weight:400;color:#fff}
.sd_list div p{width:100%;color:#fff!important;font-size:100%}
.sd_list div p a{color:#fff!important;margin-left:10px;line-height:1.7em;}
.sd_control{width:100%;height:35px;line-height:30px;background-color:#444;text-align:center;padding-top: 5px;}
.sd_btn{height:23px;line-height:20px;padding:8px 14px;color: #fff;background-color:#FBC02D;cursor:pointer;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;margin-left:2px;margin-right:2px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;text-transform:uppercase}
.sd_control .active{background-color:#000}
.sd_desktop .sd_video{float:left;height:100%}
.sd_desktop .sd_videos{float:left;height:100%}
.sd_desktop .sd_btn span{display:none}
.sd_desktop .sd_list{border-top:0}
.sd_desktop .sd_btn{padding:2px 10px;margin-left:5px;margin-right:5px}
.sd_player i.fab.fa-google-drive{background:linear-gradient(to right, #1FA463 60%,#FFD04B 85%,#4688F4 70%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.sd_player i.fab.fa-mixcloud{color:#A6FF1D}
.sd_player i.fab.fa-youtube{color:#DA5E4C}
.sd_player i.fab.fa-vimeo{color:#1ab7ea}
.sd_player i.fas.fa-video{color:#3E8B79}
.sd_player i.fab.fa-facebook{color:#3b5998}
</style>
៥-ចម្លងកូដខាងក្រោមដាក់ពីខាងលើ​ </head>
<script type='text/javascript'>
    var options = {
        'player_container': '#player',
        'player_ratio': '16:9',
        'player_mobile_on_width': '600',
        'player_desktop_video_width': '70%',
        'automatic_response': false
    }
</script>
៦-ចម្លងកូដខាងក្រោមដាក់ពីខាងលើ​ </body>
<script type='text/javascript'>
//<![CDATA[
function Video_player(i){if("undefined"!=typeof $){if(void 0!==i.player_list){var e,s,d=[],t=[],n=[],a=[],l="",o=0,f=0,r=7,c=4,p=50,v=$(i.player_container),h=v.width(),_=i.player_ratio.split(":");_=_[1]/_[0];for(var u=0;u<i.player_list.length;u++)d.push(i.player_list[u].file),t.push(i.player_list[u].title),n.push(i.player_list[u].description),a.push(i.player_list[u].image);l+='<div class="sd_player">',l+='<div class="sd_video"><span class="sd_loading" ><i class="fas fa-spinner fa-pulse fa-fw"/></span>',l+='<iframe id="video_player" src="" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>',l+='<div class="sd_server"></div>',l+="</div>",l+='<div class="sd_videos">',l+='<ul class="sd_list"></ul>',l+='<div class="sd_control">',l+='<span class="sd_prevPage sd_btn"><i class="fas fa-chevron-left"></i><i class="fas fa-chevron-left"></i></span>',l+='<span class="sd_prev sd_btn"><i class="fas fa-chevron-left"></i></span>',l+='<span class="sd_next sd_btn"><i class="fas fa-chevron-right"></i></span>',l+='<span class="sd_nextPage sd_btn"><i class="fas fa-chevron-right"></i><i class="fas fa-chevron-right"></i></span>',l+="</div>",l+="</div>",l+="</div>",v.html(l),l="";for(u=0;u<t.length;u++)l+="<li>",l+='<img style="width: 80px !important; height: 50px !important; " src="',m(d[u])?l+="http://i3.ytimg.com/vi/"+m(d[u])+"/hqdefault.jpg":d[u].indexOf("vimeo")>-1?l+="https://i.imgur.com/nJXkbuG.png":d[u].indexOf("vid")>-1?l+="https://i.imgur.com/nJXkbuG.png":d[u].indexOf("google")>-1?l+="https://i.imgur.com/nJXkbuG.png":l+=a[u],l+='" />',l+="<div>",l+='<h2 style="text-align:left;">',l+='<i class="',m(d[u])?l+="fab fa-youtube":d[u].indexOf("vimeo")>-1?l+="fab fa-vimeo":d[u].indexOf("google")>-1?l+="fab fa-google-drive":d[u].indexOf("sd")>-1?l+="fas fa-video":d[u].indexOf("vid")>-1?l+="fab fa-facebook":l+="fa-file",l+="",l+='"></i> ',l+=t[u]+"</h2>",l+="<p>  https://rithiseth.blogspot.com  </p>",l+="</div>",l+="</li>";v.find(".sd_list").html(l);for(u=0;u<t.length;u++)d[u].indexOf("vimeo")>-1&&$.ajax({type:"GET",url:"http://vimeo.com/api/v2/video/"+d[u].substring(d[u].lastIndexOf("/")+1)+".json",jsonp:"callback",dataType:"jsonp",indexValue:u,success:function(i){var e=i[0].thumbnail_large;v.find(".sd_list").find("li").eq(this.indexValue).find("img").attr("src",e)}});$.getScript("http://f.vimeocdn.com/js/froogaloop2.min.js"),$.getScript("http://www.youtube.com/iframe_api");var g=!1;window.onYouTubeIframeAPIReady=function(){w()},v.find(".sd_list").click(function(){s=!0}),v.find(".sd_list").find("li").outerHeight(p),v.find(".sd_list").find("li").each(function(i){$(this).click(function(){var e,t;(o=i,v.find(".sd_list").find("li").eq(i).hasClass("selected"))||(v.find(".sd_list").find("li").removeClass("selected").eq(i).addClass("selected"),v.find("li").find("div").find("h2").removeClass("sele").eq(i).addClass("sele"),e=d[i],t=e,v.find(".sd_server").find("video").remove(),v.find(".sd_server").hide(),v.find("iframe").attr("src","").hide(),v.find(".sd_loading").show(),m(e)?(t="https://www.youtube.com/embed/"+m(e)+"?autoplay=0&loop=1&showinfo=0&rel=0&enablejsapi=1",s&&(t="https://www.youtube.com/embed/"+m(e)+"?autoplay=1&loop=1&showinfo=0&rel=0&enablejsapi=1"),v.find("iframe").attr("src",t).show(),g&&w()):e.indexOf("vimeo")>-1?(t="https://player.vimeo.com/video/"+e.substring(e.lastIndexOf("/")+1),s?v.find("iframe").attr("src",t+"?api=1&amp;player_id=video_player&amp;autoplay=1").show():v.find("iframe").attr("src",t+"?api=1&amp;player_id=video_player").show(),void 0!==v.find("iframe")[0].addEvent&&v.find("iframe")[0].addEvent("ready",function(i){v.find("iframe")[0].addEvent("finish",function(){s=!0,C()})})):e.indexOf("google")>-1?v.find("iframe").attr("src",t).show():e.indexOf("vid")>-1?v.find("iframe").attr("src",t).show():(l="",l+=s?'<video width="100%" height="100%" controls autoplay>':'<video width="100%" height="100%" controls>',l+='<source src="'+t.replace(".ogg",".mp4")+'" type="video/mp4">',l+='<source src="'+t.replace(".mp4",".ogg")+'" type="video/ogg">',l+="</video>",v.find(".sd_server").show().html(l),v.find("video").bind("ended",function(){s=!0,C()})),v.find("iframe").load(function(){v.find(".sd_loading").hide()}),y())})}),y(),$(window).resize(function(){b()}),b(),v.find(".sd_list").scroll(function(){x($(this))}),x(v.find(".sd_list")),v.find(".sd_prevPage").click(function(){$(this).hasClass("active")&&(f=v.find(".sd_list").scrollTop()-e*v.find(".sd_list").find("li").outerHeight(),f=Math.ceil(f/p),v.find(".sd_list").animate({scrollTop:f*p},500))}),v.find(".sd_prev").click(function(){o>0&&(o--,y(),k("prev"),v.find(".sd_list").find("li").eq(o).trigger("click"))}),v.find(".sd_next").click(function(){o<d.length-1&&(o++,y(),k("next"),v.find(".sd_list").find("li").eq(o).trigger("click"))}),v.find(".sd_nextPage").click(function(){$(this).hasClass("active")&&(f=v.find(".sd_list").scrollTop()+e*p,f=Math.ceil(f/p),v.find(".sd_list").animate({scrollTop:f*p},500))}),v.find(".sd_list").animate({scrollTop:0},10),v.find(".sd_list").find("li").eq(0).trigger("click"),$(document).ready(function(){$("").remove()})}}else alert("Please insert jQuery library!");function m(i){return i.indexOf("watch?v")>-1?i.substring(i.indexOf("?v=")+3):(i.indexOf("youtube")>-1||i.indexOf("youtu.be")>-1)&&i.substring(i.lastIndexOf("/")+1)}function w(){g=!0,new YT.Player("video_player",{events:{onStateChange:function(i){switch(i.data){case YT.PlayerState.ENDED:s=!0,C()}}}})}function y(){o>0?v.find(".sd_prev").addClass("active"):v.find(".sd_prev").removeClass("active"),o<d.length-1?v.find(".sd_next").addClass("active"):v.find(".sd_next").removeClass("active")}function b(){$(window).width()<i.player_mobile_on_width||!i.automatic_response?(e=c,i.automatic_response&&v.width($(window).width()),v.removeClass("sd_desktop"),v.find(".sd_list").height(e*p),v.find(".sd_video").height(v.find(".sd_video").width()*_),v.find(".sd_video").width("100%"),v.find(".sd_videos").width("100%")):(e=r,v.addClass("sd_desktop"),v.width(h),v.find(".sd_list").height(e*(p-.8)),v.find(".sd_video").height(v.find(".sd_videos").outerHeight()),v.find(".sd_video").css("width",i.player_desktop_video_width),v.find(".sd_videos").css("width",100-parseInt(i.player_desktop_video_width)+"%"))}function x(i){i.scrollTop()>0?v.find(".sd_prevPage").addClass("active"):v.find(".sd_prevPage").removeClass("active"),i[0].scrollHeight>=i.outerHeight()+i.scrollTop()+5?v.find(".sd_nextPage").addClass("active"):v.find(".sd_nextPage").removeClass("active")}function k(i){var s=v.find(".sd_list").scrollTop(),d=s+v.find(".sd_list").outerHeight(),t=v.find(".sd_list").find("li").eq(o).offset().top-v.find(".sd_list").find("li").eq(o).parent().offset().top+v.find(".sd_list").find("li").eq(o).outerHeight();return(t+s+10>=d+v.find(".sd_list").find("li").eq(o).outerHeight()||t<1)&&(f=o*p,"prev"==i&&(f=(o-e+1)*p),v.find(".sd_list").animate({scrollTop:f},500)),!0}function C(){o<d.length-1&&(o++,y(),k("next"),v.find(".sd_list").find("li").eq(o).trigger("click"))}}var timer=setInterval(function(){"undefined"!=typeof options&&(new Video_player(options),clearInterval(timer))},50);
//]]>
</script>
៧-ចុចពាក្យ Save Theme។
៨-ចម្លងកូដខាងក្រោមដាក់ចូលទៅក្នុង Blog Post (HTML Tab)
<div id="player" style="width: 100%;"></div>
<script type="text/javascript">
//<![CDATA[
options.player_list = [ 
{"file": "https://www.youtube.com/watch?v=7DrECLTJdM8","title": "ចាំមើលអ្នកណារកសង្សារបានមុន - កែវ វាសនា","description": "","image": ""},
{"file": "https://www.youtube.com/watch?v=JMBNcZ9iv_U","title": "កម្មពីបុព្វេរ - Rith Acoustic","description": "","image": ""},
{"file": "https://www.youtube.com/watch?v=sUnouxXKYaw","title": "ចាំអូនទល់ព្រឹក - ដួង វីរៈសិដ្ឋ","description": "","image": ""}, 
{"file": "https://vimeo.com/208621116","title": "សុំប៉ះ - STEP","description": "","image": ""}, 
{"file": "https://www.facebook.com/video/embed?video_id=10153231379946729", "title": "How to Share with Just Friend", "description": "", "image": "" }, 
{"file": "https://docs.google.com/file/d/0B-9xsGqNKunnUWcxUzFxMm1LaXc/preview","title": "GoogleDrive Demo Video","description": "","image": ""}, ]; var player = new Video_player(options);
//]]>
</script>
កំណត់សម្គាល់៖ សូមធ្វើការផ្លាស់ប្តូរទៅតាមវីដេអូរបស់អ្នក។
៩-ចុចពាក្យ Publish ជាការស្រេច។

បញ្ចេញមតិ

  1. សួរស្តី ! អរគុណច្រេីនដែលបានចែករំលែក។ េដីម្បីចង់បង្កេីតអេាយមាន Labels ចាប់ពីរ៣ ទៅ៤អត្ថបទក្នុង Labels រឺ Menu តែមួយ តេីអ្នកអាចជួយបង្ហាញបានទេ?សង្ឃឺមថាអ្នកនិងអាចជួយប្រាប់។ អរគុណទុកជាមុន

    ReplyDelete
    Replies
    1. ខ្ញុំអត់សូវយល់នៅសំណួរ សូមបញ្ជាក់ឲច្បាស់ជាងនេះបន្តិចបានទេ?

      Delete
  2. ហេតុអីក៏ដាក់វីដេអូពី ok.ru អត់បានបង?

    ReplyDelete
    Replies
    1. ប្រសិនបើប្លក់របស់បងមាន Domain ជា .blogspot.com មិនអាច Embed បានទេ លើកលែងតែប្លក់ដែលមាន Top Level Domain ដូចជា៖ (.com, .net, .org...) ទើបអាច Embed វីដេអូយកមកបាន។

      Delete