<style type="text/css">
#mobileshow {
display:none;
}
@media screen and (max-width: 500px) {
#mobileshow {
display:block; }
}
</style>
<div id="mobileshow">//Masukan code/tulisan kesini</div>
<!--Recent Slider-->
<!-- BloggerDynamicSlider Basic CSS -->
<style type="text/css">
/**
* jQuery BloggerDynamicSlider v1.0.0
* Copyright 2016 http://shuvojitdas.com
* Contributing Author: Shuvojit Das
* Plugin URL: https://github.com/shuvojit33/blogger-dynamic-slider
*
*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400);
@import url("https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.0/flexslider.min.css");
/* Preloader */
.flexslider.loading:after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo2ZePaolbF6-Y09P2g9-wPs47HMCD4fOakkM_9dB-yEbgEYn8DJ5WnTlPg8YVmKcRRJn9escUB0o_NnGU4EfuFdqDVRQVsxbj0xPJbI_gZWFYpwfgUSGQ-WVPb6Uv0vRlLimcdaN99dB3/h120/loader.gif) no-repeat center center;
background-color: rgba(255, 255, 255, 0.9);
z-index: 9999;
}
.flexslider.loading ul.flex-direction-nav,
.flexslider.loading ol,
.loading .flex-caption {
display: none;
}
.flexslider {
border: 1px solid #cacaca;
padding: 4px;
margin: 0 auto 60px auto;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.flexslider a {
text-decoration: none;
}
/* Caption/Post Title */
.flex-caption {
position: relative;
padding-left: 15px;
padding-right: 10px;
height: 60px;
background: #FFFFFF;
color: #1C1C1C;
font-family: 'Open Sans', sans-serif;
font-weight: 300;
font-size: 26px;
line-height: 26px;
margin: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
}
.flex-caption span {
display: table-cell;
vertical-align: middle;
height: 60px;
}
.flex-caption.overlayDark,
.flex-caption.overlayLight {
margin-bottom: -60px;
bottom: 60px;
position: relative;
}
.flex-caption.overlayDark {
background: rgba(0, 0, 0, 0.7);
color: #fff;
}
.flex-caption.overlayLight {
background: rgba(255, 255, 239, 0.9);
color: #000;
}
ul.slides li a {
display: block;
overflow: hidden;
}
/* blogger css conflicts fix */
.flexslider ul {
margin: 0 !important;
padding: 0 !important;
line-height: initial !important;
}
.flexslider ul.flex-direction-nav li {
margin: 0;
padding: 0;
line-height: initial;
}
.flexslider ul li {
margin-bottom: 0 !important;
}
.flexslider img {
padding: 0;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
}
ul.flex-direction-nav {
position: static;
}
ul.flex-direction-nav li {
position: static;
}
.error {
font-family: monospace, sans-serif;
}
@media (max-width: 600px) {
.flex-caption {
font-size: 20px;
line-height: 20px;
font-weight: 400;
}
}
</style>
<!-- Include Dependency Script -->
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/flexslider/2.6.0/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="http://shuvojitdas.com/script/jquery.bdslider.min.js"></script>
<div id="slider1"></div>
<script type="text/javascript">
$(document).ready(function() {
$("#slider1").BloggerDynamicSlider({
imageWidth: 636, // Image width in px value
imageHeight: 398, // Image height in px value
maxItem: 6, // Max number of Slider Image to show
animation: "slide", // Select your animation type, "fade" or "slide"
showPostTitle: true, // Show post title as Caption ? (true/false)
postTitleStyle: "overlayLight", // Caption style: "default, "overlayDark" or "overlayLight"
});
});
</script>
<script>
$("#slider1").BloggerDynamicSlider({
blogURL: "https://www.seribuunduh.com/", // Your Blog URL. example: "http://imagesliderforblogger.blogspot.com"; Only need to specify when fetching slider content from another blog
labelName: "SOFTWARE", // Show posts from specific Label. Specify a 'Label', or leave it empty to fetch from all recent posts
maxItem: 6, // Max number of Slider Posts to show
showPostTitle: true, // Show post title as Caption ? (true/false)
postTitleStyle: "default", // Select post title/caption style "default, "overlayDark" or "overlayLight"
imageWidth: 544, // Image width in px value
imageHeight: 280, // Image height in px value
animation: "fade", // Select your animation type, "fade" or "slide"
controlNav: true, // Navigation for paging control of each slide? (true/false)
directionNav: true, // Previous/next navigation? (true/false)
pauseOnHover: false, // Pause slideshow when hovering over slider, then resume when no longer hovering (true/false)
slideshowSpeed: 7000, // Set the speed of the slideshow cycling, in milliseconds
animationSpeed: 600, // Set the speed of animations, in milliseconds
animationLoop: true, // Should the animation loop? (true/false)
});
</script>
<!--Recent Slider-->
<style type="text/css"> #error-404 { border: 20px solid #1B1B1B; border-radius: 240px 240px 240px 240px; height: 240px; margin: 0 auto 40px; text-align: center; transition: all 0.8s ease 0s; width: 240px; } #error-404:hover { border-color: #333; } #error-404 span { color: #FA4C29; font-size: 100px; font-weight: bold; line-height: 240px; } .large-heading { font-size: 48px; line-height: 1.2em; } .light-heading { font-weight: 400; } .status-msg-bg { background-color: transparent; } .sidebar-wrapper, .page-header { display: none; } .main-wrapper { margin-right: 0; } .outer-wrapper { min-height: 0; } .status-msg-border { border: 0 none; } </style> <div id="error-404">
404
</div>
<h2 class="large-heading" style="text-align: center;">
Page not found.</h2>
<h3 class="light-heading" style="text-align: center;">
Sorry, the page you were looking for on this blog does not exist.
You will be redirected shortly to the homepage.</h3>
<script type="text/javascript">
BSPNF_redirect = setTimeout(function() {
location.pathname= "/"
}, 5000);
</script>
<!--table-->
<style>
#customers {
border-collapse: collapse;
width: 100%;
}
#customers td, #customers th {
border: 1px solid #ddd;
padding: 8px;
}
#customers tr:nth-child(even){background-color: #f2f2f2;}
#customers tr:hover {background-color: #ddd;}
#customers th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #4CAF50;
color: white;
}
</style>
<!--table--><table id="customers"><tbody>
<tr><th colspan="2"><center>SPESIFIKASI GENERAL </center></th></tr>
<tr><td><b>Display</b></td> <td>5.99" IPS LCD capacitive touchscreen, 16M colors</td> </tr>
<tr><td><b>Resolution</b></td> <td>720 x 1,440 pixels, 269ppi</td> </tr>
<tr><td><b>Processor</b></td> <td>octa-core 2.0GHz Cortex-A53 ; Adreno 506 GPU</td> </tr>
<tr><td><b>Processor Make</b></td> <td>Snapdragon 625 chipset</td> </tr>
<tr><td><b>Front camera</b></td> <td>5-megapixel</td> </tr>
<tr><td><b>Rear camera</b></td> <td>12MP F/2.2</td> </tr>
<tr><td><b>RAM</b></td> <td>3/4GB</td> </tr>
<tr><td><b>Storage</b></td> <td>32/64GB</td> </tr>
<tr><td><b>Support Micro SD</b></td> <td>Up 256GB</td> </tr>
<tr><td><b>Battery capacity</b></td> <td>3080mAh</td> </tr>
<tr><td><b>OS</b></td> <td>Android 8.1 Oreo; MIUI 9.5</td> </tr>
<tr><td><b>Dimensions (mm)</b></td> <td>160.7 x 77.3 x 8.1 mm</td> </tr>
<tr><td><b>Weight (g)</b></td> <td>170 g</td> </tr>
</tbody></table>
<table id="customers"><tbody>
<tr><th colspan="2"><center>SPESIFIKASI GENERAL </center></th> </tr>
<tr><td><b>ISI</b></td> <td>ISI Disini</td> </tr>
<tr><td><b>ISI</b></td> <td>ISI DIsini</td> </tr>
</tbody></table>
<!--Youtube Responsiv-->
<style>
/* Youtube Responsive */
.videoyoutube{text-align:center;margin:auto;width:100%;}
.video-responsive{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;}
.video-responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
</style>
<script type='text/javascript'>
//<![CDATA[
// Youtube Responsive
setTimeout(function(){$(".video-youtube").each(function(){$(this).replaceWith('<iframe class="video-youtube loader" src="'+$(this).data("src")+'" allowfullscreen="allowfullscreen" height="281" width="500"></iframe>')})},5e3);
//]]>
</script>
<!--Youtube Responsiv--><div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="https://www.youtube.com/embed/GMbjYnj5k50">
</div>
</div>
</div>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html>
<head>
<title>Judul Blog Anda</title>
<b:skin><![CDATA[ ]]></b:skin>
</head>
<body>
<b:section id='contoh'/>
</body>
</html>
<!--Lable Tag-->
<style>
.label-wrap{display:block;color:#666;padding:10px 15px;border-bottom:1px solid rgba(0,0,0,0.14);overflow:hidden}
.label-info{position:relative;margin:auto}
.label-info a,.label-tags{float:left;display:inline-block;position:relative;font-size:10px;margin-left:8px;padding:5px 6px;background:#5c7dc2;color:#fff;text-decoration:none;border:1px solid;text-transform:uppercase;border-radius:3px}
.label-tags{background:#fff;color:#f39c12;font-family:fontawesome;}
.label-info a:hover{background:#fff;color:#5c7dc2;border-color:inherit;text-decoration:none}
</style>
<div class='label-wrap'>
<span class='label-tags'><i CLASS='fa fa-tags' aria-hidden='true'/></span>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<div class='label-info'>
<a class='label-block' expr:href='data:label.url + "?max-results=7"' rel='tag'> <data:label.name/></a><b:if cond='data:label.isLast != "true"'/>
</div>
</b:loop>
</b:if>
</div>
<!--Lable Tag-->
<b:includable id='comments' var='post'>
</b:includable><b:includable id='comments' var='post'>
<div class='comments-block' id='comments-block'>
<div id='disqus_thread'/>
<script type='text/javascript'>
var mql = window.matchMedia('screen and (min-width: 350px)');if (mql.matches){
var disqus_loaded = false;
var disqus_shortname = 'DISQUS_SHORTNAME'; //Add your ID Disqus
var disqus_url = disqus_blogger_current_url;
var disqus_blogger_current_url = "<data:blog.canonicalUrl/>";
if (!disqus_blogger_current_url.length) {
disqus_blogger_current_url = "<data:blog.url/>"; }
var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>";
var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>";
function disqus() {
if (!disqus_loaded) {
disqus_loaded = true;
var e = document.createElement("script");
e.type = "text/javascript";
e.async = true;
e.src = "//" + disqus_shortname + ".disqus.com/embed.js";
(document.getElementsByTagName("head")[0] || document.getElementsByTagName("body")[0])
.appendChild(e);
//Hide the button after opening
document.getElementById("show-comments").style.display = "none";document.getElementById("comments-block").style.display = "block";
}
}
//Opens comments when linked to directly
var hash = window.location.hash.substr(1);
if (hash.length > 8) {
if (hash.substring(0, 8) == "comment-") {
disqus();
}}}
</script>
</div>
</b:includable>Penting Ganti DISQUS_SHORTNAME dengan Id Disqus yang kalian daftarkan
<!--Load Disqus-->
<style>
/* Disqus comment onclik load button – by Bungfrangki.com */
#comments,.comment-form, .comment_reply_form .comment-form{display:none;}
#comments-block{display:none;background:#fff;margin:20px auto;padding:30px;}
.comments-blocks button{display:block;margin:25px auto 0;width:300px;outline:none;border:none;cursor:pointer;text-transform:uppercase;font-weight:700;height:55px;color:#fff;line-height:55px;padding:0!important;font-size:16px;background:#3371d6;border-radius:2px}
.comments-blocks button:hover{background:#214682}
</style>
<b:if cond='data:view.isPost'>
<div class='comments-blocks'><button id='show-comments' onclick='disqus();return false;' tabindex='0'>Load Comments</button></div>
</b:if>
<!--Load Disqus-->
<br/>
<!--thumnail youtube-->
<style>
.youtubeBorder{
background:none repeat scroll 0 0 #fff;
border:1px solid #e0e0e0;
border-radius:2px;box-shadow:0 2px 4px rgba(0,0,0,0.2);
margin:10px 0 20px;
padding:4px
}
.youtubeBorder p.post-video{
margin:0!important
}
.youtube{
background-color:#000;
max-width:100%;
overflow:hidden;
position:relative;
cursor:hand;
cursor:pointer;
height:330px;
width:100%
}
.youtube .thumb{
bottom:0;
display:block;
left:0;
margin:auto;
max-width:100%;
position:absolute;
right:0;
top:0;
width:100%;
height:auto;
opacity:.8;
}
.youtube .play{
opacity:.9;
height:77px;
left:50%;
margin-left:-38px;
margin-top:-38px;
position:absolute;
top:50%;
width:77px;
background:url(http://1.bp.blogspot.com/-UxHkp1GZmYI/VEpXsS2YAeI/AAAAAAAAHH0/kgw4wjcrOvw/s1600/play.png) no-repeat}
.play:hover {
opacity:1;
}
</style>
<script>
$(document).ready(function(){
$("#play").click(function(){
$("#remove").hide();
$("#add").show();
});
});
</script>
<!--<div class='youtube' data-id='mbPO4FPAX1Y'><iframe id="add" style="display:none" width="100%" height="330" src="//www.youtube.com/embed/mbPO4FPAX1Y?rel=0" frameborder="0" allowfullscreen></iframe><div id="remove"><a href="https://www.youtube.com/watch?v=mbPO4FPAX1Y"><img class='thumb' src="http://i.ytimg.com/vi/mbPO4FPAX1Y/hqdefault.jpg"/></a><div class='play' id="play"></div></div></div>-->
<!--thumnail youtube--><div class="youtube" data-id="mbPO4FPAX1Y">
<iframe allowfullscreen="" frameborder="0" height="330" id="add" src="//www.youtube.com/embed/mbPO4FPAX1Y?rel=0" style="display: none;" width="100%"></iframe>
<div id="remove">
<a href="https://www.youtube.com/watch?v=mbPO4FPAX1Y"><img class="thumb" src="http://i.ytimg.com/vi/mbPO4FPAX1Y/hqdefault.jpg" /></a>
<div class="play" id="play">
</div>
</div>
</div>
<script src="https://dl.dropbox.com/s/7rstzqspa99y3u9/sitemap.js"></script>
<script src="https://catatanharianmiko.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>