<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body{overflow-x: hidden;}
.author-par {padding: 4px;background: #f1f1f1;text-align: center;margin-bottom: 15px;box-shadow: 0 0px 0px 0 rgba(0, 0, 0, .16), 0 0px 0px 0 rgba(0, 0, 0, .23);}
.c5-author-img {background: url(https://pbs.twimg.com/profile_background_images/451389902429491200/Rrlh09IC.png);padding: 10px;border-radius: 2px;background-size: cover;margin-bottom: 5px;position: relative;}
.c5-author-data a {font-family: Neo;margin-right: 0px;color: #ff7f00;}
p.c5-user-description {font-family: Neo;font-size: 16px;color: #333;line-height: 30px;}
.c5-author-data .fa {color: #ff7f00;}
img.avatar-photo {width: 100px;height: 100px;border-radius: 50%;background: linear-gradient(215deg,#FFC107 0%,#ff7f00 100%);padding: 3px;border: none;z-index: 99;position: relative;}
.c5-author-img:after {background: linear-gradient(135deg, #167ac6,#fff);display: block;pointer-events: none;position: absolute;content: '';width
: 100%;opacity: 0.7;z-index: 9;height: 100%;left: 0;top: 0;vertical-align: top;transition: 0.4s;}
</style>
<style>
.btn-group-lg > .btn, .btn-lg { padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 5px;
width: auto;
background-color: #4caf50;
}
.card {
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
max-width: auto;
margin: auto;
text-align: center;
font-family: arial;
}
.title {
color: grey;
font-size: 18px;
}
button:hover, a:hover {
opacity: 0.7;
}
</style>
</head>
<body>
<div class="container">
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body">
<div class="card">
<script type='text/javascript'>
$(function(){
$( ".author-par" ).appendTo( ".append-author" );
});
</script>
<b:if cond='data:blog.pageType == "item"' />
<div class='author-par'>
<div class='c5-author-img'>
<img class='avatar-photo' src=
height='auto' itemprop='image' width='100'/>
</div>
<div class='c5-author-data'>
<div >
<div >
<a
style="text-decoration: none; font-size: 22px; color: black;" href=
target="_blank">
<script src="https://apis.google.com/js/platform.js"></script>
<script>
function onYtEvent(payload) {
if (payload.eventType == 'subscribe') {
} else if (payload.eventType == 'unsubscribe') {
}
if (window.console) {
window.console.log('YT event: ', payload);
}
}
</script>
<div class="g-ytsubscribe" data-channelid=
data-layout="default" data-count="default" data-onytevent="onYtEvent"></div>
</a>
</div>
</div>
<div id="p3_youtube_widget_859830124" class="p3_youtube_widget p3_youtube_widget_horizontal" style="display: flex;width: 100%; height: 282px;overflow: auto; " ></div><script> jQuery(document).ready(function(A){A.getJSON(
,function(e){if(e.msg)var t=e.msg;else{var t="";for(i=0;i<
;i++){var a=e.tubes[i].img,s=e.tubes[i].link,u=e.tubes[i].title,g=e.tubes[i].id;t+='<div class="p3_youtube_widget_video" style="width: 300px;height: 200px;background-color: transparent;padding: 3px;"><a href="'+s+'" class="p3_cover_me" style="background-image:url('+a+');width: 300px;height: 94px;display: table;background-size: 100%;" rel="nofollow" target="_blank" data-p3-tube-id="'+g+'"><img tyle="background-image:url('+a+');" rel="nofollow" target="_blank" data-p3-tube-id="'+g+'" class="p3_invisible" alt=""/><i class="fa fa-youtube-play" style="font-size: 50px;display: table;margin: 27% auto;transform: translateY(0%);" ></i></a><div class="p3_youtube_title" style="font-size:large;background-color: white;" >'+u+"</div></div>"}}A("#p3_youtube_widget_859830124").append(t)})});</script> </div>
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
creat youtube tool
ليست هناك تعليقات:
إرسال تعليق