إنضم لنا

Membuat layanan download aplikasi





Cara membuat layanan download aplikasi

Pada kesempatan kali ini saya akan membagikan tutorial cara membuat layanan download aplikasi untuk demonya kalian bisa lihat di bawah
Klik untuk melihat demo



Sekilas ini mirip kaya punya jalan tikus dari segi desain tapi, walaupun kelihatan nya mirip tpi ini berbeda knpa berbeda karna yang buat nya pun berbeda, maksud saya begini layanan download yang ingin saya search di sini itu, sudah banyak di gunakan di situs situs luar negri jadi saya ga tau mana yang menjiplak kalo saya hanya membagikan saja

Gimanah kalian tertarik
Jika kalian ingin mencoba silahkan ikuti cara memasangnya di bawah

Silahkan kalian pasang css di bawah tepat di atas code ]]></b:skin>
/* Put this css in your blog - pambahprojectcss-ZViewPH */

.card {
  background: #fff;
  border-radius: 1px;
  display: inline-block;
  height: 100%;
  margin: 1.0rem;
  padding: 0.0rem;
  position: relative;
  width: 90%;
}

.card-1 {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.card-1:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
.ZViewPH-pambah-box-corporation{margin: 0;padding: 0;border: 0;font: inherit;vertical-align: baseline;-webkit-tap-highlight-color: transparent;font-family: 'Roboto',Segoe UI,Segoe,Arial,Verdana,sans-serif;}
.ZViewPH-pambah-box-corporation > .item {display: block;float: left;position: relative;width: 100%;margin-bottom: -0px;background: #fff;}
.addon-apps {margin-bottom: 61px;padding: 1px 0;}
.addon-apps .apps-detail a {border-bottom: 1px solid transparent;}
.addon-apps .apps-detail a:hover {border-bottom: 1px solid #999999;}
.addon-apps .apps-detail.horizontal.xlSz {border: 0;padding: 15px 20px;}
.addon-apps .apps-detail.horizontal.xlSz .property {max-height: none;margin: 0;}
.addon-apps .apps-detail.horizontal.xlSz .info-container {padding: 0 15px;margin: 0;}
.addon-apps .apps-detail .note a, .addon-apps .apps-detail .note span {vertical-align: middle;}
.addon-apps .item {overflow: hidden;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.addon-discover {position: absolute;bottom: 0;right: 0;padding: 2px 10px;background: #f8f8f8;line-height: 0;border-top: 1px solid #dddddd;border-left: 1px solid #dddddd;-webkit-border-top-left-radius: 4px;-moz-border-radius-topleft: 4px;border-top-left-radius: 4px;}
.apps-detail.horizontal.xlSz {padding: 1.5%;}
.apps-detail.horizontal .os-icon {margin-right: 6px;}
.apps-detail.horizontal {display: block;align-items: center;}
.apps-detail.horizontal.xlSz .property {margin: 5px 0 10px 0;}
.apps-detail.horizontal.xlSz .action-btn:last-of-type {margin-bottom: 0;}
.apps-detail.horizontal.xlSz .action-btn {width: 100%;margin-bottom: 5px;}
.apps-detail.horizontal {position: relative;width: 100%;}
.apps-detail.horizontal.xlSz .info-container {margin: 2px 0 0 0;padding: 0 1.5%;}
.apps-detail.horizontal.xlSz .action-container {margin-bottom: 15px;padding: 5px 0;float: right;padding-right: 75px;}
.apps-detail {float: left;border: 1px solid rgba(255,255,255,0);-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.trs, .trs:before, .trs:after {-webkit-transition: all 0.15s ease-in-out;-moz-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;}
.apps-detail.horizontal .cover-container, .apps-detail.horizontal .info-container, .apps-detail.horizontal .action-container {position: relative;float: left;vertical-align: top;}
.title-text.dllight {font-size: 16px;}
.title-text.lSz {font-size: 16px;line-height: 25px;}
.title-text {font-size: 14px;line-height: 20px;font-weight: 500;}
.text-link {border-bottom: 1px solid rgba(255,255,255,0);color: grey;}
.cover {position: relative;overflow: hidden;}
.btn.bdrs4 {-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.btn.clearBlue {background-color: #008efa;border: 1px solid rgba(0,0,0,0);color: #ffffff;}
.btn.clearGreen {background-color: #6ab344;border: 1px solid rgba(0,0,0,0);color: #ffffff;}
.btn.dllight {height: 40px;line-height: 38px;padding:0  12px;font-size: 15px;}
.btn {display: inline-block;overflow: hidden;vertical-align: middle;padding: 0 10px;border: 1px solid #eeeeee;background: #ffffff;color: #008efa;text-align: center;cursor: pointer;}
.trs, .trs:before, .trs:after {-webkit-transition: all 0.15s ease-in-out;-moz-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;}
a {text-decoration: none;}
.text-link.cl1 {color: #252525;}
.fs2 {font-family: 'Roboto',Segoe UI,Segoe,Arial,Verdana,sans-serif;}
.multi-ellipsis {overflow: hidden;position: relative;}
.text-ellipsis {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.content-format a:hover {border-bottom: 1px solid #008efa;}
.content-format .note a:hover {border-bottom: 1px solid grey;}
.content-format a {color: grey;border-bottom: 1px solid rgba(255,255,255,0);}
.content-format a, .content-format a:before, .content-format a:after {-webkit-transition: all 0.15s ease-in-out;-moz-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;} 
/* -ZViewPH - Frame Box Review and Download - CSS+HTML #1 - pambahprojectcss */
.os-icon {overflow: hidden;display: inline-block;vertical-align: middle;width: 25px;height: 25px;background-image: url(https://rawgit.com/palmahutabarat/ZViewPH/master/apps-zviewph.png);background-repeat: no-repeat;background-size: 100%;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.os-style.android {background-color: #2cd637;background-position: 0 0;}

Dan disimpa ini di atas code </body>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/css/materialize.min.css">

Kemudian kalian pasang html dibawah ini di saat kalian ingin membuat artikel
<div class="card">
  <div class="card1">
<div class="ZViewPH-pambah-box-corporation cf addon-apps" style="margin: 5px 0;">
<div class="item cf">
<div class="apps-detail horizontal xlSz cf trs">
<div class="cover-container"><div class="cover-image-container">
<img src="https://3.bp.blogspot.com/-EOBU8w6KnPk/WljEzzfkZgI/AAAAAAAAB3g/nJWZ-ORwk0IASu8JnWlMS6H4WhRhSCcMACLcBGAs/s1600/1515753012709.png" height="80" wight="80" alt="#"/>
</div>
</div>
<div class="info-container">
<div class="info">
<a href="#" class="title text-link-container">
<span class="title-text fs2 lSz text-link cl1 trs">Cenggini sarang</span>
<span class="title-text fs2 lSz fwL text-link cl4 bdrB0"> v1.2.0.4 Build</span></a>
<div class="property multi-ellipsis ellipsis-fade text-ellipsis">
<div class="content-format">
<span class="note"><a href="#" class="os-style os-icon android trs" title="Android Apps"></a>
<a href="#" class="text-link cl4 trs hidden-sm hidden-480 hidden-xs">Horror</a>, <a href="#" class="text-link cl4 trs hidden-sm hidden-480 hidden-xs">FPS</a>, <a href="#" class="text-link cl4 trs hidden-sm hidden-480 hidden-xs">Shooter</a>
<span class="hidden-sm hidden-480 hidden-xs" style='color:black'> by </span>
<a href="http://www.webcensar.com" target="_blank" class="text-link cl4 trs" rel="nofollow">webcensar</a></span></div>
</div>
</div>
</div>
<div class="action-container">
<div class="action">
<a href="#" target="_blank"  class="action-btn download-btn btn dllight clearBlue bdrs4 title-text trs track-download"><i class="fa fa-download" aria-hidden="true"></i> Apps Windows x86</a>
<a href="#" target="_blank"  class="action-btn googleplay-btn btn dllight clearGreen bdrs4 title-text trs track-relink"><i class="fa fa-android" aria-hidden="true"></i> Apps Windows x64</a>
</div>
</div>
</div>

Selanjutnya kalian sesuaikan sendiri saat membuat artikel

Itu saja semoga bermanfaat
Sumber content:pambahcorporation.xyz
Penulis:

Seorang Penulis Asal Tegal jawa tengah 


PENTING !!!
Untuk pertanyaan di luar topik silahkan Gunakan Komentar Facebook atau Google+ sengaja Kami sediakan Untuk komentar random Dan untuk pertanyaan seputar article gunakan komentar disqus Terimakasih...

Disqus

Disqus comments:


Google+

Google+ comments:

Facebook

Facebook comments:

This site uses cookies from Google to deliver its services, to personalise ads and to analyse traffic. Information about your use of this site is shared with Google. By using this site, you agree to its use of cookies. Detail