Memasang Camera Slider Pada Blog

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
/* Slider */
.camera_wrap a,.camera_wrap img,.camera_wrap ol,.camera_wrap ul,.camera_wrap li,.camera_wrap table,.camera_wrap tbody,.camera_wrap tfoot,.camera_wrap thead,.camera_wrap tr,.camera_wrap th,.camera_wrap td
.camera_thumbs_wrap a,.camera_thumbs_wrap img,.camera_thumbs_wrap ol,.camera_thumbs_wrap ul,.camera_thumbs_wrap li,.camera_thumbs_wrap table,.camera_thumbs_wrap tbody,.camera_thumbs_wrap tfoot,.camera_thumbs_wrap thead,.camera_thumbs_wrap tr,.camera_thumbs_wrap th,.camera_thumbs_wrap td{background:none;border:0;font:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline;list-style:none}
.camera_wrap{display:none;float:left;position:relative;z-index:0;width:97.6%;padding:6px 7px 6px 6px;border:1px solid #e3e3e3}
.camera_wrap img{max-width:none!important}
.camera_fakehover{height:100%;min-height:100px;position:relative;width:100%;z-index:1}
.camera_src{display:none}
.cameraCont,.cameraContents{height:100%;position:relative;width:100%;z-index:1}
.cameraSlide{bottom:0;left:0;position:absolute;right:0;top:0;width:100%}
.cameraContent{bottom:0;display:none;left:0;position:absolute;right:0;top:0;width:100%}
.camera_target{bottom:0;height:100%;left:0;overflow:hidden;position:absolute;right:0;text-align:left;top:0;width:100%;z-index:0}
.camera_overlayer{bottom:0;height:100%;left:0;overflow:hidden;position:absolute;right:0;top:0;width:100%;z-index:0}
.camera_target_content{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:2}
.camera_target_content .camera_link{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbl-kjvllMDmSrSXm4xvn1_ca0Hbobr4SYT8rESY8DslFosA5w-oTQWKCPVDo24VVl0_-1JR75WpRa42lECdYycAq3v2jZys4BqKXagd1Qqo1qaqSa9-0KVQ2eCON4fVuUEbWlW7Hhz-U/s1600/blank.gif);display:block;height:100%;text-decoration:none}
.camera_loader{background:url(http://1.bp.blogspot.com/-U50t_WWuuYY/UR2JCuL7yFI/AAAAAAAAALE/w8dJNZaYB2E/s1600/loading.gif) no-repeat center;background:rgba(255,255,255,0.9) url(http://1.bp.blogspot.com/-U50t_WWuuYY/UR2JCuL7yFI/AAAAAAAAALE/w8dJNZaYB2E/s1600/loading.gif) no-repeat center;border:1px solid #fff;-webkit-border-radius:18px;-moz-border-radius:18px;border-radius:18px;height:36px;left:50%;overflow:hidden;position:absolute;margin:-18px 0 0 -18px;top:50%;width:36px;z-index:3}
.camera_bar{bottom:0;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:3}
.camera_thumbs_wrap.camera_left .camera_bar,.camera_thumbs_wrap.camera_right .camera_bar{height:100%;position:absolute;width:auto}
.camera_thumbs_wrap.camera_bottom .camera_bar,.camera_thumbs_wrap.camera_top .camera_bar{height:auto;position:absolute;width:100%}
.camera_nav_cont{height:65px;overflow:hidden;position:absolute;right:9px;top:15px;width:120px;z-index:4}
.camera_caption{bottom:0;display:block;position:absolute;width:100%}
.camera_caption &gt; div{padding:10px 10px}
.camerarelative{overflow:hidden;position:relative}
.imgFake{cursor:pointer}
.camera_prevThumbs{bottom:4px;cursor:pointer;left:0;position:absolute;top:4px;visibility:hidden;width:30px;z-index:10}
.camera_prevThumbs div{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat -160px 0;display:block;height:40px;margin-top:-20px;position:absolute;top:50%;width:30px}
.camera_nextThumbs{bottom:4px;cursor:pointer;position:absolute;right:0;top:4px;visibility:hidden;width:30px;z-index:10}
.camera_nextThumbs div{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat -190px 0;display:block;height:40px;margin-top:-20px;position:absolute;top:50%;width:30px}
.camera_command_wrap .hideNav{display:none}
.camera_command_wrap{left:0;position:relative;right:0;z-index:4}
.camera_wrap .camera_pag .camera_pag_ul{list-style:none;margin:0;padding:0;text-align:center}
.camera_wrap .camera_pag .camera_pag_ul li{-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;cursor:pointer;display:inline-block;height:16px;margin:20px 5px;position:relative;text-align:left;text-indent:-9999px;width:16px}
.camera_commands_emboss .camera_pag .camera_pag_ul li{-moz-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2)}
.camera_wrap .camera_pag .camera_pag_ul li &gt; span{-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;height:8px;left:4px;overflow:hidden;position:absolute;top:4px;width:8px}
.camera_commands_emboss .camera_pag .camera_pag_ul li:hover &gt; span{-moz-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2)}
.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent &gt; span{-moz-box-shadow:0;-webkit-box-shadow:0;box-shadow:0}
.camera_pag_ul li img{display:none;position:absolute}
.camera_pag_ul .thumb_arrow{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid;top:0;left:50%;margin-left:-4px;position:absolute}
.camera_prev,.camera_next,.camera_commands{cursor:pointer;height:40px;margin-top:-20px;position:absolute;top:50%;width:40px;z-index:2}
.camera_prev{left:0}
.camera_prev &gt; span{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat 0 0;display:block;height:40px;width:40px}
.camera_next{right:0}
.camera_next &gt; span{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat -40px 0;display:block;height:40px;width:40px}
.camera_commands{right:41px}
.camera_commands &gt; .camera_play{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat -80px 0;height:40px;width:40px}
.camera_commands &gt; .camera_stop{background:url(http://2.bp.blogspot.com/-6YtLNXfobBM/USSKUrbd2VI/AAAAAAAAAPE/B1hxLGWEtb8/s1600/skinscamera.png) no-repeat -120px 0;display:block;height:40px;width:40px}
.camera_wrap .camera_pag .camera_pag_ul li{-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;cursor:pointer;display:inline-block;height:16px;margin:20px 5px;position:relative;text-indent:-9999px;width:16px}
.camera_thumbs_cont{-webkit-border-bottom-right-radius:4px;-webkit-border-bottom-left-radius:4px;-moz-border-radius-bottomright:4px;-moz-border-radius-bottomleft:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;overflow:hidden;position:relative;width:100%}
.camera_commands_emboss .camera_thumbs_cont{-moz-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 0 rgba(255,255,255,1),inset 0 1px 1px rgba(0,0,0,0.2)}
.camera_thumbs_cont &gt; div{float:left;width:100%}
.camera_thumbs_cont ul{overflow:hidden;padding:3px 4px 8px;position:relative;text-align:center}
.camera_thumbs_cont ul li{display:inline;padding:0 4px}
.camera_thumbs_cont ul li &gt; img{border:1px solid;cursor:pointer;margin-top:5px;vertical-align:bottom}
.camera_clear{display:block;clear:both}
.showIt{display:none}
.camera_caption a{color:#b8fa5e;font:16px Oswald;margin:0 10px 10px 0}
.camera_caption a:hover{color:#fff}
.camera_caption .comt{font:11px Tahoma;margin:5px 0 0;color:#fc0; display:none}
.camera_caption p{font:12px Arial;margin:5px 0 0}
.camera_clear{clear:both;display:block;height:1px;margin:-1px 0 25px;position:relative}
.pattern_1 .camera_overlayer{background:url(http://4.bp.blogspot.com/-mK_USJALT1w/USSK5zcb0VI/AAAAAAAAAPM/BXmbKtwCdPI/s1600/laya.png) repeat}
.pattern_2 .camera_overlayer{background:url(http://2.bp.blogspot.com/-VVgg8zHpY1Q/USSLGoqh93I/AAAAAAAAAPU/1L3y6jLQv3I/s1600/layb.png) repeat}
.pattern_3 .camera_overlayer{background:url(http://2.bp.blogspot.com/-vt97g0-7sy0/USSLQhI53RI/AAAAAAAAAPc/LUep3GmWmnI/s1600/layc.png) repeat}
.pattern_4 .camera_overlayer{background:url(http://1.bp.blogspot.com/-siY1U2dtkdk/USSLcJ6_iWI/AAAAAAAAAPk/P8wAOzA3Myo/s1600/layd.png) repeat}
.pattern_5 .camera_overlayer{background:url(http://4.bp.blogspot.com/-svWnNDcbzkQ/USSLndwFBeI/AAAAAAAAAPs/IpAgpa_YNXs/s320/laye.png) repeat}
.pattern_6 .camera_overlayer{background:url(http://4.bp.blogspot.com/-beOrTn_xAb0/USSL5TpKKKI/AAAAAAAAAP0/Be6TaEBGNbM/s320/layf.png) repeat}
.pattern_7 .camera_overlayer{background:url(http://1.bp.blogspot.com/-ZIu8sF_tT74/USSMFPPT_aI/AAAAAAAAAP8/ihrFsYG3Y4E/s320/layg.png) repeat}
.pattern_8 .camera_overlayer{background:url(http://1.bp.blogspot.com/-KSaEP4OQ_qw/USSMPrJ3PzI/AAAAAAAAAQE/K-3k29KDUwM/s320/layh.png) repeat}
.pattern_9 .camera_overlayer{background:url(http://3.bp.blogspot.com/-FilWZbFD07E/USSMiDKIURI/AAAAAAAAAQM/K7a6fvbnvGc/s1600/layi.png) repeat}
.pattern_10 .camera_overlayer{background:url(http://4.bp.blogspot.com/-M96ItiZRE7w/USSMiAM3xEI/AAAAAAAAAQQ/_NGNkQuKAnM/s320/layj.png) repeat}
.camera_caption{color:#fff}
.camera_caption &gt; div{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfhisndJulL6vtqJynWWdqh2q6iZ8taiZhd75SMdZPXOo2w10uNtFgicK28rCQJK_Er4O8RKoP9TUsyOJ2t5E9Y6cdwPmbeAEBH08nLSZWbeQDnzlcZrZ_TG41OU_McTmhbEzW3hE4Tu10/s1600/transparant.png)}
.camera_wrap .camera_pag .camera_pag_ul li{background:#8cd700}
.camera_wrap .camera_pag .camera_pag_ul li:hover &gt; span{background:#8cd700}
.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent &gt; span{background:#7b418e;box-shadow: 0 0 8px #e6aef8}
.camera_pag_ul li img{border:3px solid #f3fbfd;-moz-box-shadow:0 3px 6px rgba(0,0,0,.5);-webkit-box-shadow:0 3px 6px rgba(0,0,0,.5);box-shadow:0 3px 6px rgba(0,0,0,.5)}
.camera_pag_ul .thumb_arrow{border-top-color:#f3fbfd}
.camera_prevThumbs,.camera_nextThumbs,.camera_prev,.camera_next,.camera_commands,.camera_thumbs_cont{background:#f3fbfd;background:rgba(216,216,216,0.85)}
.camera_wrap .camera_pag .camera_pag_ul li{background:#f3fbfd;box-shadow:0 1px 3px #6ab3cc; -moz-box-shadow:0 1px 3px #6ab3cc; -webkit-box-shadow:0 1px 3px #6ab3cc}
.camera_thumbs_cont ul li &gt; img{border-color:1px solid #000}
/*GREEN SKIN*/
.camera_green_skin .camera_prevThumbs div {
background-position: -160px -640px;
}
.camera_green_skin .camera_nextThumbs div {
background-position: -190px -640px;
}
.camera_green_skin .camera_prev &gt; span {
background-position: 0 -640px;
}
.camera_green_skin .camera_next &gt; span {
background-position: -40px -640px;
}
.camera_green_skin .camera_commands &gt; .camera_play {
background-position: -80px -640px;
}
.camera_green_skin .camera_commands &gt; .camera_stop {
background-position: -120px -640px ;
}
@media screen and (max-width: 960px) {
.main-wrapper{width:65.5%}
.sidebarleft-wrapper,.sidebar2-wrapper{display:none}
}
@media screen and (max-width: 760px) {
.main-wrapper{margin-right:0;width:auto;padding:10px 10px 0}
.sidebar-wrapper,.sidebar1-wrapper{border:none;width:auto;margin:0 auto 10px;padding:0 10px}
}
@media screen and (max-width: 340px){
.camera_wrap{width:95%}
.camera_caption p{display:none}
.cutter{width:100px;height:70px;}
}
</style>
</b:if>


4. Selanjutnya letakkan code JS di bawah ini tepat di atas code </head><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' type='text/javascript'/>
<script src='http://googledrive.com/host/0Bwggu85mZBaxM21iblBRelFYSVU/' type='text/javascript'></script>


Keterangan :
Jika pada template terdapat code warna merah dan warna biru lewati saja, perlu diingat pada template hanya perlu terdapat satu code jquery.min.js dan satu code jquery-ui.min.js versi berapa saja.

5. Terakhir letakkan code XML di bawah ini tepat di atas code <b:section class=’main’ id=’main’ preferred=’yes’> atau di bawah code <div class=’main-wrapper’>

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='randompost'>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
CameraSlider({
blogURL:'http://lagioke.blogspot.com',
MaxPost:5,
RandompostActive:true,
idcontaint:"#randompost",
ImageSize:500,
NumCharacter: 250,
textcom:"comments",
Notextcom:"No Comment",
noImage:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVdvaVMwdGmspifg6tQSqZho8QUhn7FLbyNEdP3e6taR59DGrH8Dnvr5dluijkGspEOXkOKwsr3hMBIgAduWsloJnmWuyQotkHxvtQMQm1ZU2CpMJ9pLc7aJjSZ0lHWi_-zeO129Q-dHY/s1600/no+image.jpg",
timestart:2000,
slidebylabel:false
});
});
//]]>
</script>
</div>
</b:if>
<div style='clear: both;'/>


Keterangan :
Silahkan ganti Url Blog http://lagioke.blogspot.com dengan Url Blog Anda

5. Save template dan lihat hasilnya