Top Banner
<?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.
51

HTML My Blog Tugas

Jul 12, 2016

Download

Documents

Wahyu Andika

html
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
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>