Documentation Template MiniMaxSavage

Documentation Template MiniMaxSavage . Template ini terbaru yang berunsur Material Design, ygan mengikuti sedikit gaya Template  STRESSTHINKING dengan template MiniMaxSavage premium , template ini mempunyai tampilan posting horizontal atau persegi panjang.
Template ini tidak mempunyai info Style desing  syasengaja tidak memasng nya karena kebanyakan para sobat blogger tidak setuju pabila di beri info Style desing

Ok. Langsung saja  di bahas Documentation Template MiniMaxSavage

1 . Setelan Blog






2 . Widget Contact Form

Tambahkan kode di bawah ini di dalam postingan statis blog

<div id="profile-card">
<img border="0" data-original-height="960" data-original-width="958" height="220" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoL8inuz61TksZ8Ghglc0x6XLYsW0vxjwFuinzwQf92TgFG2YjVopLVA2IY6YA3NiebWlEVAzlhe96kRhZVuygar-uqoMzl_nDKmpJtWoouygL8p_6qUmD5i5ixTh8hwIyHCrkdcDmgNY/s1600/wiendy+11.jpg" width="219" />
<h4>Wiendhy Wiana</h4>
<br />
<div class='desc'>Redesign Template. like cloning templates and Founder STRESSTHINKING</div>
<div class='work'><a href="mailto:Wiendhywin@gmail.com" target="_blank"><svg viewbox="0 0 24 24">
<path d="M20,8L12,13L4,8V6L12,11L20,6M20,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V6C22,4.89 21.1,4 20,4Z"></path>
</svg> Wiendhywin@gmail.com</a></div>
<div class='location'><a href="http://m.me/Nadia-Nadia" target="_blank"><svg viewbox="0 0 24 24">
<path d="M12,2C6.5,2 2,6.14 2,11.25C2,14.13 3.42,16.7 5.65,18.4L5.71,22L9.16,20.12L9.13,20.11C10.04,20.36 11,20.5 12,20.5C17.5,20.5 22,16.36 22,11.25C22,6.14 17.5,2 12,2M13.03,14.41L10.54,11.78L5.5,14.41L10.88,8.78L13.46,11.25L18.31,8.78L13.03,14.41Z" fill="#000000"></path>
</svg> http://m.me/Nadia-Nadia</a></div>
</div>
Silakan pilih kontak di bawah ini untuk menghubungi admin STRESSTHINKING. Jika tidak ada halangan dan kesibukan lainnya, admin akan langsung merespon pesan yang Anda kirimkan.
<br />
<form name="contact-form">
<div class="datainput">
<input class="validate" id="ContactForm1_contact-form-name" name="name" required="" type="text" value="" />
<span class="highlight"></span>
<span class="bar"></span>
<label>Name</label>
</div>
<div class="datainput">
<input class="validate" id="ContactForm1_contact-form-email" name="email" required="" type="email" value="" />
<span class="highlight"></span>
<span class="bar"></span>
<label>Email</label>
</div>
<div class="datainput">
<textarea class="validate" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" required="" rows="5"></textarea>
<span class="highlight"></span>
<span class="bar"></span>
<label>Message</label>
</div>
<input id="ContactForm1_contact-form-submit" type="button" value="Send" />
<br />
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</form>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '5380204764168476747';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x5380204764168476747','//minimaxsavage.blogspot.com/','5380204764168476747');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': '<span style="padding:5px 10px">Sending...</span>', 'contactFormMessageSentMsg': '<span style="padding:5px 10px">Your message has been sent.</span>', 'contactFormMessageNotSentMsg': '<span style="padding:5px 10px">Message could not be sent. Please try again later.</span>', 'contactFormInvalidEmailMsg': '<span style="padding:5px 10px">A valid email address is required.</span>', 'contactFormEmptyMessageMsg': '<span style="padding:5px 10px">Message field cannot be empty.</span>', 'title': 'Contact Form', 'blogId': '8866800899420715293', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]>
</script>
<style scoped="scoped">
#main-wrapper{width:100%}
#profile-card{width:220px;box-shadow:0 1px 15px rgba(32,33,36,.28);border-radius:10px;float:left;margin:0 25px 15px 0;text-align:center;padding-bottom:20px}
#profile-card img{border-radius:100%;width:120px;margin:20px}
#profile-card h4{text-transform:none;font-weight:500;color:#4090f1;margin:-10px 0}
#profile-card .desc{margin:0 0 15px;font-size:13px}
#profile-card i{font-size:20px;float:left;width:30px;height:30px;overflow:hidden}
.work,.location,.born{text-align:left;margin:10px 15px;color:#555}
form{min-width:60%;float:left;max-width:100%}
@media screen and (max-width:680px){#profile-card{width:200px;font-size:90%}form{width:100%}}
#sidebar-wrapper{display:none}.datainput{float:none;position:relative;margin-bottom:45px;margin-right:10px}.datainput input,.datainput textarea{font-size:15px;padding:15px 0;display:block;width:100%;border:none;border-bottom:1px solid #ddd}.datainput input:focus,.datainput textarea:focus{outline:none}.datainput label{color:#999;font-size:15px;font-weight:400;position:absolute;pointer-events:none;left:0;top:10px;transition:.2s ease all}.datainput input:focus ~ label,.datainput input:valid ~ label,.datainput textarea:focus ~ label,.datainput textarea:valid ~ label{top:-20px;font-size:14px;color:#5264AE}.bar{position:relative;display:block;width:100%}.bar:before,.bar:after{content:'';height:2px;width:0;bottom:1px;position:absolute;background:#07ACEC;transition:.2s ease all}.bar:before{left:50%}.bar:after{right:50%}.datainput input:focus ~ .bar:before,.datainput input:focus ~ .bar:after,.datainput textarea:focus ~ .bar:before,.datainput textarea:focus ~ .bar:after{width:50%}.highlight{position:absolute;height:50%;width:100px;top:25%;left:0;pointer-events:none;opacity:.5}.datainput input:focus ~ .highlight,.datainput textarea:focus ~ .highlight{animation:inputHighlighter .3s ease}.datainput input:focus ~ label,.datainput input:valid ~ label,.datainput textarea:focus ~ label,.datainput textarea:valid ~ label{top:-20px;font-size:13px;color:#07ACEC}
input#ContactForm1_contact-form-email-message{height:150px}
input#ContactForm1_contact-form-submit{color:#fff!important;background:#2196F3;font-weight:bold;font-family:'Roboto';letter-spacing:2px;padding:15px 25px;border-radius:4px;border:none;outline:none;box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);cursor:pointer;transition:all .4s ease-in-out;text-transform:uppercase;float:left;margin-top:15px}
input#ContactForm1_contact-form-submit:hover{box-shadow:0 8px 17px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
#ContactForm1_contact-form-error-message{float:right;background:#D32F2F;color:#fff;font-size:13px;font-weight:700;border-radius:3px}#ContactForm1_contact-form-success-message{float:right;background:#4CAF50;color:#fff;font-size:13px;font-weight:700;border-radius:3px}svg{width:23px;height:23px;vertical-align:-6px;margin-right:5px}#ContactForm1_contact-form-error-message span,#ContactForm1_contact-form-success-message span{padding:10px!important;display:inline-block}
</style><div class='clear'></div>
<style type='text/css'>
#comments,#sidebar-wrapper {display:none;}
#post-wrapper {float:none;width:100%;margin:0 auto;max-width:100%;}
</style>


Ganti semua kode ID blog ini 5380204764168476747 dengan ID blog Anda dan ganti //minimaxsavage.blogspot.com/ Ganti email: Wiendhywin@gmail.com Ganti Juga : http://m.me/Nadia-Nadia dengan alamat blog Anda.

3 . ShortCodes
Button
Menambahkan demo dan download button.

<div style="text-align: center;">
<ul class="button">
<li><a class="demo" href="YOUR-LINK-HERE" target="_blank">DEMO</a></li>
<li><a class="download" href=" YOUR-LINK-HERE" target="_blank">DOWNLOAD</a></li>
</ul>
</div>
<div class="clear"></div>


Spoiler

<div id="flippy"><button>Spoiler</button></div>
<div id="flippanel">
--- TAMBAHKAN KONTEN DISINI ---
</div>


Membagi konten post menjadi tiga

<div class="bagitiga">
--- TAMBAHKAN KONTEN DISINI ---
</div>


Memasang tabel di postingan

<table cellpadding="0" cellspacing="0" style="text-align: left;">
    <tbody>
        <tr>
            <th>Table Header 1</th>
            <th>Table Header 2</th>
            <th>Table Header 3</th>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
        <tr>
            <td>Division 1</td>
            <td>Division 2</td>
            <td>Division 3</td>
        </tr>
    </tbody>
</table>


Memasang Video Youtube di Postingan

Tambahkan kode di bawah ini di dalam postingan blog pada tab HTML dan ganti link video youtube ini ymq1WdGUcw8 dengan link video youtube Anda

<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/ymq1WdGUcw8">
</div>
</div>
</div>-


Menambahkan Kode Highlighter di Postingan

Tambahkan kode di bawah ini di dalam postingan blog pada tab HTML dan ganti tulisan ini --PASTE KODE DI SINI-- dengan tulisan kode HTML/JavaScript/CSS Anda

<pre><code>--PASTE KODE DI SINI--</code></pre>

4 . Top Menu Navigasi

<ul>
  <li class='homemenu'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='name'>HOME</span></a></li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Template</span></a>
  <ul>
    <li><a href='#' itemprop='url'><span itemprop='name'>List Style Template</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Amp Template Blogger</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Grid Style Template</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Safelink Template</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>Premium Template</span></a></li>
  </ul>
  </li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Software</span></a></li>
  <li><a href='#' itemprop='url'><span itemprop='name'>Redsign</span></a></li>
  <li><a href='https://wiendhywiana.blogspot.com/' itemprop='url'><span itemprop='name'>Tutorial</span></a></li>
</ul>


5 . SEO Meta Tag

<link href='https://www.blogger.com/profile/KODE-PROFIL-BLOGGER' rel='publisher'/>
<link href='https://www.blogger.com/profile/KODE-PROFIL-BLOGGER' rel='author'/>
<link href='https://www.blogger.com/profile/KODE-PROFIL-BLOGGER' rel='me'/>
<meta content='KODE-VALIDASI-GOOGLE-WEBMASTER' name='google-site-verification'/>
<meta content='KODE-VALIDASI-BING-WEBMASTER' name='msvalidate.01'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='NAMA-ADMIN' name='Author'/>


Sekian Dan Terimakasih unutk Tips lainya silahkan tambah sendiri

Related Post

1 comment

Silahkan Memberikan Komentar Jika Ada Hal Yang Kurang Dipahami Dengan Topik Yang Telah Sobat Baca. Biasakan Berkomentar Dengan:

♥ Sopan dan Bahasa Yang Mudah Dipahami.
♥ Tidak Memasukkan Link Aktif Dalam Form Komentar.
♥ Berkomentar Sesuai Artikel Atau Postingan.
♥ Berilah Informasi, Jika Script Atau Link Yang Tidak Berfungsi Dan Mati.
♥ komentar Jorok / Kasar / SARA / PORNO Anggap Sebagai SPAM.
EmoticonEmoticon