Dokumentasi INFINITE Responsive Blogger Template

<script type=’text/javascript’>
var disqus_shortname = &quot;infinite-1&quot;;
!function(){var e=document.createElement(&quot;script&quot;);e.async=!0,e.type=&quot;text/javascript&quot;,e.src=&quot;//&quot;+disqus_shortname+&quot;.disqus.com/count.js&quot;,(document.getElementsByTagName(&quot;head&quot;)[0]||document.getElementsByTagName(&quot;body&quot;)[0]).appendChild(e)}();
</script>

<form id=”kontak-arlina” name=”contact-form”>
<input id=”ContactForm1_contact-form-name” name=”name” placeholder=”Name *” size=”30″ type=”text” value=”” />
<input id=”ContactForm1_contact-form-email” name=”email” size=”30″ placeholder=”Email *” type=”text” value=”” />
<textarea cols=”25″ id=”ContactForm1_contact-form-email-message” name=”email-message” placeholder=”Message *” rows=”5″></textarea>
<input id=”ContactForm1_contact-form-submit” type=”button” value=”Send Message” />
<div style=”max-width: 100%; text-align: center; width: 100%;”>
<div id=”ContactForm1_contact-form-error-message”>
</div>
<div id=”ContactForm1_contact-form-success-message”>
</div>
</div>
</form>
<style scoped=”” type=”text/css”>
#comments,.post_meta,#blog-pager{display:none}
form{color:#666}
form.payforpal{margin:auto;text-align:center}
#kontak-arlina{margin:auto;max-width:640px}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out}
#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}
#ContactForm1_contact-form-submit{float:left;background:#1abc9c;margin:auto;vertical-align:middle;cursor:pointer;padding:16px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;border-radius:4px;color:#fff;font-weight:500;transition:all .2s ease}
#ContactForm1_contact-form-submit:hover{background:#16a085;color:#fff;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}
.contact-form-error-message-with-border{background:#f47669;border:0;box-shadow:none;color:#fff;padding:5px 0;border-radius:3px}
.contact-form-success-message{background:#4fc3f7;border:0;box-shadow:none;color:#fff;border-radius:3px}
img.contact-form-cross{line-height:40px;margin-left:5px}
.post-body input{width:initial}
@media only screen and (max-width:640px){
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}
</style>
<script type=”text/javascript”>
//<![CDATA[
if (window.jstiming) window.jstiming.load.tick(‘widgetJsBefore’);
//]]>
</script>
<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’] = ‘3263220808940184577’;BLOG_attachCsiOnload(”); }_WidgetManager._Init(‘//www.blogger.com/rearrange?blogIDx3d3263220808940184577’,’//infiniteidn.blogspot.com/‘,’3263220808940184577‘);
_WidgetManager._RegisterWidget(‘_ContactFormView’, new _WidgetInfo(‘ContactForm1’, ‘footer1’, null, document.getElementById(‘ContactForm1’), {‘contactFormMessageSendingMsg’: ‘Sending…’, ‘contactFormMessageSentMsg’: ‘Your message has been sent.’, ‘contactFormMessageNotSentMsg’: ‘Message could not be sent. Please try again later.’, ‘contactFormInvalidEmailMsg’: ‘A valid email address is required.’, ‘contactFormEmptyMessageMsg’: ‘Message field cannot be empty.’, ‘title’: ‘Contact Form’, ‘blogId’: ‘3263220808940184577‘, ‘contactFormNameMsg’: ‘Name’, ‘contactFormEmailMsg’: ‘Email’, ‘contactFormMessageMsg’: ‘Message’, ‘contactFormSendMsg’: ‘Send’, ‘submitUrl’: ‘https://www.blogger.com/contact-form.do’}, ‘displayModeFull’));
//]]>
</script>

<style scoped=” type=’text/css’>
ul.recent_posts_arlina li{display:inline-block;position:relative;width:100%;margin:0;padding:8px 0;transition:all .3s linear;}
ul.recent_posts_arlina li:last-child {border:0;}
.recent_posts_arlina .wrapinfo{margin:0 10px 0 0;overflow:hidden;z-index:2;display:block;position:relative;border-radius:0;width:100px;height:auto;float:left}
ul.recent_posts_arlina li img.recent_thumb{width:100%;height:auto}
.recent_posts_arlina {float:left;width:100%;margin:10px 10px 5px 0px;padding:0;font-size:.9rem;}
ul.recent_posts_arlina li a{color:#202020;font-size:14px;font-weight:400;line-height:normal}
ul.recent_posts_arlina li a:hover{color:#ec2028}
.recent_posts_arlina i{font-style:normal;color:#999;font-size:13px}
</style>
<script style=’text/javascript’ src=’https://cdn.rawgit.com/Arlina-Design/FlamingTree/master/recentpostarlina.js’></script>
<script style=’text/javascript’>
var numposts=4,showpostthumbnails=!0,displaymore=!1,displayseparator=!1,showcommentnum=!1,showpostdate=!1,showpostsummary=!1,numchars=62;
</script>
<script src=’/feeds/posts/default?orderby=published&alt=json-in-script&callback=recentpostinfoarlina’></script>

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

<span class=”first-letter”>Your First Letter here</span>

<div style=”text-align: center;”>
<ul class=”ripplelink button”>
<li><a class=”demo” href=”https://tipsseokiller.blogspot.com/” target=”_blank”>DEMO</a></li>
<li><a class=”download” href=”https://tipsseokiller.blogspot.com/” target=”_blank”>DOWNLOAD</a></li>
</ul>
</div>
<div class=”clear”></div>

• DEMO
• DOWNLOAD

<div class=”bagidua”>
— TAMBAHKAN KONTEN DISINI —
</div>

Lorem ipsum dolor sit amet, consectetur adispiscing elit. Nullam ut enim, hendrerit nunc vel, fringgila augue. Sed sed erra tellus.

<div class=”bagitiga”>
— TAMBAHKAN KONTEN DISINI —
</div>

Lorem ipsum dolor sit amet, consectetur adispiscing elit. Nullam ut enim, hendrerit nunc vel, fringgila augue. Sed sed erra tellus. Lorem ipsum dolor sit amet, consectetur adispiscing elit.

<div class=”bagiempat”>
— TAMBAHKAN KONTEN DISINI —
</div>

Lorem ipsum dolor sit amet, consectetur adispiscing elit. Nullam ut enim, hendrerit nunc vel, fringgila augue. Sed sed erra tellus. Lorem ipsum dolor sit amet, consectetur adispiscing elit. Lorem ipsum dolor sit amet, consectetur adispiscing elit. Nullam ut enim, hendrerit nunc vel, fringgila augue. Sed sed erra tellus. Lorem ipsum dolor sit amet, consectetur adispiscing elit.


#8. Tabel 3 di Dalam Postingan Blog

<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>

var infinite_scroll=new InfiniteScroll({type:2,target: bla bla bla bla….