Memasang kode Portfolio Page
Login ke akun blog klik tombol blog baru, buat satubuah link baru
kemudian beri nama sesuai fungsi, klik Edit HTML pada link baru tersebut,
hapus semua kode template, ganti dengan kode blank template, yang tersedia pada sumber berikut ini : Blank Template edit background warna sesuai keinginan dan klik simpan selesai
Login ke akun blog klik tombol blog baru, buat satubuah link baru
kemudian beri nama sesuai fungsi, klik Edit HTML pada link baru tersebut,
hapus semua kode template, ganti dengan kode blank template, yang tersedia pada sumber berikut ini : Blank Template edit background warna sesuai keinginan dan klik simpan selesai
Kemudian klik entri halaman baru HTML pada link tersebut
copy kode dibawah ini, pastekan kedalam halaman baru tersebut dan klik simpan selesai
copy kode dibawah ini, pastekan kedalam halaman baru tersebut dan klik simpan selesai
<link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css'>
<link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'>
<text Graduate>
<link href='https://fonts.googleapis.com/css?family=Graduate|Cabin' rel='stylesheet' type='text/css'>
<script src="https://use.fontawesome.com/db9e397ee1.js"></script>
<style class="M2010-styles">
body {
font-size:100%;
}
h1 {
font-family:graduate;
}
p {
font-family:cabin;
}
/*Navigation*/
.nav a{
color:#fff;
text-shadow: 3px 3px 6px #222;
}
.navbar{
background-color:#868;
border-radius: 0;
margin-bottom: 0;
box-shadow: 0px 3px 3px 0px #6a660b;
}
.navbar-brand{
line-height: 15px;
padding: 12px;
color: #fff;
font-weight: 600;
text-shadow: 1px 1px 5px #444;
transition: all 0.3s;
}
.nav>li{
display: inline-block;
}
.nav>li>a:focus, .nav>li>a:hover, nav li.active a{
background-color: #dad;
color: #fff;
}
.navbar {
background-color: #F3E9E0;
border: none;
}
.navbar-default .navbar-nav>li>a {
color: #e2c044;
font-size: 1.25em;
font-family: graduate;
}
.title {
padding-top: 25px;
padding-bottom: 25px;
}
.top {
padding-top: 100px;
background-color: #393E41;
min-height: 500px;
color: #e2c044;
text-align: center;
padding-bottom: 100px;
font-family:graduate;
}
.top H1 {
font-size: 7em;
}
.aboutme {
background-color: #e2c044;
min-height: 350px;
color: #393e41;
text-align: center;
}
.aboutme p {
font-size: 1.75em;
}
.portfolio {
background-color: #fffcf9;
text-align: center;
color: #393e41;
padding-bottom: 50px;
margin-right:0;
margin-left:0;
}
.thumbimg {
max-height: 180px;
}
.thumbnail {
text-align: center;
border: none;
padding-top:2.5em;
background-color: #fffcf9;
color: #393e41;
border: 2px solid #e2c044;
}
.caption p {
font-size: 1.5em;
font-family: cabin;
}
.caption h3 {
font-family: graduate;
font-size:2em;
}
.contact {
background-color: #407899;
padding-bottom: 100px;
color: #FFFCF9;
text-align: center;
}
/* COOL NAME EFFECT */
a:hover,a:focus{text-decoration:none;}
.svg-wrapper {
position: relative;
top: 35%;
transform: translateY(-50%);
margin: 0 auto;
width: 320px;
max-height:60px;
cursor:default;
}
.shape {
stroke-dasharray: 140 540;
stroke-dashoffset: -474;
stroke-width: 10px;
fill: transparent;
stroke: #FF5733;
border-bottom: 5px solid yellow;
transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
}
.text {
font-family: vivaldi;
font-size: 30px;
line-height: 32px;
letter-spacing: 8px;
color: #fff;
top: -48px;
position: relative;
text-align:center;
}
.text2 {
font-family: agency fb;
font-size: 30px;
line-height: 32px;
letter-spacing:2px;
color: #dad;
top: -48px;
position: relative;
text-align:center;
}
.svg-wrapper:hover .shape {
stroke-width: 2px;
stroke-dashoffset: 0;
stroke-dasharray: 760;
}
.carousel-control.left
{
background: none;
}
.carousel-control.right
{
background: none;
}
.carousel-control
{
position: absolute;
top: 45%;
bottom: 0;
left: 0;
width: 15%;
font-size: auto;
color: #fff;
text-align: center;
opacity: 1;
text-shadow: none;
}
.carousel-control:hover
{
color: #000;
}
.carousel-indicators
{
bottom: -50px;
}
.carousel-indicators li
{
display: inline-block;
width: 10px;
height: 10px;
margin: 1px;
text-indent: -999px;
cursor: pointer;
background-color: #000\9;
background-color: rgba(0,0,0,0);
border: 1px solid #16a085;
border-radius: 50%;
}
.carousel-indicators .active
{
width: 12px;
height: 12px;
margin: 0;
background-color: #16a085;
}
.carousel-caption
{
position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 10;
padding-top: 20px;
padding-bottom: 20px;
color: #fff;
text-align: center;
background: rgba(0,0,0,0.4);
}
footer {
background-color: #F3E9E0;
height:40px;
widt:100%;
}
footer p {
margin: 0;
padding: 10px;
text-align: center;
color: #993A33;
font-style: italic;
}
</style>
<nav class="navbar navbar-fixed-top">
<div class="container">
<div class="navbar-header pull-left">
<a rel="nofollow" rel="noreferrer"class="navbar-brand text-center scroll-top"href="https://Link Judul"title="Get Code"> M2010 <br> <small> a Developer</small></a>
</div>
<div class="pull-right">
<ul class="nav navbar-nav navbar-right pull-right">
<li><a rel="nofollow" rel="noreferrer"href="https://Link Download"title="Get Code">
<i class="fa fa-download fa-2x"></i></a></li>
<li><a rel="nofollow" rel="noreferrer"href="mailto:myscript2010s@gmail.com"target="_blank"title="Let's Share">
<i class="fa fa-envelope fa-2x"></i></a></li>
<li><a class="navbar-brand" href="http://sule-parallax.blogspot.co.id/2017/04/don-williams-i-would-like-to-see-you.html"target="_blank"title="My Music">
<i class="fa fa-music fa-1x"></i></a></li>
<li><a class="navbar-brand" href="http://sule-tema.blogspot.co.id/2017/06/ada-apa-dengan-web.html"target="_blank"title="Behind the future">
<i class="fa fa-user-md fa-1x"></i></a></li>
<li><a class="navbar-brand" href="http://sule-hiburan.blogspot.co.id/2017/04/connie-cover.html"target="_blank"title="Music Cover">
<i class="fa fa-headphones fa-1x"></i></a></li>
</ul>
</div>
</div>
</nav>
<div align="center">
<h1>THIS IS A PORTFOLIO</h1>
<h3>Website design knowledge sharing for everyone</h3>
</div>
</div>
<!-- Start portfolio Section -->
<a class="anchor" id="portfolio-link"></a>
<div id="portfolio" class="container-fluid">
<div class="row">
<div class="col-lg-12 text-center">
<h1></h1>
<div class="container">
<div class="row">
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmdvRUVUHuGQObfTx-RL_t4A-7izjvaKJqRgua4A1kz850DB9uOxr_pArEYMqLjgobj80lUYe3iDdd5LDaMPBRJHb-qGbscWXmcpp4d29zOxRIhiDlk5hzAx0RknWmm_vA-x9zf-Bbr0sp/s1600/Laptop1a-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5xUA9YXoPkrLKFIkTrPHZDCCcaU3nQHHALOxAVvhvy35I3lnzIUg6pTN7VnZQWV2dUzjJx3bOec9KAL0vNFkVaUpIOfdxZWSZbE5tCruPzUlcPkwv9Gr6zM-gYkJ6CaG6BAQV6oWT8cfD/s1600/Laptop1b-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzOr_6bLtCZIPEnF3sXFJaLcuEhOh_7-RrTfbB13bLBr5tJYkRBowMOUiaLpiKWytYNPaomdEP8vyGxxdzFJqR4O8T2rWnwpqiS75uEN-u1YWY1G9Rou-QghTzBGPYavc_twzH5YQCjsUI/s1600/Laptop1c-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<!-- Menu 2 -->
<div class="row">
<div class="container">
<div class="row">
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1bffrNVroliCS-1D3tYK5wi_0xppbPD97boeiDz49U6D7eAq7zFQhhsYZnlKlijKeXPiPegaksXbatyrkaXVPN4NmHZOAF-VMPc14E0X9jK25_hRI36c4KxJoGA1Oskomd2hZCp94jYb8/s1600/Laptop1d-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilc3ulTd98M2DoPJNHRFo_ZWMI-2k00VGe-YOG6fIbj3gNyrHR1T8cT4c7EWgKdkgP70KPbO1DrMdEZtmWdshuI8Vv6XXp0vBL4QPiRjDAT5s62t9PavUWXnJdSfNjmQ3u2v9ZAKFpA36K/s1600/Laptop1e-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaftVFtt5QgJ-1T4iOY-ZHdr-0X7vl3d1Hzn2ssF23FpQsuMNWtXmdILsgToGHjV2eGiPmRFDdv-clixX6XGHtasl-fs3xmkFUtP82eecnCcxgd3IKi5RzperYyDKtBaWyyB_qm3Abu9QN/s1600/Laptop1f-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="row">
</div>
<!-- myCarouse -->
<div class="container">
<!-- Indicators -->
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides --><br>
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh6jzij8On6tQA18Zd-ah8r6vfS0djTQ4OW-7XUNzg9aTRaOqB1krv2cAXeyn0UBYCYXckfiun9coQWyqnpEQASf04SZ3i9Tf2h2s5c9HfshO9HecyawzdAc5-nHaTYEfHq1058Zlz_xVM/s1600/D1-M2010.jpg" alt="Chania">
<div class="carousel-caption">
<h3>SEO </h3>
<p>seo search engine optimization </p>
</div>
</div>
<div class="item">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMFVZZigWe-HeIgCBaUkULNYp6vjWVH7hwidtsv8Fy2fktoqOMYekaWYYNyb9H7ak_Yv1AGY_dS0KO59x99OGiJwaBKSAN0qcQQ-O5YUVkNlICkUAueiItGT4QZ3sAB2NsikgIU8s2ErZ7/s1600/D3-M2010s.jpg" alt="M2010">
<div class="carousel-caption">
<h3>SEO</h3>
<p>Seo Get Started</p>
</div>
</div>
<div class="item">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ5dYQVdgXK9NBqjB9NdHohZc4Di0aanN_ulZGIgFz-dFZEhPwBK8Yh-xHRKosQhBb9zMo2XorxgSb5IgbjWdrkLPp-pnSYc0RwJ3ZkSxPGndH7uyNL_qElVS9ocCTlGnGd9whFUC2rNTG/s1600/D5-M2010.png" alt="M2010">
<div class="carousel-caption">
<h3>SEO </h3>
<p>Seo Social Media</p>
</div>
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="fa fa-angle-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="fa fa-angle-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
</div>
<!-- Menu 3 -->
<div class="row">
<div class="container">
<div class="row">
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCguq4uJ43adv_uPNKQFDcZoC2NyC1xzwSiJgfSbgHvu6fA0DStSKXfrT7Jf92wyHLOEbqU3Lqis4-TgVwxcv_b71Ej4mavc2apUO_F8xNJLe2VJe_CeW6BvsJ71Q9iytmgrJL0BWUwfep/s1600/Laptop2a-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqIqqmJYNZHxEZ5zKhaWF-_wDsiy_987IR4lJJ6a8KLZzV_snfH10CYfaec6jUaM9zrlKf2hR1qoVmoN8IK_YG50PzyejNzWoJvJNfwSKQ-CCYq938VbhLX7jq31duuGmt_POKqgwiyT8U/s1600/Laptop2b-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="thumbnail">
<a href="#" target="_blank">
<div class="thumbnail-hover text-center">
<i class="fa fa-eye fa-3x"></i>
</div>
<img class="img-responsive" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgioxGvKWFMVhArhhD-fRTARAw_G6yStNEIJFxnXI9JWYXzoNu_8bAePDtAqrv_S-KVoQem6M7BRsqeU9ZjpsdclMuTQ1UHfOCKTlRwz2npxMsMNUmMpO9NcVhnmusicbf6mVItW3vT9Xt_/s1600/Laptop2c-M2010.jpg">
</a>
<div class="caption">
<h3>Your Content</h3>
<p>Teks anda disini Teks anda disini Teks anda disini</p>
</div>
</div>
</div>
<div class="row">
</div>
<!-- Map Google -->
<div class="wrapper clearfix">
<div class="container">
<div class="section-mask">
</div>
<div class="contact-head-wrapper">
<div class="text-center img-sec">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3960.9632376809222!2d107.51730141509522!3d-6.895000795017736!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e68e5044118a5e1%3A0x644036447f9cf5a4!2sJl.+Raya+Cibeber%2C+Cibeber%2C+Cimahi+Sel.%2C+Kota+Cimahi%2C+Jawa+Barat+40531%2C+Indonesia!5e0!3m2!1sen!2sus!4v1500997183140" width="100%" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div>
</div>
<!-- Footer -->
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<!-- Services Section -->
<section id="services">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h1 class="title">Source tutorial</h3>
</div>
</div>
<div class="row text-center">
<div class="col-md-4">
<i class="fa fa-external-link"style="font-size:35px;color:#808"></i>
</span>
<h4 class="service-heading">
<input type="checkbox" name="vehicle" value="Car" checked="checked"> W3school</h4>
<h5>W3.CSS A modern CSS framework<br> for faster and better responsive web sites</p>
</div>
<div class="col-md-4">
<i class="fa fa-external-link"style="font-size:35px;color:#808"></i>
</span>
<h4 class="service-heading">
<input type="checkbox" name="vehicle" value="Car" checked="checked"> Bootstrap</h4>
<h5> is a marketplace for premium <br> Bootstrap themes and templates</p>
</div>
<div class="col-md-4">
<i class="fa fa-chain"style="font-size:35px;color:#808"></i>
</span>
<h4 class="service-heading">
<input type="checkbox" name="vehicle" value="Car" checked="checked"> Crative Idea</h4>
<h5>Let's learn to design weblogs <br> By looking at tutors from all sources</p>
</div>
</div>
</div>
</div>
</section>
<!-- Footer end -->
<div class="row portfolio" id="port">
<div>
<h1 class="title">Start from scratch with source</h1>
</div>
<div class="row">
<div class="col-sm-4 col-md-2 col-md-offset-1">
<div class="thumbnail">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYWz26oLXQnzdUrdnw_MXQ_pjl_BSrghXF9wiGImlFNtXSN0u6rsKbJnE1FMpqzwUGDYJMwIIXb6xI3MERPSqiM4rWb8sffZSNJlYpew8rM1N83YH4Z6R7tkU4MQw2lCsWCw-q9wL5BDJ4/s1600/W3school-M2010.png" alt="Screenshot of Tribute Page" class="thumbimg">
<div class="caption">
<h3>W3SCHOOL</h3>
<p>Tutorials : CSS HTML Javascript Reference <br> The sizes attribute specifies<br>
the sizes of icons for visual media.</p>
<a href="https://www.w3schools.com/default.asp" class="btn btn-success" role="button"target="_blank"title="W3school">Click to View</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-2">
<div class="thumbnail">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh76kmsuCU_g69HAZ3-v3fbpjo4MSldNdDnPG1YfL7KS8j1SWPReJ-9gGYJuQjGqeDeP328NVUGdlnhsgkKjPu4k8lGNCSXfG-sfKQt-w3H7bA6Bpy4hnvg-GAgE9bidTWleTZy2ykdV6UC/s1600/Bootstrap-M2010.png" alt="Image of Speech Bubble" class="thumbimg">
<div class="caption">
<h3>Bootstrap</h3>
<p>The Bootstrap Blog
News and announcements for all things Bootstrap, including new releases, Bootstrap Themes, and Bootstrap Jobs. </p>
<p><a href="http://blog.getbootstrap.com/2017/01/06/bootstrap-4-alpha-6/" class="btn btn-success" role="button"target="_blank"title="Bootstrap">Click to View</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-2">
<div class="thumbnail">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDBQH6rihu7jg86cwPgBeeJm0dy-p2huEHzvUZMxAjYMo0Y7DflCOt3bSY_eikeApWA3tYL2oxVvCVgYEwXwgdRpbwIXM66bB_cWQWGZDOn0oPX9OSg1OPZeK_I78ZuxQJ5m8MHEgJIVS8/s1600/W3C.png" alt="Image of Speech Bubble" class="thumbimg">
<div class="caption">
<h3>W3C Validator</h3>
<p>This validator checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc. Validate by URI
Validate a document online: </p>
<a href="https://validator.w3.org/" class="btn btn-success" role="button"target="_blank"title="W3C">Click to View</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-2">
<div class="thumbnail">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjq_1ql6tD5WstSGySYKL0kQ2PMBUgtYxn-7rgd1VQuBteJqRRkzexHe6GYDW2tOAAEv7fIzV_YoJvoJ-vbheZqQSsgJ5TYnQUWGD-gXl5-n5rrBmzYb74UG8uJfzRnrAQrBlkuN0voVTnj/s1600/Wrapbootstrap-M2010.png" alt="Image of Speech Bubble" class="thumbimg">
<div class="caption">
<h3>Bootstrap</h3>
<p>Bootstrap is an HTML & CSS framework designed to help you kickstart the development of webapps and sites. Wrap Bootstrap rock-solid foundation.</p>
<a href="https://wrapbootstrap.com/" class="btn btn-success" role="button"target="_blank"title="WrapBootstrap">Click to View</a></p>
</div>
</div>
</div>
<div class="col-sm-4 col-md-2">
<div class="thumbnail">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0MokFxWZoxDYVHqeRuGbP__Yff8V1srGVUgAWYEQXq4BUvR-UP_DUIGuCksTeSJpzJjJwGehbcLuAkR6K4D9k0LbRq2Cs5pP30_TkuEhMdmS-UQEdKVDH3Wef-TBNS14QmBSEqccGfD9e/s1600/M2010-M2010.png" alt="Screenshot of Tribute Page" class="thumbimg">
<div class="caption">
<h3>M2010</h3>
<p>A person who is learning how to develop the web properly and correctly<br>Through Tutorials From several sources</p>
<a href="http://Link Judul" class="btn btn-success" role="button"target="_blank"title="Myscript2010">Click to View</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<footer>
<h5><br>Copyright 2017 Cibeber Cimahi</p>
</footer>
<script src='//production-assets.codepen.io/assets/common/stopExecutionOnTimeout-b2a7b3fe212eaa732349046d8416e00a9dec26eb7fd347590fbced3ab38af52e.js'> </script> <script src='https://code.jquery.com/jquery-2.2.4.min.js'> </script> <script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js'> </script>
<script>
var row=$('.portfolio');
$.each(row, function() {
var maxh=0;
$.each($(this).find('div[class^="col-"]'), function() {
if($(this).height() > maxh)
maxh=$(this).height();
});
$.each($(this).find('div[class^="col-"]'), function() {
$(this).height(maxh);
});
});
</script>
* If you want to directly copy and paste you canDownload Portfolio Page
