html my blog tugas

51
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html> <html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='htt p://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data ='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gm l/expr' xmlns:fb='http://ogp.me/ns/fb#'> <head> <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalab le=no' name='viewport'/> <b:include data='blog' name='all-head-content'/> <b:if cond='data:blog.url == data:blog.homepageUrl'> <title><data:blog.pageTitle/></title> <b:else/> <title><data:blog.pageName/> :: <data:blog.title/></title> </b:if> <meta content='' name='keywords'/> <meta content='Noodp,Noydr' name='Robots'/> <link href='http://fonts.googleapis.com/css?family=Titillium+Web:700,900' rel='s tylesheet' type='text/css'/> <b:skin><![CDATA[/* ----------------------------------------------- IMPORTANT: BLOGSTORE OWNERS ARE ADVISED TO REVIEW THIER PAYPAL PAYMENT/TRANSACTION BEFORE ITEMS RELEASED. ---------------- THIS IS A BLOGGER + E-COMMERCE TEMPLATE ---------------- BlogrCart MukaBuku FREEMIUM V1.0 MUKABUKU(my) = FACEBOOK(en) Copyright (c) 2013 Irsah Imihar ( http://www.irsah.com/about#contactUs ) - Autho r Copyright (c) 2013 Irsah inDesigns - Publisher ------- LICENSE ------- THIS TEMPLATE IS LICENSED UNDER CREATIVE COMMONS ATTRIBUTION 3.0 UNPORTED LICENS E. THIS VERSION REQUIRES ATTRIBUTION MUST BE KEPT AT ALL TIMES WITH NO ALTERATIONS/ ADDITIONS. THIS BLOGGER TEMPLATE IS PROVIDED "AS IS" WITH NO WARRANTY. AUTHOR/PUBLISHER/DESIGNER WILL NOT BE LIABLE FOR ANY LOSS WHATSOEVER. VISIT http://creativecommons.org/licenses/by/3.0/ FOR MORE DETAILS. ------------- PRO CHANGELOG: ------------- JULY 2014 -Testing. AUGUST 2014 -Testing and code cleanup. -Release preview SEPTEMBER 2014 -Cleaned up codes. -Added hardware acceleration for CSS prefixes -Facebook styling for comments/reviews -Finalised tutorial/customization page -Added instructions for using to the blogspot.com domain name use.

Upload: wahyu-andika

Post on 12-Jul-2016

27 views

Category:

Documents


2 download

DESCRIPTION

html

TRANSCRIPT

Page 1: HTML My Blog Tugas

<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE html><html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://ogp.me/ns/fb#'><head><meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'/><b:include data='blog' name='all-head-content'/>

<b:if cond='data:blog.url == data:blog.homepageUrl'> <title><data:blog.pageTitle/></title><b:else/> <title><data:blog.pageName/> :: <data:blog.title/></title></b:if>

<meta content='' name='keywords'/><meta content='Noodp,Noydr' name='Robots'/>

<link href='http://fonts.googleapis.com/css?family=Titillium+Web:700,900' rel='stylesheet' type='text/css'/>

<b:skin><![CDATA[/*-----------------------------------------------IMPORTANT: BLOGSTORE OWNERS ARE ADVISED TO REVIEW THIERPAYPAL PAYMENT/TRANSACTION BEFORE ITEMS RELEASED. ----------------THIS IS A BLOGGER + E-COMMERCE TEMPLATE----------------BlogrCart MukaBuku FREEMIUM V1.0MUKABUKU(my) = FACEBOOK(en)

Copyright (c) 2013 Irsah Imihar ( http://www.irsah.com/about#contactUs ) - AuthorCopyright (c) 2013 Irsah inDesigns - Publisher-------LICENSE-------THIS TEMPLATE IS LICENSED UNDER CREATIVE COMMONS ATTRIBUTION 3.0 UNPORTED LICENSE.THIS VERSION REQUIRES ATTRIBUTION MUST BE KEPT AT ALL TIMES WITH NO ALTERATIONS/ADDITIONS.THIS BLOGGER TEMPLATE IS PROVIDED "AS IS" WITH NO WARRANTY. AUTHOR/PUBLISHER/DESIGNER WILL NOT BE LIABLE FOR ANY LOSS WHATSOEVER.VISIT http://creativecommons.org/licenses/by/3.0/ FOR MORE DETAILS.-------------PRO CHANGELOG:-------------JULY 2014-Testing.AUGUST 2014-Testing and code cleanup.-Release previewSEPTEMBER 2014-Cleaned up codes.-Added hardware acceleration for CSS prefixes-Facebook styling for comments/reviews-Finalised tutorial/customization page-Added instructions for using to the blogspot.com domain name use.

Page 2: HTML My Blog Tugas

-Added responsive image pop up.----------------------------------------------- *//* =====================================HTML RESET======================================== */html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,figure{margin:0;padding:0} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block} table{border-collapse:separate;border-spacing:0}caption,th,td{text-align:left;font-weight:normal}blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{quotes:"" ""}sup{vertical-align:super;font-size:smaller}a img{border:0;padding:0;margin:0}ol,ul{padding:0 0 1em;margin:1em 0 0 1.75em} ol li{padding:0 0 .75em} ul li{list-style-type:circle;padding:0 0 1.75em;} ul ul,ol ol{padding:0} ul li a,ul li a:hover,a,a:link,a:active,a:hover{-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out} .clearfix{display:block;width:100%;float:none;height:0;line-height:1;clear:both;zoom:1;}.center,center{text-align:center;margin:0 auto;display:block;}small,.small{font-size:85%}.medium{font-size:150%!important}.large{font-size:200%!important}.main,.sidebar,.footer,.header,#Blog1,.widget{margin:0; padding:0;} .group:before,.group:after{content:'';display:table;}.group:after{clear:both;}.group{zoom:1;} .curl { position: relative;-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; } .curl:before, .curl:after { z-index: -1; position:absolute; content:""; bottom:15px; left:10px; width:50%; top:80%; max-width:300px; background: #777; -webkit-box-shadow:0 15px 10px #777; -moz-box-shadow: 0 15px 10px #777; box-shadow: 0 15px 10px #777; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -o-transform: rotate(-3deg); -ms-transform:rotate(-3deg); transform: rotate(-3deg); } .curl:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .shadows { -moz-box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.4), inset 0 -8px 8px -8px rgba(0,0,0,0.4);-webkit-box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.4), inset 0 -8px 8px -8px rgba(0,0,0,0.4); box-shadow:inset 0 8px 8px -8px rgba(0,0,0,0.4), inset 0 -8px 8px -8px rgba(0,0,0,0.4); } .floatLeft {float:left; display:inline-block;} .floatRight {display:inline-block;float:right;}/* =====================================BUTTONS======================================== */button,.button,.main input[type="submit"],.main input[type="reset"],.main input[type="button"]{display:inline-block;text-align:center;text-decoration:none;cursor:pointer;margin-bottom:1em;padding:.5em 1em;position:relative; font-weight:700; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); color: #fff; background-color:#3b5998; border-color:#3b5998; border-size:1px; -webkit-box-shadow:0 0 10px rgba(0,0,0,.2); -moz-box-shadow:0 0 10px rgba(0,0,0,.2); box-shadow:0 0 10px rgba(0,0,0,.2); outline:0;} button:hover,.button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out;-webkit-transition:all .2s ease-in-out; text-decoration:none; color: #f9f9f9; background:#aaa; border-size:1px; border-color:#aaa; outline:0; box-shadow:none; } button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;outline:0}/* =====================================FORMS/INPUTS======================================== */form{display:block;}fieldset{margin:0;padding:3%} #main input[type="postcode"],#main input[type="name"],#main input[type="number"],#main input[type="tel"],#main input[type="search"],#main input[type="text"],#main input[type="password"],#main input[type="email"],#main input[type="url"] { padding:.5em 0; outline:0; margi

Page 3: HTML My Blog Tugas

n-bottom:1em; display:inline-block; position:relative; width:99%; color:#888; background:#fff; border:1px solid #aaa; } textarea { padding:.5em 0; outline:0; margin:0 0 1em; display:inline-block; position:relative; min-height:8em; width:99%; color:#888; background:#fff; border:1px solid #aaa; } select { padding:.35em 0;margin-bottom:1em;min-width:220px } input[type="url"]:focus,input[type="number"]:focus,input[type="postcode"]:focus,input[type="tel"]:focus,input[type="search"]:focus,input[type="text"]:focus,input[type="password"]:focus,input[type="email"]:focus,textarea:focus,select:focus { -moz-box-shadow:0 0 3px rgba(0,0,0,.2);-webkit-box-shadow:0 0 3px rgba(0,0,0,.2);box-shadow:0 0 3px rgba(0,0,0,.2);position:relative;outline:0; color: #333; background:#fff; border-size:1px; border-color:#aaa; } label,legend { display:block;font-weight:700;vertical-align:top;}input[type="checkbox"],input[type="radio"] { display:inline; margin-bottom:1em; } label span,legend span { font-weight:normal; display:block; color:#333; } /* =====================================TYPOGRAPHY ======================================== */body { -webkit-font-smoothing:antialiased; -webkit-text-size:adjust; line-height:1.6; font-size:14px; font-family:'Lucida Grande', Tahoma, Geneva, Verdana, Helvetica, Arial, sans-serif; color:#3a3a3a; background:#fff; }h1,h2,h3,h4,h5,h6 { text-decoration: none; margin-bottom:.5em; font-weight:normal; color:#3a3a3a; font-family:Tahoma,Helvetica,Arial,sans-serif; }h1 { font-size:42px;line-height:1.1; }h2 { font-size:33px;line-height:1.1; }h3 { font-size:29px;line-height:1.1; }h4 { font-size:25px;line-height:1.1; }h5 { font-size:21px;line-height:1.1; }h6 { font-size:19px;line-height:1.1; }p { margin:0 0 2em;font-size:100%; }a:link,a:visited{ text-decoration: none; color:#3b5998; }a:hover{ opacity:.75; color:#3c3c3c; }img,.post-body img,.separator a{padding:0;margin:0!important;outline:0;border:0;}.post-body img, .post img{height:auto}.post img:hover { }blockquote { padding:1em; margin-left:4em; margin-bottom:2em; display:block; font-style:italic; color:inherit; background: #f7f7f7; border:1px solid #ccc; border-left:4px solid #333; font-family:Georgia,serif;font-size:16px;}/* =====================================WRAPPERS======================================== */.inner-wrapper { width:90%; margin:0 auto; padding:2%;}#cart-wrapper { background:#f6f6f6; position:relative; padding:1em 0; }#cart-wrapper .inner-wrapper { padding:0; }header#header-wrapper { margin:0 auto; display:block; padding:0; position:relative; }#list-wrapper { margin:0 auto; padding: 1em 0 0; border-bottom:1px solid #ddd; box-shadow:0px 1px 8px rgba(0,0,0,.25); position:relative; }#content-wrapper .inner-wrapper { padding-bottom:0; }#main { position:relative; width:100%; margin:0 auto; }#sidebar-wrapper { position:relative; padding:3em 0; width:100%; }#content-wrapper { padding-bottom:0; overflow:hidden; }.sidebar-bg { position:absolute; top:0; left:-10%; width:120%; height:100%; background-color: #f6f6f6; }footer#footer-wrapper { background: #f6f6f6; padding:3em 0; }/* =====================================STORE TITLE======================================= */.Header { padding:0; margin:0; }#header img { width: 100%; height: auto; }#header-wrapper h1, #header-wrapper h2, #header-wrapper h2 a { font-size:43px;

Page 4: HTML My Blog Tugas

color:#fff; font-weight:normal; letter-spacing:-1px; margin-bottom:0; }p.description { font-size:21px; margin-bottom:2em!important; color:#fff; letter-spacing:1px; }#header { padding-bottom:2em; text-shadow:0px 0px 8px rgba(0,0,0,.3);}#header-inner { min-height:380px; padding:0; margin:0 auto; overflow:hidden; }#header-inner a:hover { opacity:1; }.titlewrapper { padding: 3em 0 0; padding-left:5%; max-width:55%; line-height:1; }.descriptionwrapper { padding:0 0 0 5%; max-width:55%; display:inline-block; }.descriptionwrapper a.button { -webkit-box-shadow:0px 0px 12px rgba(0,0,0,.5); -moz-box-shadow:0px 0px 12px rgba(0,0,0,.5); box-shadow:0px 0px 12px rgba(0,0,0,.5); margin-bottom:3em; color:#fff;}.descriptionwrapper a.button:hover { opacity:.9; }h2.section-title { margin:0 auto; text-align:center; position:relative; padding: 0; display:block; font-size:27px; line-height:1; }h2.section-title span { position:relative; padding:1em; display:inline-block; z-index:2; }h2.section-title hr { position:absolute; top:35%; left:0; display:block; width:100%; color:#ccc!important; }/* =====================================DROP-DOWN NAVIGATION======================================== */nav.menu { display:inline-block; width:75%; float:left; }.menu li a { text-shadow:0 1px 0 rgba(255,255,255,.25); }.menu a:hover { opacity:1;}.menu-link { display:none; text-decoration:none; padding:0; line-height:1; margin:0; text-indent:-9999px; }.menu ul { padding:0; margin:0; position:relative; display:block; }.menu>li>ul.sub-menu { min-width:18em; padding:.5em 0; border:1px solid #06c; margin:0; }.menu ul:after{ }.menu ul li { padding:0; list-style:none; position:relative; }.menu>ul>li { display:inline-block; padding:0; margin:0; }.menu ul li a { display:block; text-decoration:none; height:2.75em; line-height:2.75em; padding:0 2em 0 0; border:1px solid transparent; }.menu ul ul:before { width:0; height:0; border:10px solid transparent; border-top:0; border-bottom-color:#06c; content: ''; position: absolute; left:20px; top:-10px; margin-left:-10px; }.menu ul li>a { height:2.75em; line-height:2.75em; }.menu li.has-submenu>a:after { width:0; height:0; border:5px solid transparent; border-bottom:0; content:''; vertical-align: middle; display:inline-block; position:absolute; right:1em; top:42%; }.menu ul ul { display:none; position:absolute; top:100%; min-width:18em; color:#fff; border:1px solid transparent; padding:0; margin:0; text-align:left; z-index:99999; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; -wenkit-box-shadow: 0 0 8px rgba(0,0,0,.25); -moz-box-shadow: 0 0 8px rgba(0,0,0,.25); box-shadow: 0 0 8px rgba(0,0,0,.25); }.menu ul li:hover>ul { display:block; }.menu ul ul>li { position:relative; list-style:none; padding:0; margin:0; }.menu ul ul>li a { padding:0 1em; height:2.75em; line-height:2.75em; height:auto; color:#fff; -webkit-transition:background-color .2s ease-out; -moz-transition:background-color .2s ease-out; -ms-transition:background-color .2s ease-out; -o-transition:background-color .2s ease-out; transition:background-color .2s ease-out; }.menu ul ul ul { position:absolute; left:100%; top:0; padding:0; margin:0; z-index: 9999; }a.home { background:url(http://3.bp.blogspot.com/-m0wxZ9HpglA/U8m9tQe8egI/AAAAAAAAKy8/FYiBq3kRKm0/s1600/Home-48.png)no-repeat center; background-size:25px 25px; text-indent:-999px; width:40px!important; height:40px!important; display:block; line-height:40px!important; padding: 0!important; margin-right: 1.5em; font-siz

Page 5: HTML My Blog Tugas

e:0px; border:1px solid #fff; background-color:#fff; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.15); -moz-box-shadow: inset 0 0 6px rgba(0,0,0,.15); box-shadow: inset 0 0 6px rgba(0,0,0,.15); -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; border-color:#ccc; }/* CUSTOMIZE DROP DOWN MENU COLORS */.menu>li>ul.sub-menu { background-color:#333; border-color:#333; }.menu ul li a { border:1px solid transparent; font-size:14px; color:#f9f9f9; }ul.sub-menu li a:hover { background-color: #3b5998; }/* small triangle */.menu li.has-submenu>a:after { border-top-color: #f7f7f7; }/* small triangle drop down*/ .menu ul ul:before {border-bottom-color: #f7f7f7; }.menu ul ul { background:#f7f7f7; color: #333; border-color:transparent; }.menu ul ul>li a { color: #333; background-color:#f7f7f7; }.menu ul ul>li a:hover {background-color: #3b5998;color: #fff;}@media only screen and (max-width:800px) {.menu li a { text-shadow:none; }a.menu-link { display:inline-table; text-align:center; position:relative; position: relative; font-size:30px; }a.menu-link:before { content: ""; position: absolute; top: 0.25em; left: 0; width: 1em; height: 0.125em; border-top: 0.375em double #fff; border-bottom: 0.125em solid #fff; }a.menu-link:hover { cursor:pointer; }nav.menu { display:block; width:100%!important; float:none; margin:0!important; }.menu { clear:both; min-width:inherit; float:none; position:relative; bottom:0; z-index:9; height:100%!important; margin-bottom:1em; }.menu,.menu>ul ul{ overflow:hidden; max-height:0; }.menu>li>ul.sub-menu { padding:0; border:0; width:100%; }

Page 6: HTML My Blog Tugas

.menu.active,.menu>ul ul.active { max-height:80em; }

.menu ul { display:block; text-align:left; width:100%; float:none; margin-top:10px; -webkit-box-shadow:0 0 8px rgba(0,0,0,.15); -moz-box-shadow:0 0 8px rgba(0,0,0,.15); box-shadow:0 0 8px rgba(0,0,0,.15); -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }.menu>ul { border-top:1px solid #333; }.menu li,.menu>ul>li { display:block; }.menu ul>li a:hover,.menu ul ul>li a:hover { }.menu li a{display:block;height:3em;line-height:3em;padding:0 1em;position:relative}.menu li.has-submenu>a:after{content:'+';position:absolute;top:-.1em;right:0;display:block;font-size:1.6em;font-weight:700;padding:0 1em;border:none;}.menu li.has-submenu>a.active:after{content:'-';position:absolute;top:-.1em;right:0;display:block;font-size:1.6em;font-weight:700;padding:0 1em;border:none;}.menu ul ul>li a { height:3em; line-height:3em; padding:0 2em; position:relative; }.menu ul ul,.menu ul ul ul { display:inherit; position:relative; left:auto; top:auto; box-shadow:none; border:0; }.menu ul ul ul>li a{padding:0 3em;position:relative;}.menu ul li a { padding:0 1em; }.menu ul:before { width:0; height:0; border:10px solid transparent; border-top:0; content: ''; position:absolute; left:15px; top:-10px; margin-left:-10px; }a.home { background-position:50%; background-color:#fff; width:100%!important; padding:0; margin:0 auto; display:block; }

/* CUSTOMIZE MOBILE NAVIGATION COLORS */a.menu-link:before{ border-color: #fff;}a.menu-link:hover { color:#aaa;}a.home{ background-color: #dfe3ee; }.menu>ul {border-top-color: #fff; background-color: #fff;}.menu ul>li a:hover,.menu ul ul>li a:hover { background-color: #3b5998; color: #fff!important;border-color: #fff;} .menu li a { color: #333!important;border-top-color:#ccc;border-bottom-color:#ccc;}.menu ul:before { border-bottom-color:#fff; }.menu ul ul>li a

Page 7: HTML My Blog Tugas

{ background-color:#f7f7f7; }.menu li a.home:hover { background:#dfe3ee url(http://3.bp.blogspot.com/-m0wxZ9HpglA/U8m9tQe8egI/AAAAAAAAKy8/FYiBq3kRKm0/s1600/Home-48.png)no-repeat center;background-size:25px 25px;-webkit-transition:none; -mox-transition:none; transition:none; }}/* ===============================VIEW CART DROP DOWN================================== */.view-cart-wrapper { font-size: 11px; float:right; display:inline-block; padding:0; color:#fff; }span.close { float:right; padding:0 .5em .5em; display:inline-block; font-weight:700; font-size:14px; cursor:pointer;color:#333; }.view-cart-wrapper .simpleCart_quantity { padding-left: 3em; background:url(http://2.bp.blogspot.com/-bfVSIVnhLaM/U7nDKeQtDaI/AAAAAAAAKkc/876cY6Wjf_I/s1600/Shopping-Bag-24.png) no-repeat 0 0; background-size: 20px 20px;text-indent:10px; padding-top:.5em; padding-bottom:.5em; }.view-cart-wrapper .simpleCart_total { padding:0 1em; margin: 0 1em; border-left: 1px solid #fff; }.view-cart-wrapper .cart-details { display:inline-block; z-index:9; padding:10px; line-height:1.1; text-align:center; background:#fff; border:1px solid #f6f6f6; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; position:absolute; top:50px; right:5%; max-width:360px; display:inline-block; -webkit-box-shadow:0 0 8px rgba(0,0,0,.3); -moz-box-shadow:0 0 8px rgba(0,0,0,.3); box-shadow:0 0 8px rgba(0,0,0,.3); }.cart-details:before { width: 0; height: 0; border: 10px solid transparent; border-top: none; content:''; position:absolute; right:20px; top:-10px; border-bottom-color: #fff; }.cart-details .simpleCart_items { margin-bottom:1em; width:100%; min-width:320px; display:inline-block; color:#333; font-size: 80%; }.cart-details .simpleCart_items .item-increment, .cart-details .simpleCart_items .item-decrement { display: none }.cart-details a.button { margin-bottom:0; height:28Px; line-height:28px; padding:0 .5em; color: #fff; }.cart-details a.simpleCart_checkout { background:url(http://4.bp.blogspot.com/-nE0sggcqkNY/VBW-kAmun6I/AAAAAAAALxk/hI6F1_-ebSM/s1600/blogrcart-mukabuku-paypal-checkout.png)no-repeat center; color:transparent; margin:0 .25em; padding:0 1em; width:142px!important; height:32px; line-height:32px; display:inline-block; text-align:center; }a#cart-detail { padding: .5em 1em .5em .5em; -webkit-border-radius:1em; -moz-border-radius:1em; border-radius:1em; background: #000; color:#fff; }.cart-details .simpleCart_items img { width: 40px; }/* ===============================SEARCH BAR================================== */#blogrcart-search { width:33%; position:absolute; top:3em; right:5%; padding:0; }#blogrcart-search div { position:relative; margin-bottom:1em; }#blogrcart-search input[type="search"] { width:100%; line-height:2.75; height:2.75em; display: block; padding:0; outline:0; -webkit-box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); -moz-box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); border-color: #ccc; }#blogrcart-search input[type="submit"] { z-index:2;line-height:2.5; width:2.5em; height:2.5em; display:block; position:absolute; top:2px; right:2px; padding:0; outline:0; box-shadow:none; border:0;background-image: url(http://3.bp.blogspot.com/--LQZMMtMR1s/UyWYQzh73sI/AAAAAAAAJe8/QS_FfBjJpXQ/s1600/search+blogrcart+template.png); background-repeat: no-repeat; background-position: center; background-size: 2em 2em; background-color:#fff

Page 8: HTML My Blog Tugas

; text-indent:-9999px; }/* =====================================LIST LABEL WRAPPER======================================== */.list { text-align:center; padding:0; }.list .widget-content .list-label-widget-content li span { display:none; }.list .widget { width: 23%; margin: 0 1%; display:inline-block; float:left; }.list .Label a:before { display:none!important; }.list .widget a:hover { background:none; }.list select { line-height:2.5em; height:2.5em; display:block; padding:.5em; margin:0 auto 1em; float:none; text-align:center; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; -webkit-box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); -moz-box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); box-shadow:inset 0px 0px 4px rgba(0,0,0,.25); border-color:#ccc; }.list select { line-height:1em; }/* =====================================POSTS======================================== */.post h2, .post h3, .post h4,.post h5, .post h6 { padding:1em 0 .5em; }.post header { margin: 0 auto; height:100%; text-align:center; }.date-header, .jump-link { display: none; visibility:hidden; }.post-footer p { margin-bottom:0; }.post img { width: 100%; }.post { font-size:100%; padding:3%; border: 1px solid #ccc; -webikit-box-shadow: 0 0 8px rgba(0,0,0,.25); -moz-box-shadow: 0 0 8px rgba(0,0,0,.25); box-shadow: 0 0 8px rgba(0,0,0,.25); -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }.post-footer-line { display:inline-block; float:left; width:50%; margin-top:2em; }.tr-caption-container { border:0; padding:0; margin:0 auto; }.post table, .post tbody, .post td { border:0; }.post tbody, .post tr { margin:0; padding:0; }.post td { padding:.5em; }.tr-caption-container td, .tr-caption-container thead { padding:.5em; border:1px solid #ccc; }.tabs-section { margin-top:1em; padding: 2%; border-radius:3px; box-shadow: 0 0 8px rgba(0,0,0,.25); color:#333; border: 1px solid #ccc; background: #f9f9f9; border: }/* =====================================COMMENTS======================================== */#comments h4 { margin:0 0 1em; line-height: 1; }#comments-block { margin: 1em 0; }#comments-block .comment-author { margin:.5em 0; }#comments-block .comment-body { margin:.25em 0 0; }#comments-block .comment-footer { margin: -.25em 0 2em; line-height: 1.5em; }#comments-block .comment-body p { margin:0 0 1em; }.deleted-comment { font-style:italic; color:#ccc; }.comment-header { display: block; padding:0; font-size:12px; margin:0;}.comment-header a { font-weight:700; margin:0; }.comments { clear:both; margin:0 auto; display:block;}#comments { clear:both; position:static;}.comments .comments-content p.comment-content { font-size:12px; margin-left:0; margin:0 0 1em; font-weight:normal; text-align: left; line-height: 1.5em; }.comments .continue a, .comments .comment .comment-actions a { font-size: 11px; padding: .25em 1em; text-decoration: none; text-align:center; margin:0 auto; color: #fff; text-align: center!important; background: #3b5998;border:1px solid #3b5998; margin-right:1px; display: inline-block; min-width: 80px; }.comments .continue a { margin-left: 2em;}

Page 9: HTML My Blog Tugas

.comments .continue a:hover, .comments .comment .comment-actions a:hover { text-decoration: none; opacity:1; background:#aaa; border:1px solid #aaa;}.comments .continue a:active, .comments .comment .comment-actions a:active { position: relative; top:1px; }.comments .comments-content .comment-thread ol { list-style-type:none; padding:0; text-align:left; margin: 0; }.comment-replies .comment-thread.inline-thread ol li { border-left:2px solid #ddd; padding:0.5em 0 1em 1em; margin:0 0 0 2em; }.comments .comments-content .comment-thread { margin:0; }.comments .comments-content .comment-thread:empty { display:none; }.comments .comments-content .comment-replies { margin-top:1em; font-size:12px; margin-left:4.3em; }.comments .comments-content .comment { padding-bottom:1em; margin-bottom:0; }.comments .comments-content .comment:first-child { padding-top:1em; }.comments .comments-content .comment:last-child { border-bottom:0; padding-bottom: 0; }.comments .comments-content .comment-body { position: relative; }.comments .comments-content .user { font-weight:700; }.comments .comments-content .user a { }.comments .comments-content .user a:hover { text-decoration:none; }.comments .comments-content .icon.blog-author, .icon.user { display:none; }.comments .comments-content .datetime { display: none; }.comments .comments-content .comment-content { font-size: 14px; line-height:1.5em; text-align: left; margin:1em 0 2em 2em; }.comments .comments-content .owner-actions { position: absolute; right: 0; top: 0; }.comments .comments-replybox { border:1px solid transparent; min-height:12em; width: 100%; }.comments .comment-replybox-single { margin-top: .5em; margin-left:4.8em; }.comments .comment-replybox-thread { margin-top: .5em; }.blogger-iframe-colorize, .blogger-comment-from-post, #comment-editor { width:100%; }.comments .comments-content .loadmore a { display: block; margin: .5em 1em; text-align: center; }.comments .thread-toggle { cursor: pointer; display: inline-block; padding-bottom: 1em; }.comments .comments-content .loadmore { cursor: pointer; max-height: 3em; margin-top: 1em; }.comments .comments-content .loadmore.loaded { max-height: 0; opacity: 0; overflow: hidden; }.comments .thread-chrome.thread-collapsed { display: none; }.comments .thread-toggle { display: inline-block; margin-left:1.5em; }.comments .thread-toggle .thread-arrow { display: inline-block; height: 6px; width: 7px; overflow: none; margin: 0.25em; padding-right: 4px; }.comments .thread-expanded .thread-arrow {background: url('data: image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC') no-repeat scroll 0 0 transparent; }.comments .thread-collapsed .thread-arrow {background: url('data: image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==') no-repeat scroll 0 0 transparent; }.avatar-image-container { float:left; overflow:hidden; }.avatar-image-container img, .avatar-image-container { background:transparent; z-index:1; width:auto; }.comments .avatar-image-container, .comments .avatar-image-container img { width:58px; height:58px; max-width:58px; max-height:58px; border-radius:3px; }.comment-block { z-index:0; position:relative; padding:.5em 0 0 0; background: none; border-top:1px solid #ccc; margin-left:6em!important; }.comment-form p { margin:0; }

Page 10: HTML My Blog Tugas

.blogger-iframe-colorize, .blogger-comment-from-post, #comment-editor { width:100%!important; height:220px!important;}.comment-replybox-thread { margin-left:1.5em; }#backlinks-container { display:none; visibility:hidden; }div.comment-form { display:block; padding:1em; }.comments .comments-content .comment:first-child { padding-top:0; }.comments .comments-content .comment { margin-bottom:0; padding-bottom:0; }/* =====================================PAGINATION======================================== */#blog-pager { vertical-align: middle; text-align: center; display:block; width:100%; margin:2em auto; padding:0; }a#blog-pager-newer-link { float:left; }a#blog-pager-older-link { float:right; }a.home-link { text-align:center; } a#blog-pager-newer-link, a#blog-pager-older-link, #blog-pager a.home-link { width: 31%; text-align:center; margin:0 1%; color:#fff; padding:.75em 0; background-color:#3b5998; border:0; }.feed-links { display: none; visibility:hidden; }.showpageNum a { color: #333!important; display:inline-block; padding:10px; }.showpage { display: inline-block; font-weight: 700; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; background:#3b5998; }span.showpageArea a { display: inline-block; padding:.5em; text-decoration: none; color:#333;}.showpagePoint { display: inline-block; padding: 5px; font-weight: 700; }.showpageOf { padding:.5em; display: inline-block; }span.showpageOf a { color:#333; margin:0 10px; }span.showpage a { padding: .35em 1em!important; color: #fff!important; display: inline-block; }.showpageArea { width:100%; text-align:center; margin:0 auto; } /* =====================================SIDEBAR======================================== */.sidebar, #sidebar { margin:0; padding:0; position:static; }.sidebar h2, .sidebar h3 { font-size: 19px; margin-bottom: 1em; margin-top:0; text-transform:uppercase; }.sidebar ul { margin:0; padding:0; }.sidebar li { list-style:none; list-style-type:none; display:block; position:relative; }.sidebar .widget { margin:0 1% 3em; display:inline-block; width:31%; float:left; }.main .Blog { border-bottom-width: 0; }.sidebar li a { color:#000; }/* =====================================WIDGET PROFILE======================================== */.profile-img { float: left; margin: 0 5px 5px 0; padding:4px; border:1px solid #cccccc; }.profile-data { margin:0; letter-spacing:.1em; font-weight:700; color:#999; }.profile-datablock { margin:.5em 0 .5em; }.profile-textblock { margin: 0.5em 0; line-height: 1.6em; }.profile-link { letter-spacing: .1em; }/* =====================================WIDGET POPULAR POSTS======================================== */.item-title { font-weight:700; margin-bottom: 1em; }.item-snippet{ font-size:90%; font-style:italic; }/* =====================================WIDGET LABELS======================================== */

Page 11: HTML My Blog Tugas

.list-label-widget-content li span { display:none; }

.Label ul { border:1px solid #fff; border-bottom:0; background:#f0f0f0; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;}.Label li { border-bottom:1px solid #fff; }.Label a:before { content:'\2192'; position: absolute; right:1em; bottom:0.5em; font-size: 125%; }.Label a { padding:.75em; display:block;}.Label a:hover { background:#3b5998; color:#fff; }.Label li,.Label ul { padding:0; margin:0; }/* =====================================WIDGET SUBSCRIBE======================================== */.widget.FollowByEmail { color:#fff; padding:2%; width:27%; background:#333; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }.widget.FollowByEmail h2.title,.FollowByEmail h3.title { padding-bottom:0; margin-bottom:0; color:#fff; }.follow-by-email-inner form, .follow-by-email-inner form table, .follow-by-email-inner form tbody, .follow-by-email-inner form tr, .follow-by-email-inner form td { border:0 none; padding: 0; display:block; }.follow-by-email-inner form td { width:100%!important; display:block; padding:0!important; }.follow-by-email-inner form, .follow-by-email-inner form table, .follow-by-email-inner form tbody, .follow-by-email-inner form tr { text-align:center; margin:0 auto; display:block; }input[type="text"].follow-by-email-address { line-height:1; display:block; padding:.45em 0; width: 100%; margin-bottom:.5em;}input[type="submit"].follow-by-email-submit { height:2.75em!important; padding:0!important; display:block; width: 100%!important; line-height:1; margin:0!important; }input[type="submit"].follow-by-email-submit { background-color: #3b5998!important; color:#fff; }input[type="submit"].follow-by-email-submit:hover { opacity:.85; }/* =====================================FOOTER======================================== */#footer h2,#footer h3 { font-size:21px; text-transform:uppercase; text-align:left; margin-bottom: .5em; }#footer div { position:relative; }.footer .widget { display:inline-block; float:left; width:23%; margin:0 1%; margin-bottom: 3em; border:0;}.footer-links a:before { content:'\2192'; padding-right:.5em; }#footer ul { margin: 0; padding: 0; }#footer li { list-style: none; margin:0; }p.credits { padding:0 0 1em; }.credits { margin: 0 auto; text-align:center; position:relative; } /* =====================================TWEAKS======================================== */body#layout #header { margin-left: 0px; margin-right: 0px; }/* =====================================SHOPPING CART======================================== */.simpleCart_items table { width:100%;text-align:center;border-top:1px dotted #ccc;border-left:0;border-right:0;}.simpleCart_items tr, .simpleCart_items td, .simpleCart_items th {vertical-align:top;border-left:0;border-right:0;}.simpleCart_items td, .simpleCart_items th { border-bottom: 1px dotted #ccc!important; padding: .5em!important;}.hidden_value, .cartHeaders { display:none; visibility:hidden; }img.item_thumbimg { width:80px; height:auto; }

Page 12: HTML My Blog Tugas

.item-thumbimg { text-align:center; width:10%; }

.item-thumbimg img{text-align:center; }

.item-size,.item-color,.item-pagelink { width:5%; text-align:center; }

.item-size input,.item-color input { width:20px!important; text-align:center; }

.item-price { width:15%; text-align:center; }

.item-decrement, .item-increment, .item-quantity, .item-remove, td.item-remove { width:3%; text-align:center; }.item-increment a, .item-decrement a { margin:0 auto; display:block; width:20px; height:20px; line-height:20px; color:#333; font-weight:700; text-align:center; font-size:125%; }.item-decrement a { color:red!important; border: 1px solid red; }.item-increment a { color:green!important; border: 1px solid green; }.item-quantity input { width:30px!important; text-align:center; padding:0; }.item-total, td.item-total { width:15%; text-align:center; }td.item-remove a { display:block; width:20px; height:20px; line-height:20px;border: 1px solid #f00; color:#f00; -webkit-border-radius:20px; -moz-border-radius: 20px; border-radius: 20px; text-align:center; }.simpleCart_items { display:block; text-align:center; }table.summary { width:100%; margin:0 auto; border:1px solid #ccc; }.summary td { padding: .5em 1em;border: 1px solid #ccc!important; width:auto!important; }table.checkingOut td { text-align:center; }.button.item_add { margin-bottom:0!important; color:#f6f6f6!important; }.send-order {-webkit-box-shadow:0 0 12px rgba(0,0,0,.3); -moz-box-shadow:0 0 12px rgba(0,0,0,.3); box-shadow:0 0 12px rgba(0,0,0,.3); padding: .75em; }div.separator a { margin:0!important; }/* =====================================SEND ORDER FORM======================================== */form#contact { border:1px solid #ccc; padding:0; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; }#contact fieldset { border:0 none; padding:1em; }#contact div { width:47%; margin:1%; vertical-align:top; float:left; display:inline-block; margin-bottom: .5em; }#contact #comments { margin-top:0; border:0; }#cartTotal { text-align:center }#contact textarea, #contact select { padding:.45em 0; width:98%; }#contact textarea { min-height: 5em; }/* =====================================STATUS MESSAGE======================================== */.status-msg-wrap { margin-bottom:3em; width:100%; clear:both; }.status-msg-wrap,.status-msg-wrap h1, .status-msg-wrap h2, .status-msg-wrap h3, .status-msg-wrap a, .status-msg-body a { color: #3a87ad; }.status-msg-body { text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); padding: 1em 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #3a87ad; background-color: #d9edf7; border: 1px solid #bce8f1; }.status-msg-border { display: block; width: 100%;margin: 0 auto;border:0 none; }.status-msg-wrap hr { width: 80%; margin:0 auto 2em; padding: 0; text-align: center; }/* PRE CODES */code, pre { display:block; max-height:420px; padding:1.5em; font-size:90%; word-wrap:break-word!important; overflow:auto; line-height: 1.2; background:#F9F9F9; border:1px solid #ccc; }/* =====================================IMAGE CAROUSEL CONTAINER======================================== */#slider-container { margin:0 auto 3em; position:relative; background: #fff; width:90%; border:1px solid #ccc; }

Page 13: HTML My Blog Tugas

.blogrcart-carousel { overflow:hidden; padding:0; }

.slick-slider { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none;-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;-ms-touch-action: none; touch-action: none; -webkit-tap-highlight-color: transparent; }.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }.slick-list:focus { outline: none; }.slick-loading .slick-list { background: #fff url(http://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.3.6/ajax-loader.gif) center center no-repeat; }.slick-list.dragging { cursor: pointer; }.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }.slick-track { position: relative; left: 0; top: 0; display: block; zoom: 1; overflow:hidden; }.slick-track:before, .slick-track:after { content: ""; display: table; }.slick-track:after { clear: both; }.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float:left; min-height:1px; display: none; position:relative; background:#fff; }#slider-container, .slick-slide, .blogrcart-carousel { height:380px; }

.slick-slide img { display:block; height:auto; vertical-align:middle; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }/* Arrows */.slick-prev, .slick-next { position: absolute; display:block; height: 20px; width: 20px; line-height: 0; font-size: 0; cursor: pointer; background:transparent; color:transparent; top: 50%; margin-top:-10px; padding:0; border:0; outline:0; opacity:.25; }.slick-prev:focus, .slick-next:focus { outline:0; }.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color:#fff; opacity: 0.85; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; background:#000; }.slick-prev { left: 20px; }.slick-prev:before { content: "\2190"; }.slick-next { right: 20px; }.slick-next:before { content: "\2192"; }.slick-prev:hover, .slick-next:hover { opacity:1;}/* Dots */.slick-dots { position: absolute; bottom: -45px; list-style: none; display: block; text-align: center; padding: 0px; width: 100%; }.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0px 5px; padding: 0px; cursor: pointer; }.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0; font-size: 0; color: trans

Page 14: HTML My Blog Tugas

parent; padding: 5px; cursor: pointer; outline: none; }.slick-dots li button:focus { outline: none; }.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "\2022"; width: 20px; height: 20px; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }.slick-dots li.slick-active button:before { opacity: 0.75; }

.slick-slide h3.desc-wrapper, .slick-center h3.desc-wrapper { display:none; }

.slick-center h3.desc-wrapper { font-size:18px; color:#fff; z-index:8; width:200%; padding:3%; position:absolute; bottom:10%; left:-53%; display:block; background-color:rgba(59,89,152,.85); text-align:center; margin:0; -webkit-border-radius:5em; -moz-border-radius:5em; border-radius:5em; -webkit-box-shadow:0 0 4px rgba(0,0,0,.35); -moz-box-shadow:0 0 4px rgba(0,0,0,.35); box-shadow:0 0 4px rgba(0,0,0,.35);}

.img-slides { position:absolute; top:0; left:0; z-index:4; width:100%; height:100%; display:block; background-size:cover; }.slick-slide { filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); opacity:.55; margin:0; overflow:hidden; }.slick-center { filter: none; -webkit-filter: grayscale(0%); opacity:1; overflow:visible!important; z-index:8; }.image a:hover { opacity:1; }#slider-container { border-bottom:5px solid rgba(59,89,152,.75); }.slick-center h3.desc-wrapper, .slick-prev:before, .slick-next:before { background-color:rgba(59,89,152,.75); }/* ========================================INFO MESSAGES======================================== */p.msg-error, p.msg-success, p.msg-info { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding:.5em 0; margin:0 auto 1em; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); border: 1px solid #ddd; background-color: #f0f0f0; text-align:center; }p.msg-error a, p.msg-success a, p.msg-info a { font-weight:700; }a.close-msg { display:inline-block; float:right; margin-right:1em; line-height:20px; -webkit-border-radius:50px; -moz-border-radius:50px; border-radius:50px; border:1px solid #333; width:20px; height:20px; }/* ========================================SOCIAL ICONS======================================== */ul.iconsWrap {margin:0 auto 2.5em; text-align:center; }.iconsWrap li { list-style:none; display:inline-table; text-indent: -9999px; overflow:hidden; padding:.5em; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; background:#333; margin: 0 .15em .15em; text-align:center; float:left; }.iconsWrap li:hover { background:#888; }.iconsWrap li a{ display: block; height:23px; width:23px; background: url(http://4.bp.blogspot.com/-tAfkvQPhx3Y/U7ktYDzqUBI/AAAAAAAAKjI/ID54Ie1VZPE/s1600/social-sprite-icons.png) no-repeat; background-size:auto 23px; }li.facebook { background-color:#3b5998; } li.google { background-color:#dd4b39; } li.twitter { background-color:#00aced; } li.linkedin { background-color:#007bb6; } li.youtube { background-color:#bb0000; } li.gmail { background-color:#ff0000; }li.facebook a { background-position:0px 0px; } li.google a { background-position:-23px 0px; } li.twitter a { background-position:-46px 0px; } li.linkedin a{ background-position:-92px 0px; } li.youtube a { background-position:-138px 0px

Page 15: HTML My Blog Tugas

; } li.gmail a { background-position:-184px 0px; }/* ========================================PAYMENT ICONS======================================== */ul.payments { padding:0; margin:0 auto 2.5em; text-align:center; display:block; clear:both; }.payments li { padding:0; margin:0 2px; list-style:none; display:inline-table; background:url(http://2.bp.blogspot.com/-Sq3p5cbx_hM/U8h84_wyvXI/AAAAAAAAKwk/7GIuZrEaBAs/s1600/e-commerce+payments.jpg)no-repeat; background-size:800px 32px; width:50px; height:32px; float:left; }.payments li:hover { opacity:.75; }li.mastercard { background-position:0px; } li.visa { background-position:-50px; } li.americanexpress { background-position:-150px; } li.paypal { background-position:-200px; } li.discover { background-position:-650px; }/* =====================================================================================DESIGNERS START CUSTOMIZE COLOR/BACKGROUNDS HERE ======================================================================================== *//* =================================== GENERAL FONTS AND HEADER TITLE STYLES==================================== */body {line-height:1.6; font-size:14px; font-family:'Lucida Grande', Tahoma, Geneva, Verdana, Helvetica, Arial, sans-serif; color:#3a3a3a; }h1,h2,h3,h4,h5,h6 { font-family:Tahoma,Helvetica,Arial,sans-serif;}a:link,a:visited{ color:#3b5998; }a:hover{color:#3c3c3c;}/* =================================== MAIN NAVIGATION LOGO==================================== */a.home{background-image:url(http://3.bp.blogspot.com/-m0wxZ9HpglA/U8m9tQe8egI/AAAAAAAAKy8/FYiBq3kRKm0/s1600/Home-48.png);}/* =================================== VIEW CART WRAPPER==================================== */#cart-wrapper{background-color: #3b5998; /* TOP MOST SECTION BACKGROUND */border-bottom:none; }/* ===================================

Page 16: HTML My Blog Tugas

HEADERS AND BLOG TITLE==================================== */header#header-wrapper{background-color: #3b5998; /* HEADER SECTION BACKGROUND */border-bottom:1px solid #b8b8b8; }#header-wrapper h1, #header-wrapper h2, #header-wrapper h2 a { font-size:72px; color: #fff;text-transform:lowercase;}#header-wrapper h1, #header-wrapper h2, #header-wrapper h2 a, h2.section-title, .footer-title { font-family: 'Titillium Web', sans-serif;}h2#slider span{ background-color:#fff;}/* =================================== DROP DOWN SEARCH BY LABELS==================================== */#list-wrapper{background-color: #fff; /* DROP DOWN SELECT LABELS SECTION BACKGROUND */border-color: #ccc;}/* =================================== CONTENT AND POSTS==================================== */#content-wrapper,#content-wrapper h2.section-title span{background-color: #dfe3ee; /* MAIN CONTENTS BACKGROUND */color: #3B3B3B; /* MAIN CONTENTS TEXT COLOR */}.post {background-color: #fff;}header.item_name h1{color: #3b5998; /* PRODUCT POST TITLE COLOR */}/* =================================== BELOW CONTENT AND POST==================================== */.sidebar-bg{background-color: #F7F7F7; /* BELOW CONTENTS SECTION BACKGROUND */border-top: 1px solid #ccc;}/* ===================================

Page 17: HTML My Blog Tugas

FOOTER AND CREDITS==================================== */footer#footer-wrapper, a#cart-detail, .descriptionwrapper a.button{background-color: #3b5998; /* FOOTER SECTION BACKGROUND */}#footer,footer#footer-wrapper a,#footer h2,#footer h3 {color: #fff; /* FOOTER TEXT/LINK COLOR */}.credit, .tab-section, .tabs.current{background-color: #dfe3ee; /* CREDITS SECTION BACKGROUND */}/* =================================== INFO/ERROR MESSAGE COLORS==================================== */p.msg-error, p.msg-error a { color: #b94a48; /* ERROR MESSAGE COLOR */} p.msg-error{background-color: #f2dede; /* ERROR MESSAGE BACKGROUNDS */border-color: #eed3d7; }p.msg-success, p.msg-success a{ color: #468847; /* SUCCESS MESSAGE COLOR */}p.msg-success{background-color: #dff0d8; /* SUCCESS MESSAGE BACKGROUNDS */border-color: #d6e9c6; }p.msg-info, p.msg-info a{color: #3a87ad; /* INFO MESSAGE COLOR */font-size:100%;}p.msg-info{background-color: #d9edf7; /* INFO MESSAGE BACKGROUNDS */border-color: #bce8f1;}]]></b:skin>

<b:if cond='data:blog.pageType != &quot;item&quot;'><b:if cond='data:blog.pageType != &quot;static_page&quot;'><style>.bg-parallax { min-height: 100%; height: 100%; margin: 0 auto; min-width: 100%; max-width: 1920px; z-index: -1;background-repeat:no-repeat;background-position:50% 0;background-color:transparent;background-attachment:fixed;background-size:cover; }<marquee behavior='scroll' direction='right'><b><i>Give youre hand-put youre trash-make it real youre imagine.</i></b></marquee>

#blog-post { border:0; width: 100%; overflow:hidden; }.post table, .post tbody, .post th, .post tr, .post td { display: block; border:

Page 18: HTML My Blog Tugas

0; margin:0; padding:0; width: 100%;}.post { position:relative; padding: 0; width: 20.5%; float: left; display: inline-block; overflow: hidden; margin: 0 2% 3em; border: 0; background:#fff; border:1px solid #ddd; }.post:hover { border: 1px solid #ccc; }.post-body { width:100%; display:block; margin:0 auto; overflow:hidden; padding:0; }.post p { margin: 0; }.post header { margin:0;}

header.item_name { width:100%; display:block; margin:0; padding:0; }.item_name h2 { vertical-align:middle; text-align:center; position:absolute; top:0; left:0; display:block; height:100%; margin:0; padding:0; z-index:4; width:100%; color:transparent; }.item_name h2 a { line-height: 1; display:block; font-size: 16px; padding:0; width: 100%; line-height: 20em; color:transparent; background: none; text-shadow:none;}.item_name h2 a:hover { color:#fff; background:rgba(0,0,0,0.85); }

table.product-image { border:0!important; position:absolute; top:0; left:-250%; display:block; width:600%; overflow:hidden; margin:0; padding:0; }table.product-image img { margin:0 auto; text-align:center; width:auto; }table.product-image, table.product-image img, .item_name h2 a { height:20em; }table.product-image div.separator a { margin: 0 auto!important; text-align:center; }

table.product-detail { margin-top:5em; }td.item_price { font-size:19px; font-weight:700; position:absolute; bottom:2em; left:0; z-index:5; display:block; padding:.5em 0!important; text-align:center; background-color: #f7f7f7; border-top:1px solid #ccc; border-bottom: 1px solid #ccc; }

table.product-thumbnail, table.product-description, span.current-items.post-footer, select.item_size, .label-quantity, a.item_add, select.item_color, .post-footer { display: none; visibility:hidden; }

.add-cart-wrapper { margin:0 auto; text-align:center; font-size:10px; position:absolute; bottom:0; left:0; display:block; width:94%; padding:3%;}.fb-like { z-index:5; }table.product-image, table.product-image img, .item_name h2 a { height:22em; }.post-body { height:28em; }</style>

<b:if cond='data:blog.url == data:blog.homepageUrl'><style>/* HOMEPAGE SPECIFIC STYLES */</style></b:if> <style>@media only screen and (max-width:800px) {.post { width:45.5%; }.slick-slide { filter: none!important;; -webkit-filter:grayscale(0%)!important;; opacity:1;!important; overflow:visible!important; }}@media only screen and (max-width:480px) {.post { display:block; width:100%!important; float: none; margin: 0 0 3em;}}</style></b:if>

Page 19: HTML My Blog Tugas

</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'><link href='//cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/0.9.9/magnific-popup.css' rel='stylesheet' type='text/css'/><style>#header-wrapper img { display:none!important; visibility:hidden; background:none!important; }

.post table, .post tbody, .post th, .post tr, .post td { display: block; border:0; margin:0; padding:0; width: 100%;}.post-body { position:relative; overflow:hidden!important; }

table.product-image { overflow:hidden;width:45%; float:left; display:inline-block; height: 480px; margin-bottom: 2em; border:1px solid #ccc; position:relative; }table.product-image tr td { height: 480px; width:300%; text-align:center; margin:0 auto; position:absolute; left:-100%; margin-left:0; }table.product-image a { z-index:5; }table.product-image img { height: 480px; width:auto; text-align:center; margin:0 auto; overflow:hidden;}table.product-detail, table.product-description { width:41%; float:right; display:inline-block; margin-bottom: 2em!important; }table.product-thumbnail { width:10%; position:absolute; left: 47%; display:block; width: 10%; top:0; }table.product-thumbnail img { width:85px; height:auto; border:1px solid #ccc; }table.product-thumbnail td { display:block; }.post-footer, .add-cart-wrapper { clear:both; }

.add-cart-wrapper { display:block; padding:3%; clear:both; background: #f7f7f7; border:1px solid #ccc; margin-top:2em; }span.label-quantity { display:inline-block; float:right; }input.item_quantity { text-align:center; width: 40px!important; display:inline-block; margin-right: 2em;}a.item_add { font-size: 125%; float: right; display:inline-block; }td.item_price { font-weight:700; font-size:19px; padding-bottom: 1.5em;}

.mfp-content { opacity: 0; transition: all 0.2s; transform: translateY(-100px); }.mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; transform: translateY(0); }.mfp-fade.mfp-wrap.mfp-removing .mfp-content { transform: translateY(-100px); opacity: 0; }/* MEDIA QUIRIES */@media only screen and (max-width:800px) {table.product-image , table.product-detail, table.product-description, table.product-thumbnail { width:auto; float:none; display:block; position:static; overflow:hidden!important; clear:both;}table.product-image { position:static; }table.product-thumbnail img { width:260px; }.add-cart-wrapper { width:auto; display:block; }#related-product a { width: 47.8%; }.post-footer-line { display:block; width:auto; float:none; clear:both; margin-left:0; margin-right:0;}}@media only screen and (max-width:480px) {}</style></b:if>

Page 20: HTML My Blog Tugas

<b:if cond='data:blog.pageType == &quot;static_page&quot;'><style>.post img { max-width:760px; margin:0 auto; text-align:center; border:1px solid #ccc;-webkit-box-shadow:0 0 8px rgba(0,0,0,.15);-moz-box-shadow:0 0 8px rgba(0,0,0,.15); box-shadow:0 0 8px rgba(0,0,0,.15);}.post { padding: 3% 6%; }.post header { text-align: left; }@media only screen and (max-width:800px) {.post { padding: 3%; }}</style></b:if>

<style>@media only screen and (max-width:800px) {#header-wrapper h1, #header-wrapper h2, #header-wrapper h2 a { font-size:49px; text-align:center; }.Header, #header { padding-bottom:0; }.view-cart-wrapper { position:absolute; top:1em; right:0; display:block; }#header-inner { min-height:100%; overflow:none; }.descriptionwrapper { display:none; }.titlewrapper { display:block; max-width:90%; padding:1em 0; margin:0 auto; }#blogrcart-search { position:static; display:block; float:none; width: 90%; margin:0 auto; padding:1em 0 0;}.list .widget { width:48%; }#footer .widget, #footer div, .sidebar .widget, .sidebar div { display:block; width:100%; float:none; }.widget.FollowByEmail { width:94%; }#sidebar h2, #sidebar h3, .widget.FollowByEmail { text-align:center; }.payments li, .iconsWrap li { float:none; }.item-thumbimg { display:none!important; }}@media only screen and (max-width:480px) {.list .widget { display:block; float:none; width: 100%; margin:0; }.post { display:block; width:auto; float: none; margin: 0 0 3em; }.item-size,.item-color,.item-pagelink { display:none!important; }.cart-details a.button { margin:0 auto .5em; }.cart-details a.simpleCart_checkout { display:block; margin:0 auto .5em; }#contact div { width:97.5%; float:none; display:block; }a#blog-pager-newer-link, a#blog-pager-older-link, #blog-pager a.home-link { width: 100%; margin:0 auto 2px; float:none; display:block; }}</style>

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js' type='text/javascript'/>

</head>

<body>

<script>//<![CDATA[window.fbAsyncInit = function() { FB.init({ appId : '1490997184493796', xfbml : true, version : 'v2.1' }); };//]]></script><div id='fb-root'/>

<span id='skiplinks' style='display:none;'><a href='#main'>skip to main </a>

Page 21: HTML My Blog Tugas

| <a href='#sidebar'>skip to sidebar</a></span>

<div class='group' id='cart-wrapper'> <div class='inner-wrapper'>

<!-- =====ADD/REMOVE/EDIT URL/TEXT TO DROP DOWN MENU====== --> <a class='menu-link' href='#'>&#9776;</a> <nav class='menu group' id='menu'> <ul> <!-- MAIN NAVIGATIONS -->

<!-- NO CUSTOMIZATIONS REQUIRED --> <li><a class='active' href='/'>Home</a></li> <li><a href='http://trade-edisional.blogspot.co.id/p/blog-page.html'>Mengenai Saya</a></li>

<li><a href='#'>Tentang Produk</a></li> <li><a href='#'>Cara Pemesanan</a></li> </ul> </nav>

<!-- VIEW CART --> <div class='view-cart-wrapper group'> <span class='simpleCart_quantity'/> items. <span class='simpleCart_total'/>

<!-- EDIT SEND ORDER URL HERE --> <a href='/p/send-order.html' id='cart-detail'>&#9660; View Car

t</a>

<div class='cart-details' style='display:none'><span class='close'>X</span><span class='simpleCart_items'/>

<!-- CHECKOUT BUTTONS --> <!-- EDIT SEND ORDER URL HERE -->

<a class='send-order button' href='/p/send-order.html'>Send Order</a>

<!-- REMOVE PAYPAL CHECKOUT BUTTON IF NOT REQUIRED --> <a class='simpleCart_checkout' href='javascript:;'>Pay With Paypal</a>

<a class='simpleCart_empty button' href='javascript:;'>Clear Cart</a> </div> </div> </div>

</div>

<header class='group shadows' id='header-wrapper'> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='Sampah-Rejeki (Header)' type='Header'> <b:includable id='main'><b:if cond='data:blog.pageType == &quot;index&quot;'> <b:if cond='data:useImage'> <b:if cond='data:imagePlacement == &quot;BEHIND&quot;'>

Page 22: HTML My Blog Tugas

<style>#header{padding-bottom:0;}</style> <b:if cond='data:mobile'> <div class='bg-parallax' id='header-inner'> <div class='titlewrapper' style='background: transparent'> <b:include name='title'/> </div> <b:include name='description'/> </div> <b:else/>

<style>#header{padding-bottom:0;}</style> <div class='bg-parallax' data-speed='10' expr:style='&quot;background-image:url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;); &quot;' id='header-inner'> <div class='titlewrapper' style='background:transparent'> <b:include name='title'/> </div> <b:include name='description'/> </div> </b:if> <b:else/>

<style>#header{padding-bottom:0;}</style> <!-- Show the image only --> <div class='bg-parallax' data-speed='10' expr:style='&quot;background-image:url(\&quot;&quot; + data:sourceUrl + &quot;\&quot;);&quot;' id='header-inner'> <!-- Show the description --> <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'><br/><br/> <b:include name='description'/> </b:if> </div> </b:if> <b:else/> <!--No header image --> <div class='titlewrapper'><b:include name='title'/></div> </b:if><b:else/> <!--No header image --> <div class='titlewrapper'><b:include name='title'/></div></b:if> <b:include name='quickedit'/></b:includable> <b:includable id='description'> <div class='descriptionwrapper'> <p class='description'><data:description/></p>

<a class='button medium' expr:href='data:blog.canonicalUrl + &quot;#slider&quot;'>What&#39;s New &amp;gt;</a> &amp;nbsp;&amp;nbsp; <a class='button medium' expr:href='data:blog.canonicalurl + &quot;#content-wrapper&quot;'>Shop Now &amp;gt;</a> </div></b:includable> <b:includable id='title'> <b:if cond='data:blog.url == data:blog.homepageUrl'> <h1 class='title'><data:title/></h1> <b:else/> <h2 class='title'><a expr:href='data:blog.homepageUrl'><data:title/></a></h2> </b:if></b:includable> </b:widget> </b:section>

Page 23: HTML My Blog Tugas

<!-- SEARCH BAR --> <form action='/search' class='group' id='blogrcart-search' method='get'>

<div> <input name='submit' type='submit' value='Search'/> <input name='q' onblur='if(this.value==&apos;&apos;)this.value=&apos;Type in your search product...&apos;;' onfocus='if(this.value==&apos;&apos;)this.value=&apos;&apos;;' placeholder='Type in your search product...' type='search'/> <!-- FACEBOOK LIKE BUTTON --> <div class='fb-like' data-action='like' data-layout='button_count' data-share='true' data-show-faces='true' expr:data-href='data:blog.canonicalUrl' style='margin-top:1em;'/> </div>

</form> </header>

<b:if cond='data:blog.pageType == &quot;index&quot;'> <h2 class='section-title inner-wrapper' id='slider'><span>New</span><hr class='section-line'/></h2> <div class='curl' id='slidesider'>

<!-- IMAGE CAROUSEL --><div class='blogrcart-carousel'>

<script>//<![CDATA[var showpostthumbnails_gal = true;var random_posts = true; //TRUE OR FALSE FOR RANDOM PRODUCTvar numposts_gal = 10; //NOS OF PRODUCT TO SHOWvar img_size = 420; //PRODUCT IMAGE SIZE TO DISPLAY// ADD DEFAULT IMAGE IF NO IMAGE IS PRESENTvar default_image = 'http://3.bp.blogspot.com/-O2xQgV0u-v4/Uhtm4WaoBnI/AAAAAAAAHFM/sIPySvkwTFA/s1600/placeholder-product-image-large.png';function showProducts(p) { var q=p.feed.openSearch$totalResults.$t; var e=new Array(); for(var l=0;l<q;++l){e[l]=l;} if(random_posts==true) { e.sort(function() { return 0.5-Math.random(); }); } if(numposts_gal>q) { numposts_gal=q; } for(l=0;l<numposts_gal;++l){ var j=p.feed.entry[e[l]]; var f=j.title.$t; for(var h=0;h<j.link.length;h++){ if(j.link[h].rel=="alternate"){ posturl_gal=j.link[h].href;break}; }; if("content" in j) { var m=j.content.$t}; s=m; a=s.indexOf("<img"); b=s.indexOf('src="',a); c=s.indexOf('"',b+5); d=s.substr(b+5,c-b-5); if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) { var g=d.replace("/s380/","/s"+img_size+"/") } else { var g=default_image }; document.write('<div class="image"><a href="'+posturl_gal+'#list"><span class="img-slides" style="background:url('+g+') no-repeat center;"></span><h3 class="desc-wrapper"></a>'+f+'</h3></div>'); }; };//]]></script><script expr:src='&quot;/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showProducts&amp;max-results=999999&quot;'/> </div>

</div> </b:if>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.url != data:blog.homepageUrl'> <div class='group' id='list-wrapper'> <b:section class='list group inner-wrapper' id='list' maxwidgets='4' showaddelement='no'> <b:widget id='Label99' locked='true' title='Labels' type='Label'> <b:includable id='main'> <div class='widget-content'> <select onchange='location=this.options[this.selectedIndex].value;

Page 24: HTML My Blog Tugas

'> <!-- EDIT LABELS TO DISPLAY --> <option>Search By Price</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url + &quot;#list&quot;'><data:label.name/> (<data:label.count/>)</option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget> <b:widget id='Label98' locked='true' title='Labels' type='Label'> <b:includable id='main'> <div class='widget-content'> <select onchange='location=this.options[this.selectedIndex].value;'> <!-- EDIT LABELS TO DISPLAY --> <option>Search By Size</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url + &quot;#list&quot;'><data:label.name/> (<data:label.count/>)</option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget> <b:widget id='Label97' locked='true' title='Labels' type='Label'> <b:includable id='main'> <div class='widget-content'> <select onchange='location=this.options[this.selectedIndex].value;'> <!-- EDIT LABELS TO DISPLAY --> <option>Search By Brand</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url + &quot;#list&quot;'><data:label.name/> (<data:label.count/>)</option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget> <b:widget id='Label96' locked='true' title='Labels' type='Label'> <b:includable id='main'> <div class='widget-content'> <select onchange='location=this.options[this.selectedIndex].value;'> <!-- EDIT LABELS TO DISPLAY --> <option>Search By Colour</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url + &quot;#list&quot;'><data:label.name/> (<data:label.count/>)</option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget>

Page 25: HTML My Blog Tugas

</b:section> </div> </b:if> </b:if>

<div id='content-wrapper'>

<div class='group inner-wrapper' id='main-wrapper'> <b:section class='main group' id='main' showaddelement='no'> <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'> <b:includable id='main' var='top'> <!-- posts --> <b:if cond='data:blog.pageType == &quot;index&quot;'> <h2 class='section-title'><span>Current</span><hr class='section-line'/></h2> </b:if> <div class='group' id='blog-posts'> <b:include name='status-message'/> <b:loop values='data:posts' var='post'> <b:if cond='data:post.dateHeader'> <time class='date-header'><data:post.dateHeader/></time> </b:if> <b:include data='post' name='post'/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <b:if cond='data:post.showThreadedComments'>

<div class='tabs-section group' id='comment-section'> <b:include data='post' name='threaded_comments'/>

</div> <b:else/>

<div class='tabs-section group' id='comment-section'><b:include data='post' name='comments'/>

<b:include data='post' name='comment-form'/></div>

</b:if> </b:if> </b:loop> </div> <!-- navigation --> <b:include name='nextprev'/> </b:includable> <b:includable id='backlinkDeleteIcon' var='backlink'> <span expr:class='&quot;item-control &quot; + data:backlink.adminClass'> <a expr:href='data:backlink.deleteUrl' title='Delete Backlink'> <span class='delete-comment-icon'>&#160;</span> </a> </span> </b:includable> <b:includable id='backlinks' var='post'> <a name='links'/><h4><data:post.backlinksLabel/></h4> <b:if cond='data:post.numBacklinks != 0'> <dl id='comments-block'> <b:loop values='data:post.backlinks' var='backlink'> <div class='collapsed-backlink backlink-control'> <dt class='comment-title'> <span class='backlink-toggle-zippy'>&#160;</span> <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a> <b:include data='backlink' name='backlinkDeleteIcon'/> </dt> <dd class='comment-body collapseable'>

Page 26: HTML My Blog Tugas

<data:backlink.snippet/> </dd> <dd class='comment-footer collapseable'> <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span> <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span> </dd> </div> </b:loop> </dl> </b:if> <p class='comment-footer'> <a class='comment-link' expr:href='data:post.createLinkUrl' id='b-backlink' target='_blank'><data:post.createLinkLabel/></a> </p> </b:includable> <b:includable id='comment-form' var='post'> <div class='comment-form'> <a name='comment-form'/> <h4 id='comment-post-message'><data:postCommentMsg/></h4> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/> <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/> <data:post.friendConnectJs/> <data:post.cmtfpIframe/> <script type='text/javascript'> BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;); </script> </div> </b:includable> <b:includable id='commentDeleteIcon' var='comment'> <span expr:class='&quot;item-control &quot; + data:comment.adminClass'> <a expr:href='data:comment.deleteUrl' title='Delete Comment'> <span class='delete-comment-icon'>&#160;</span> </a> </span> </b:includable> <b:includable id='comment_count_picker' var='post'> <b:if cond='data:post.commentSource == 1'> <span class='cmt_count_iframe_holder' expr:data-count='data:post.numComments' expr:data-onclick='data:post.addCommentOnclick' expr:data-post-url='data:post.url' expr:data-url='data:post.canonicalUrl'> </span> <b:else/> <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <data:post.commentLabelFull/>: </a> </b:if> </b:includable> <b:includable id='comment_picker' var='post'> <b:if cond='data:post.commentSource == 1'> <b:include data='post' name='iframe_comments'/> <b:else/> <b:if cond='data:post.showThreadedComments'>

Page 27: HTML My Blog Tugas

<b:include data='post' name='threaded_comments'/> <b:else/> <b:include data='post' name='comments'/> </b:if> </b:if> </b:includable> <b:includable id='comments' var='post'>

<section class='comments' id='comments'> <a name='comments'/> <h4> <b:if cond='data:post.numComments == 1'> 1 Review: <b:else/> <data:post.numComments/> Reviews: </b:if> </h4> <dl id='comments-block'> <b:loop values='data:post.comments' var='comment'> <dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'> <a expr:name='&quot;comment-&quot; + data:comment.id'/> <b:if cond='data:comment.authorUrl'> <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a> <b:else/> <data:comment.author/> </b:if> said... </dt> <dd class='comment-body'> <b:if cond='data:comment.isDeleted'> <span class='deleted-comment'><data:comment.body/></span> <b:else/> <p><data:comment.body/></p> </b:if> </dd> <dd class='comment-footer'> <span class='comment-timestamp'> <a expr:href='&quot;#comment-&quot; + data:comment.id' title='comment permalink'> <data:comment.timestamp/> </a> <b:include data='comment' name='commentDeleteIcon'/> </span> </dd> </b:loop> </dl> <p class='comment-footer'> <b:if cond='data:post.embedCommentForm'> <b:include data='post' name='comment-form'/> <b:else/> <b:if cond='data:post.allowComments'> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a> </b:if> </b:if> </p> <div id='backlinks-container'> <b:if cond='data:post.showBacklinks'> <b:include data='post' name='backlinks'/> </b:if> </div> </section> </b:includable> <b:includable id='feedLinks'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links --

Page 28: HTML My Blog Tugas

> <b:if cond='data:feedLinks'> <div id='blog-feeds'> <b:include data='feedLinks' name='feedLinksBody'/> </div> </b:if> <b:else/> <!-- Post feed links --> <div id='post-feeds'> <b:loop values='data:posts' var='post'> <b:if cond='data:post.allowComments'> <b:if cond='data:post.feedLinks'> <b:include data='post.feedLinks' name='feedLinksBody'/> </b:if> </b:if> </b:loop> </div> </b:if></b:includable> <b:includable id='feedLinksBody' var='links'> <div class='feed-links'> Subscribe to: <b:loop values='data:links' var='f'> <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a> </b:loop> </div> </b:includable> <b:includable id='iframe_comments' var='post'> <b:if cond='data:post.allowIframeComments'> <script expr:src='data:post.iframeCommentSrc' type='text/javascript'/> <div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/> <b:if cond='data:post.embedCommentForm == &quot;false&quot;'> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a> </b:if> </b:if> </b:includable> <b:includable id='mobile-index-post' var='post'> <div class='mobile-date-outer date-outer'> <b:if cond='data:post.dateHeader'> <div class='date-header'> <span><data:post.dateHeader/></span> </div> </b:if> <div class='mobile-post-outer'> <a expr:href='data:post.url'> <h3 class='mobile-index-title entry-title' itemprop='name'> <data:post.title/> </h3> <div class='mobile-index-arrow'>&amp;rsaquo;</div> <div class='mobile-index-contents'> <b:if cond='data:post.thumbnailUrl'> <div class='mobile-index-thumbnail'> <div class='Image'> <img expr:src='data:post.thumbnailUrl'/> </div> </div> </b:if> <div class='post-body'>

Page 29: HTML My Blog Tugas

<b:if cond='data:post.snippet'><data:post.snippet/></b:if> </div> </div> <div style='clear:both;'/> </a> <div class='mobile-index-comment'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:post.allowComments'> <b:if cond='data:post.numComments != 0'> <b:include data='post' name='comment_count_picker'/> </b:if> </b:if> </b:if> </div> </div> </div> </b:includable> <b:includable id='mobile-main' var='top'> <!-- posts --> <div class='blog-posts hfeed'> <b:include data='top' name='status-message'/> <b:if cond='data:blog.pageType == &quot;index&quot;'> <b:loop values='data:posts' var='post'> <b:include data='post' name='mobile-index-post'/> </b:loop> <b:else/> <b:loop values='data:posts' var='post'> <b:include data='post' name='mobile-post'/> </b:loop> </b:if> </div> <b:include name='mobile-nextprev'/> </b:includable> <b:includable id='mobile-nextprev'> <div class='blog-pager group' id='blog-pager'> <b:if cond='data:newerPageUrl'> <div class='mobile-link-button' id='blog-pager-newer-link'> <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>&amp;lsaquo;</a> </div> </b:if> <b:if cond='data:olderPageUrl'> <div class='mobile-link-button' id='blog-pager-older-link'> <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>&amp;rsaquo;</a> </div> </b:if> <div class='mobile-link-button' id='blog-pager-home-link'> <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a> </div> <div class='mobile-desktop-link'> <a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a> </div> </div> </b:includable> <b:includable id='mobile-post' var='post'> <div class='date-outer'>

Page 30: HTML My Blog Tugas

<b:if cond='data:post.dateHeader'> <h2 class='date-header'><span><data:post.dateHeader/></span></h2> </b:if> <div class='date-posts'> <div class='post-outer'> <div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'> <b:if cond='data:post.thumbnailUrl'> <meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/> </b:if> <meta expr:content='data:blog.blogId' itemprop='blogId'/> <meta expr:content='data:post.id' itemprop='postId'/> <a expr:name='data:post.id'/> <b:if cond='data:post.title'> <h3 class='post-title entry-title' itemprop='name'> <b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <a expr:href='data:post.url'><data:post.title/></a> <b:else/> <data:post.title/> </b:if> <b:else/> <data:post.title/> </b:if> </b:if> </h3> </b:if> <div class='post-header'> <div class='post-header-line-1'/> </div> <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'> <data:post.body/> <div style='clear: both;'/> <!-- clear for photos floats --> </div> <div class='post-footer'> <div class='post-footer-line post-footer-line-1'> <span class='post-author vcard'> <b:if cond='data:top.showAuthor'> <b:if cond='data:post.authorProfileUrl'> <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'> <meta expr:content='data:post.authorProfileUrl' itemprop='url'/> <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'> <span itemprop='name'><data:post.author/></span> </a> </span> <b:else/> <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'> <span itemprop='name'><data:post.author/></span> </span> </b:if> </b:if> </span>

Page 31: HTML My Blog Tugas

<span class='post-timestamp'> <b:if cond='data:top.showTimestamp'> <data:top.timestampLabel/> <b:if cond='data:post.url'> <meta expr:content='data:post.canonicalUrl' itemprop='url'/> <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a> </b:if> </b:if> </span> <span class='post-comment-link'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:post.allowComments'> <b:include data='post' name='comment_count_picker'/> </b:if> </b:if> </b:if> </span> </div> <div class='post-footer-line post-footer-line-2'> <b:if cond='data:top.showMobileShare'> <div class='mobile-link-button goog-inline-block' id='mobile-share-button'> <a href='javascript:void(0);'><data:shareMsg/></a> </div> </b:if> <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div> </b:if> </div> </div> </div> <b:if cond='data:blog.pageType == &quot;static_page&quot;'> <b:include data='post' name='comment_picker'/> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <b:include data='post' name='comment_picker'/> </b:if> </div> </div> </div> </b:includable> <b:includable id='nextprev'> <div class='group' id='blog-pager'> <b:if cond='data:newerPageUrl'> <a class='button' expr:href='data:newerPageUrl' expr:title='data:newerPageTitle' id='blog-pager-newer-link'>Next Item</a> </b:if> <b:if cond='data:olderPageUrl'> <a class='button' expr:href='data:olderPageUrl' expr:title='data:olderPageTitle' id='blog-pager-older-link'>Previous Item</a> </b:if> <b:if cond='data:blog.homepageUrl != data:blog.url'> <a class='button home-link' expr:href='data:blog.homepageUrl'>Current Items</a> </b:if>

Page 32: HTML My Blog Tugas

</div><b:if cond='data:blog.pageType == &quot;index&quot;'><script>var pagerId = &#39;blog-pager&#39;;var pageCount = 12;var displayPageNum = 4;var upPageWord = &#39;&lt; Prev&#39;;var downPageWord = &#39;Next &gt;&#39;;</script></b:if> </b:includable> <b:includable id='post' var='post'> <section class='post uncustomized-post-template simpleCart_shelfItem'> <a expr:name='data:post.id'/> <b:if cond='data:post.title'> <header class='post-title entry-title item_name' itemprop='name'> <b:if cond='data:blog.pageType == &quot;index&quot;'> <b:if cond='data:post.link'> <h2><a expr:href='data:post.link + &quot;#list&quot;'><data:post.title/></a></h2> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <h2 class='title'><a expr:href='data:post.url + &quot;#list&quot;'><data:post.title/></a></h2> <b:else/> <h2><data:post.title/></h2> </b:if> <b:else/> <h2><data:post.title/></h2> </b:if> </b:if> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <b:if cond='data:post.link'> <h2><a expr:href='data:post.link + &quot;#list&quot;'><data:post.title/></a></h2> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <h2><a expr:href='data:post.url + &quot;#list&quot;'><data:post.title/></a></h2> <b:else/> <h2><data:post.title/></h2> </b:if> <b:else/> <h2><data:post.title/></h2> </b:if> </b:if> <b:else/> <b:if cond='data:post.link'> <h1><a expr:href='data:post.link+&quot;#list&quot;'><data:post.title/></a></h1> <b:else/> <b:if cond='data:post.url'> <b:if cond='data:blog.url != data:post.url'> <h1><a expr:href='data:post.url + &quot;#list&quot;'><data:post.title/></a></h1> <b:else/> <h1><data:post.title/></h1>

Page 33: HTML My Blog Tugas

</b:if> <b:else/> <h1><data:post.title/></h1> </b:if> </b:if> </b:if> </b:if> </header> </b:if> <article class='post-body group'> <data:post.body/> <div class='add-cart-wrapper group'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <div class='fb-like' data-action='like' data-layout='button_count' data-share='false' data-show-faces='false'/> </b:if> </b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='fb-share-button' data-layout='button_count' expr:data-href='data:blog.url'/>&amp;nbsp;|&amp;nbsp; <b:if cond='data:post.allowComments'> <a class='comment-count' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> <data:post.numComments/> Users Reviewed.</a> </b:if> </b:if> <b:if cond='data:blog.pageType != &quot;index&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <!-- ADD TO CART BUTTON --> <span><a class='button item_add' href='javascript:;'>Add to Cart</a></span> <span class='label-quantity'>Quantity <input class='item_quantity' size='2' type='text' value='1'/></span> <img class='item_thumbimg' expr:alt='data:post.title' expr:src='data:post.firstImageUrl' style='display:none!important;'/> </b:if> </b:if> </div> </article> <b:if cond='data:blog.pageType != &quot;index&quot;'>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <div class='post-footer group'> <p class='post-footer-line post-footer-line-1'> <span class='post-author'> <b:if cond='data:top.showAuthor'> <data:top.authorLabel/> <data:post.author/> </b:if> </span> <span class='post-timestamp'> <b:if cond='data:top.showTimestamp'> <data:top.timestampLabel/> <b:if cond='data:post.url'> <a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a> </b:if> </b:if> </span> <span class='post-comment-link'> <b:if cond='data:blog.pageType != &quot;item&quot;'>

Page 34: HTML My Blog Tugas

<b:if cond='data:post.allowComments'> <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a> </b:if> </b:if> </span> <!-- backlinks --> <span class='post-backlinks post-comment-link'> <b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:post.showBacklinks'> <a class='comment-link' expr:href='data:post.url + &quot;#links&quot;'><data:top.backlinkLabel/></a> </b:if> </b:if> </span> <span class='post-icons'> <!-- email post links --> <b:if cond='data:post.emailPostUrl'> <span class='item-action'> <a expr:href='data:post.emailPostUrl' title='Email Post'> <span class='email-post-icon'>&#160;</span> </a> </span> </b:if> <!-- quickedit pencil --> <b:include data='post' name='postQuickEdit'/> </span> </p> <p class='post-footer-line post-footer-line-2'> <span class='post-labels'> <b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url + &quot;#list&quot;' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if> </b:loop> </b:if> </span> </p> <p class='post-footer-line post-footer-line-3'/> </div> </b:if> </b:if>

</section> </b:includable> <b:includable id='postQuickEdit' var='post'> <b:if cond='data:post.editUrl'> <span expr:class='&quot;item-control &quot; + data:post.adminClass'> <a expr:href='data:post.editUrl' title='Edit Post'> <span class='quick-edit-icon'>&#160;</span> </a> </span> </b:if> </b:includable> <b:includable id='shareButtons' var='post'> <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-lin

Page 35: HTML My Blog Tugas

k-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + &quot;&amp;target=orkut&quot;' expr:title='data:top.shareToOrkutMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToOrkutMsg/></span></a></b:if><b:if cond='data:top.showPinterestButton'><a class='goog-inline-block share-button sb-pinterest' expr:href='data:post.sharePostUrl + &quot;&amp;target=pinterest&quot;' expr:title='data:top.shareToPinterestMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToPinterestMsg/></span></a></b:if><b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container'><data:post.dummyTag/></div></b:if> </b:includable> <b:includable id='status-message'> <b:if cond='data:navMessage'> <div class='status-msg-wrap group'> <div class='status-msg-body'> <data:navMessage/> </div> <div class='status-msg-border'> <div class='status-msg-bg'> <div class='status-msg-hidden'><data:navMessage/></div> </div> </div> </div> </b:if> </b:includable> <b:includable id='threaded-comment-form' var='post'> <div class='comment-form'> <a name='comment-form'/> <b:if cond='data:mobile'> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/> <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/> <b:else/> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/> <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/> </b:if> <data:post.friendConnectJs/> <data:post.cmtfpIframe/> <script type='text/javascript'>

Page 36: HTML My Blog Tugas

BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;); </script> </div> </b:includable> <b:includable id='threaded_comment_js' var='post'> <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/> <script type='text/javascript'> (function() { var items = <data:post.commentJso/>; var msgs = <data:post.commentMsgs/>; var config = <data:post.commentConfig/>; // <![CDATA[ var cursor = null; if (items && items.length > 0) { cursor = parseInt(items[items.length - 1].timestamp) + 1; } var bodyFromEntry = function(entry) { if (entry.gd$extendedProperty) { for (var k in entry.gd$extendedProperty) { if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') { return '<span class="deleted-comment">' + entry.content.$t + '</span>'; } } } return entry.content.$t; } var parse = function(data) { cursor = null; var comments = []; if (data && data.feed && data.feed.entry) { for (var i = 0, entry; entry = data.feed.entry[i]; i++) { var comment = {}; // comment ID, parsed out of the original id format var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t); comment.id = id ? id[2] : null; comment.body = bodyFromEntry(entry); comment.timestamp = Date.parse(entry.published.$t) + ''; if (entry.author && entry.author.constructor === Array) { var auth = entry.author[0]; if (auth) { comment.author = { name: (auth.name ? auth.name.$t : undefined), profileUrl: (auth.uri ? auth.uri.$t : undefined), avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined) }; } } if (entry.link) { if (entry.link[2]) { comment.link = comment.permalink = entry.link[2].href; } if (entry.link[3]) { var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href); if (pid && pid[1]) { comment.parentId = pid[1]; }

Page 37: HTML My Blog Tugas

} } comment.deleteclass = 'item-control blog-admin'; if (entry.gd$extendedProperty) { for (var k in entry.gd$extendedProperty) { if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') { comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value; } else if (entry.gd$extendedProperty[k].name == 'blogger.displayTime') { comment.displayTime = entry.gd$extendedProperty[k].value; } } } comments.push(comment); } } return comments; }; var paginator = function(callback) { if (hasMore()) { var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=100'; if (cursor) { url += '&published-min=' + new Date(cursor).toISOString(); } window.bloggercomments = function(data) { var parsed = parse(data); cursor = parsed.length < 50 ? null : parseInt(parsed[parsed.length - 1].timestamp) + 1 callback(parsed); window.bloggercomments = null; } url += '&callback=bloggercomments'; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = url; document.getElementsByTagName('head')[0].appendChild(script); } }; var hasMore = function() { return !!cursor; }; var getMeta = function(key, comment) { if ('iswriter' == key) { var matches = !!comment.author && comment.author.name == config.authorName && comment.author.profileUrl == config.authorUrl; return matches ? 'true' : ''; } else if ('deletelink' == key) { return config.baseUri + '/delete-comment.g?blogID=' + config.blogId + '&postID=' + comment.id; } else if ('deleteclass' == key) { return comment.deleteclass; } return ''; }; var replybox = null; var replyUrlParts = null;

Page 38: HTML My Blog Tugas

var replyParent = undefined; var onReply = function(commentId, domId) { if (replybox == null) { // lazily cache replybox, and adjust to suit this style: replybox = document.getElementById('comment-editor'); if (replybox != null) { replybox.height = '250px'; replybox.style.display = 'block'; replyUrlParts = replybox.src.split('#'); } } if (replybox && (commentId !== replyParent)) { document.getElementById(domId).insertBefore(replybox, null); replybox.src = replyUrlParts[0] + (commentId ? '&parentID=' + commentId : '') + '#' + replyUrlParts[1]; replyParent = commentId; } }; var hash = (window.location.hash || '#').substring(1); var startThread, targetComment; if (/^comment-form_/.test(hash)) { startThread = hash.substring('comment-form_'.length); } else if (/^c[0-9]+$/.test(hash)) { targetComment = hash.substring(1); } // Configure commenting API: var configJso = { 'maxDepth': config.maxThreadDepth }; var provider = { 'id': config.postId, 'data': items, 'loadNext': paginator, 'hasMore': hasMore, 'getMeta': getMeta, 'onReply': onReply, 'rendered': true, 'initComment': targetComment, 'initReplyThread': startThread, 'config': configJso, 'messages': msgs }; var render = function() { if (window.goog && window.goog.comments) { var holder = document.getElementById('comment-holder'); window.goog.comments.render(holder, provider); } }; // render now, or queue to render when library loads: if (window.goog && window.goog.comments) { render(); } else { window.goog = window.goog || {}; window.goog.comments = window.goog.comments || {}; window.goog.comments.loadQueue = window.goog.comments.loadQueue || []; window.goog.comments.loadQueue.push(render); } })();//]]>

Page 39: HTML My Blog Tugas

</script> </b:includable> <b:includable id='threaded_comments' var='post'>

<section class='comments' id='comments'> <a name='comments'/> <h4>Write A Review</h4> <div class='comments-content'> <b:if cond='data:post.embedCommentForm'> <b:include data='post' name='threaded_comment_js'/> </b:if> <div id='comment-holder'> <data:post.commentHtml/> </div> </div> <p class='comment-footer'> <b:if cond='data:post.allowNewComments'> <b:include data='post' name='threaded-comment-form'/> <b:else/> <data:post.noNewCommentsText/> </b:if> </p> <b:if cond='data:showCmtPopup'> <div id='comment-popup'> <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'> </iframe> </div> </b:if> <div id='backlinks-container'> <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'> <b:if cond='data:post.showBacklinks'> <b:include data='post' name='backlinks'/> </b:if> </div> </div> </section> </b:includable> </b:widget> </b:section>

<aside id='sidebar-wrapper'><div class='sidebar-bg'/> <b:section class='sidebar group' id='sidebar' preferred='yes'> <b:widget id='HTML1' locked='false' title='Testimoni' type='HTML'> <b:includable id='main'> <!-- only display title if it's non-empty --> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> </b:if> <div class='widget-content'> <data:content/> </div>

<b:include name='quickedit'/></b:includable> </b:widget> <b:widget id='Label1' locked='true' title='Labels' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if>

Page 40: HTML My Blog Tugas

<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> <b:if cond='data:display == &quot;list&quot;'> <ul> <b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span dir='ltr'>(<data:label.count/>)</span> </b:if> </li> </b:loop> </ul> <b:else/> <b:loop values='data:labels' var='label'> <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span class='label-count' dir='ltr'>(<data:label.count/>)</span> </b:if> </span> </b:loop> </b:if> <b:include name='quickedit'/> </div></b:includable> </b:widget> <b:widget id='HTML98' locked='true' title='Edit Payment &amp;amp; Social Link' type='HTML'> <b:includable id='main'> <div class='widget-content'>

<!-- EDIT SOCIAL ICON TITLE --> <h3>Join Our Community</h3> <ul class='iconsWrap group'> <!-- EDIT URL TO PROFILE PAGE --> <li class='facebook'><a href='http://www.facebook.com/#' rel='nofollow'>Facebook</a></li> <li class='google'><a href='https://plus.google.com/#' rel='author'>Google Plus</a></li> <li class='twitter'><a href='https://twitter.com/#' rel='nofollow'>Twitter</a></li> <li class='gmail'><a href='mailto:[email protected]' rel='nofollow'>Email Us</a></li> </ul> <data:content/> </div>

Page 41: HTML My Blog Tugas

<b:include name='quickedit'/> </b:includable> </b:widget> <b:widget id='FollowByEmail1' locked='true' title='Subscribe' type='FollowByEmail'> <b:includable id='main'> <b:if cond='data:title != &quot;&quot;'> <h2 class='title'><data:title/></h2> <p> Up to 20% discounts when you subscribe! Grab our discounts codes right here. </p> </b:if> <div class='widget-content'> <div class='follow-by-email-inner'> <form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='&quot;window.open(\&quot;http://feedburner.google.com/fb/a/mailverify?uri=&quot; + data:feedPath + &quot;\&quot;, \&quot;popupwindow\&quot;, \&quot;scrollbars=yes,width=550,height=520\&quot;); return true&quot;' method='post' target='popupwindow'> <table width='100%'> <tr> <td> <input class='follow-by-email-address' name='email' placeholder='Email address...' type='text'/> </td> <td width='64px'> <input class='follow-by-email-submit' type='submit' value='Submit'/> </td> </tr> </table> <input expr:value='data:feedPath' name='uri' type='hidden'/> <input name='loc' type='hidden' value='en_US'/> </form> </div> </div> <span class='item-control blog-admin'> <b:include name='quickedit'/> </span></b:includable> </b:widget> <b:widget id='Profile1' locked='false' title='Mengenai Saya' type='Profile'> <b:includable id='main'> <b:if cond='data:title != &quot;&quot;'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <b:if cond='data:team'> <!-- team blog profile --> <ul> <b:loop values='data:authors' var='i'> <li><a class='profile-name-link g-profile' expr:href='data:i.userUrl' expr:style='&quot;background-image: url(&quot; + data:i.profileLogo + &quot;);&quot;'><data:i.display-name/></a></li> </b:loop> </ul>

<b:else/> <!-- normal blog profile -->

<b:if cond='data:photo.url != &quot;&quot;'>

Page 42: HTML My Blog Tugas

<a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a> </b:if>

<dl class='profile-datablock'> <dt class='profile-data'> <a class='profile-name-link g-profile' expr:href='data:userUrl' expr:style='&quot;background-image: url(&quot; + data:profileLogo + &quot;);&quot;' rel='author'> <data:displayname/> </a> <b:if cond='data:hasgoogleprofile'> <br/> <div class='g-follow' data-annotation='bubble' data-height='20' expr:data-href='data:userUrl'/> </b:if> </dt>

<b:if cond='data:showlocation'> <dd class='profile-data'><data:location/></dd> </b:if>

<b:if cond='data:aboutme != &quot;&quot;'><dd class='profile-textblock'><data:aboutme/></dd></b:if> </dl> <a class='profile-link' expr:href='data:userUrl' rel='author'><data:viewProfileMsg/></a> </b:if>

<b:include name='quickedit'/> </div> </b:includable> </b:widget> <b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'> <b:includable id='main'> <b:if cond='data:title != &quot;&quot;'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <div id='ArchiveList'> <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'> <b:include cond='data:style == &quot;HIERARCHY&quot;' data='data' name='interval'/> <b:include cond='data:style == &quot;FLAT&quot;' data='data' name='flat'/> <b:include cond='data:style == &quot;MENU&quot;' data='data' name='menu'/> </div> </div> <b:include name='quickedit'/> </div></b:includable> <b:includable id='flat' var='data'> <ul class='flat'> <b:loop values='data:data' var='i'> <li class='archivedate'> <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>) </li> </b:loop> </ul>

Page 43: HTML My Blog Tugas

</b:includable> <b:includable id='interval' var='intervalData'> <b:loop values='data:intervalData' var='interval'> <ul class='hierarchy'> <li expr:class='&quot;archivedate &quot; + data:interval.expclass'> <b:include cond='data:interval.toggleId' data='interval' name='toggle'/> <a class='post-count-link' expr:href='data:interval.url'> <data:interval.name/> </a> <span class='post-count' dir='ltr'>(<data:interval.post-count/>)</span> <b:include cond='data:interval.data' data='interval.data' name='interval'/> <b:include cond='data:interval.posts' data='interval.posts' name='posts'/> </li> </ul> </b:loop></b:includable> <b:includable id='menu' var='data'> <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'> <option value=''><data:title/></option> <b:loop values='data:data' var='i'> <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option> </b:loop> </select></b:includable> <b:includable id='posts' var='posts'> <ul class='posts'> <b:loop values='data:posts' var='post'> <li><a expr:href='data:post.url'><data:post.title/></a></li> </b:loop> </ul></b:includable> <b:includable id='toggle' var='interval'> <a class='toggle' href='javascript:void(0)'> <span expr:class='&quot;zippy&quot; + (data:interval.expclass == &quot;expanded&quot; ? &quot; toggle-open&quot; : &quot;&quot;)'> <b:if cond='data:interval.expclass == &quot;expanded&quot;'> &#9660;&#160; <b:elseif cond='data:blog.languageDirection == &quot;rtl&quot;'/> &#9668;&#160; <b:else/> &#9658;&#160; </b:if> </span> </a></b:includable> </b:widget> <b:widget id='Attribution1' locked='true' title='' type='Attribution'> <b:includable id='main'> <b:if cond='data:feedbackSurveyLink'> <div class='mobile-survey-link' style='text-align: center;'> <data:feedbackSurveyLink/> </div> </b:if>

<div class='widget-content' style='text-align: center;'> <b:if cond='data:attribution != &quot;&quot;'> <data:attribution/>

Page 44: HTML My Blog Tugas

</b:if> </div>

<b:include name='quickedit'/> </b:includable> </b:widget> <b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'> <b:includable id='main'>&lt;script type=&quot;text/javascript&quot;&gt; function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener(&#39;load&#39;, function(){ object[attribute] = val; }, false); } else { window.attachEvent(&#39;onload&#39;, function(){ object[attribute] = val; }); } } &lt;/script&gt;&lt;div id=&quot;navbar-iframe-container&quot;&gt;&lt;/div&gt;&lt;script type=&quot;text/javascript&quot; src=&quot;https://apis.google.com/js/plusone.js&quot;&gt;&lt;/script&gt;&lt;script type=&quot;text/javascript&quot;&gt; gapi.load(&quot;gapi.iframes:gapi.iframes.style.bubble&quot;, function() { if (gapi.iframes &amp;&amp; gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: &#39;https://www.blogger.com/navbar.g?targetBlogID\0751147365938233635770\46blogName\75Sampah-Rejeki\46publishMode\75PUBLISH_MODE_BLOGSPOT\46navbarType\75LIGHT\46layoutType\75LAYOUTS\46searchRoot\75//trade-edisional.blogspot.com/search\46blogLocale\75in\46v\0752\46homepageUrl\75http://trade-edisional.blogspot.com/\46vt\75-4081832668996589177&#39;, where: document.getElementById(&quot;navbar-iframe-container&quot;), id: &quot;navbar-iframe&quot; }); } }); &lt;/script&gt;&lt;script type=&quot;text/javascript&quot;&gt;(function() {var script = document.createElement(&#39;script&#39;);script.type = &#39;text/javascript&#39;;script.src = &#39;//pagead2.googlesyndication.com/pagead/js/google_top_exp.js&#39;;var head = document.getElementsByTagName(&#39;head&#39;)[0];if (head) {head.appendChild(script);}})();&lt;/script&gt;</b:includable> </b:widget> <b:widget id='Label2' locked='false' title='Labels' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> <b:if cond='data:display == &quot;list&quot;'> <ul>

Page 45: HTML My Blog Tugas

<b:loop values='data:labels' var='label'> <li> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span dir='ltr'>(<data:label.count/>)</span> </b:if> </li> </b:loop> </ul> <b:else/> <b:loop values='data:labels' var='label'> <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'> <b:if cond='data:blog.url == data:label.url'> <span expr:dir='data:blog.languageDirection'><data:label.name/></span> <b:else/> <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a> </b:if> <b:if cond='data:showFreqNumbers'> <span class='label-count' dir='ltr'>(<data:label.count/>)</span> </b:if> </span> </b:loop> </b:if> <b:include name='quickedit'/> </div></b:includable> </b:widget> </b:section> </aside>

</div>

</div> <!-- END CONTENT WRAPPER -->

<!-- =====SHOPPING CART PLUGIN CUSTOMIZATIONSIMPORTANT: INCL SEND ORDER PAGE URL AT HTML99 & EXPAND < b:includable id=main > TO ACTIVATE SEND ORDER MAIL FUNCTIONS.***IMPORTANT: CHANGE YOUR BLOG ADDRESS TO XXXXXXX.blogspot.com DUE TO REPORTED ISSUES FOR LOCALLY DOMAIN SERVED BY BLOGSPOT (IE: XXXXXX.blogspot.au)DEPENDING ON COUNTRIES WHERE IT IS APPLIED TO.***FOR HOSTED DOMAINS USE AS IS.====== -->

<b:section class='plugin group' id='plugin' showaddelement='no'> <b:widget id='HTML99' locked='true' title='DoNotRemove CartUseOnly' type='HTML'> <b:includable id='main'>

Page 46: HTML My Blog Tugas

<b:include name='cart-simpleCart'/> <b:include name='cart-currency-settings'/> <b:include name='cart-shipping-settings'/> <b:include name='cart-tax-settings'/>

<!-- SHOPPING CART CHECKOUT --> <!-- NO SPACES & FOLLOWS EXAMPLE BELOW WITH A .com BLOGSPOT DO

MAIN --> <b:if cond='data:blog.url == &quot;http://blogrcart-mukabuku.blogspot.com/p/send-order.html&quot;'> <b:include name='cart-email-settings'/> <b:else/> <b:include name='cart-paypal-settings'/> </b:if> <!-- IMAGE SLIDER --> <b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <b:include name='image-slider-js'/> </b:if> </b:if> <b:include name='add-on-js'/>

<div id='widget-content'> <data:content/></div>

</b:includable> <b:includable id='add-on-js'><script>//<![CDATA[$(function() {$("body").addClass("js"); var $menu = $("#menu"), $menulink = $(".menu-link"), $menuTrigger = $(".has-submenu > a"); $menulink.click(function(e) { e.preventDefault(); $menulink.toggleClass("active"); $menu.toggleClass("active") }); $menuTrigger.click(function(e) { e.preventDefault(); var t = $(this); t.toggleClass("active").next("ul").toggleClass("active") });$('.bg-parallax').each(function(){ var $obj = $(this); $(window).scroll(function() {var yPos = -($(window).scrollTop() / $obj.data('speed')); var bgpos = '50% '+ yPos + 'px'; $obj.css('background-position', bgpos );});});$('a[href*=#]:not([href=#])').click(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname){var target = $(this.hash); target = target.length ? target : $('[name=' + this.hash.slice(1) +']');if (target.length) { $('html,body').animate({ scrollTop: target.offset().top }, 800); return false; }}});});(function(doc, script) { var js,fjs=doc.getElementsByTagName(script)[0],add=function(url,id){if(doc.getElementById(id)){return}js=doc.createElement(script);js.src=url;id&&(js.id=id);fjs.parentNode.insertBefore(js,fjs)};add('//connect.facebook.net/en_US/sdk.js', 'facebook-jssdk');}(document,'script'));//]]></script>

<b:if cond='data:blog.pageType == &quot;item&quot;'><!-- IMAGE POP UP --><script src='//cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/0.9.9/jquery.magnific-popup.min.js' type='text/javascript'/><script>//<![CDATA[// BLOGGER DEFAULT COMMENT TEXT$(function() { $("h4#comment-post-message").text("Write A Review"); $('.post table').magnificPopup({ delegate: 'a', type: 'image', mainClass: 'mfp-fade' }); });//]]></script>

Page 47: HTML My Blog Tugas

</b:if>

<b:if cond='data:blog.pageType == &quot;index&quot;'><script>//<![CDATA[function showpageCount(json){var thisUrl=home_page_url;var htmlMap=new Array();var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='';var downPageHtml='';for(var i=0,post;post=json.feed.entry[i];i++){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(title!=''){if(itemCount==0||(itemCount%pageCount==(pageCount-1))){if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}if(title!='')postNum++;htmlMap[htmlMap.length]='/search?updated-max='+timestamp+'&max-results='+pageCount}}itemCount++}for(var p=0;p<htmlMap.length;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml='<span class="showpage"><a href="/#main">'+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'#main">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html+='<span class="showpageNum"><a href="/#main">1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'#main">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'#main">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){html=''+upPageHtml+' '+html+' '}html='<div class="showpageArea"><span style="color: #000;" class="showpageOf"><a href="/search?&max-results=16#main">VIEW ALL</a>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById(pagerId);if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}function showpageCount2(json){var thisUrl=home_page_url;var htmlMap=new Array();var isLablePage=thisUrl.indexOf("/search/label/")!=-1;var thisLable=isLablePage?thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length):"";thisLable=thisLable.indexOf("?")!=-1?thisLable.substr(0,thisLable.indexOf("?")):thisLable;var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='';var downPageHtml='';var labelHtml='<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'#main">';var thisUrl=home_page_url;for(var i=0,post;post=json.feed.entry[i];i++){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(title!=''){if(itemCount==0||(itemCount%pageCount==(pageCount-1))){if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}if(title!='')postNum++;htmlMap[htmlMap.length]='/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount}}itemCount++}for(var p=0;p<htmlMap.length;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml=labelHtml+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'#main">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html=labelHtml+'1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'#main">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'#main">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){if(!isLablePage){html=''+upPageHtml+' '+html+' '}else{html=''+upPageHtml+' '+html+' '}}html='<div class="showpageArea"><span style="color: #000;" class="showpageOf"><a href="/search/label/'+thisLable+'?&max-results=500#main">VIEW ALL</a>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById(pagerId);if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}var home_page_url=location.href;var thisUrl=home_page_url;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){var lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{var lblname1=thisUrl.substring(t

Page 48: HTML My Blog Tugas

hisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}}var home_page="/";if(thisUrl.indexOf("?q=")==-1){if(thisUrl.indexOf("/search/label/")==-1){document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')}}//]]></script></b:if></b:includable> <b:includable id='cart-currency-settings'><script>//<![CDATA[simpleCart.currency({//international country currency codecode: "IDR",//currency namename: "RUPIAH",//currency symbol symbol: "Rp",//dilimeterdelimiter: ",",//type of decimalsdecimal: ".",//symbol placed before/after integerafter: false,//accuracy of calculationsaccuracy: 2});// Uncomment/use for pre-built currencies in shopping cart// simpleCart.currency("PLN"); // current setting Polish Zloty//]]></script></b:includable> <b:includable id='cart-email-settings'><style>.view-cart-wrapper { display: none!important; }</style><script>//<![CDATA[// AUTO E-MAIL NOTIFIE BY http://blog.irsah.com. simpleCart({\:{type:"SendForm",url:"http://www.irsah.com/phpmail/checkout-02.php",method:"POST",// currency:"USD", // THE CURRENCY DISPLAYS @ EMAIL NOTIFIER CODE EQ TO CUSTOM CURRENCY ABOVE//extra_data:{first_name:document.getElementById("first_name").value,last_name:document.getElementById("last_name").value,email:document.getElementById("email").value,phone:document.getElementById("phone").value,address:document.getElementById("address").value,postcode:document.getElementById("postcode").value,comments:document.getElementById("comments").value}}}); simpleCart.bind( 'beforeCheckout' , function( data ){ data.first_name = document.getElementById("first_name").value;data.last_name = document.getElementById("last_name").value;data.email = document.getElementById("email").value;data.phone = document.getElementById("phone").value;data.address = document.getElementById("address").value;data.postcode = document.getElementById("postcode").value;data.comments = document.getElementById("comments").value;//// CUSTOMIZE URL/LINKS TO BLOG STORE PAGE// IN URL " http:// " IS NOT REQUIRED. FOLLOW FORMAT BELOWdata.shop_name = "YOUR-BLOG-STORE-NAME";

Page 49: HTML My Blog Tugas

data.shop_url = "blogrcart-mukabuku.blogspot.com"; data.shop_thankyou = "blogrcart-mukabuku.blogspot.com/p/success.html"; // REF:SUCCESS PAGE URLdata.shop_sendFail = "blogrcart-mukabuku.blogspot.com/p/error.html";// REF:ERROR PAGE URLdata.shop_email = "[email protected]"; // BLOG STORE EMAIL//// data.shop_currency = "USD"; // CURRENCY DISPLAY AT EMAIL// INCL "None" (w/o quotes) 1 OR MORE LINES WILL NOT DISPLAY AT THIS SECTION EMAIL BODY//data.shop_bizname = "YOUR-BIZ-NAME"; data.shop_bizaddress = "68000 Kuala Lumpur, Malaysia"; data.shop_bizphone1 = "017-123 4567"; data.shop_bizphone2 = "None"; data.shop_bizphone3 = "None";//// CUSTOMIZE BLOG STORE BANKING PREFERENCE. LEAVE " - " (dash) IF NOT REQUIRED// DO NOT INCL CREDIT/CHARGE CARD NUMBERS HERE!// INCL "None" (w/o quotes) 1 OR MORE LINES WILL NOT DISPLAY AT THIS SECTION EMAIL BODYdata.bank1 = "MyBank"; data.bank1_acc_no = "1234 5678 99"; data.bank1_acc_name = "Irsah inDesigns";data.bank2 = "None"; data.bank2_acc_no = "None"; data.bank2_acc_name = "None"; data.bank3 = "None"; data.bank3_acc_no = "None"; data.bank3_acc_name = "None";//// CUSTOMIZE BLOG STORE BANKING PREFERNECE. LEAVE " - " (dash) IF NOT REQUIRED// ADDITONAL NOTES TO INCL IN THIS SECTION E-MAIL BODY// INCL "None" (w/o quotes) 1 OR MORE LINES WILL NOT DISPLAY AT THIS SECTION EMAIL BODY//data.note1 = "More notes you can send to your customer here."; data.note_detail1 = "Additional notes or links for your customers here."; data.note2 = "None"; data.note_detail2 = "None";//});//]]></script></b:includable> <b:includable id='cart-paypal-settings'><script>//<![CDATA[simpleCart({ checkout: { type: "PayPal", email: "[email protected]", //REGISTERED EMAIL WITH PAYPAL REQUIRED sandbox: false, success: "http://blogrcart-mukabuku.blogspot.com/p/success.html", //FULL URLL TO SUCCESS PAGE cancel: "http://blogrcart-mukabuku.blogspot.com/p/error.html" //FULL URLL TO ERROR PAGE }

Page 50: HTML My Blog Tugas

});//]]></script></b:includable> <b:includable id='cart-shipping-settings'><script>//<![CDATA[// 1 SHIPPING SETTING IS REQUIREDsimpleCart({ shippingQuantityRate: 5 //UNCOMMENT FOR QUANTITY RATE SHIPPING CHARGES //shippingFlatRate: 10 //UNCOMMENT FOR FLAT RATE SHIPPING CHARGES //shippingTotalRate: 0.1 //UNCOMMENT FOR % SHIPPING CHARGES IN PERCENTAGE });//]]></script></b:includable> <b:includable id='cart-simpleCart'><!-- SHOPPING CART PLUG-IN --><script src='//cdnjs.cloudflare.com/ajax/libs/simplecartjs/3.0.5/simplecart.min.js' type='text/javascript'/><!-- SHOPPING CART GENERAL SETTINGS --><script>//<![CDATA[$(function() {simpleCart({cartColumns:[{attr:"thumbimg",label:false,view:"image"},{attr:"name",label:"Item"},{attr:"price",label:"Price",view:"currency"},{view:"decrement",label:false,text:"-"},{attr:"quantity",label:"Qty",view:"input"},{view:"increment",label:false,text:"+"},{attr:"total",label:"Total",view:"currency"},{view:"remove",text:"X",label:false}], cartStyle:"table", excludeFromCheckout:["thumbimg","description","details","pagelink"]}); $('#cart-detail,.close').click(function(e){ e.preventDefault(); $('.cart-details').slideToggle('medium','swing'); });});//]]></script></b:includable> <b:includable id='cart-tax-settings'><script>//<![CDATA[simpleCart({ taxRate: 0.05 });// PERCENTAGE OF TOTALS DEFAULT VALUE 5/100 = 5% = 0.05//]]></script></b:includable> <b:includable id='image-slider-js'><script src='//cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.3.6/slick.min.js' type='text/javascript'/><script>//<![CDATA[$(function(){ $('.blogrcart-carousel').slick({ centerMode: true, centerPadding: '0px', autoplay: true, dots: false, infinite: true, speed: 400, slidesToShow: 3, slidesToScroll: 3, responsive: [{ breakpoint: 1024, settings: { slidesToShow: 3, slidesToScroll: 3, infinite: true, dots: true } }, { breakpoint: 800, settings: { slidesToShow: 3, slidesToScroll: 3 } }, { breakpoint: 480, settings: { slidesToShow: 1, slidesToScroll: 1 } } ]});});//]]></script></b:includable> </b:widget>

Page 51: HTML My Blog Tugas

</b:section>

<!-- =====SEND ORDER E-MAIL PLUG-IN MIGHT NOT WORK/FAULTY IF BELOW IS MODIFIED/TEMPERED.TO REMOVE/MODIFY, SEND REQUEST AT http://www.irsah.com/about#contactUs===== -->

<div class='credit'> <div class='inner-wrapper'>

<p class='credits group'>&#169; <script>document.write(new Date().getFullYear())</script> E-commerce Blogger powered by <a expr:href='data:blog.homepageUrl'><span class='footer-title'><data:blog.title/></span></a>.<br/><small>Designed by <a href='http://www.irsah.com' target='_blank'><b>Irsah inDesigns</b></a></small><br/><br/><b><a href='#cart-wrapper' id='backtotop' title='Back To Top'>Back To Top</a></b> </p>

</div> </div></body></html>