Kode tampilan tombol share

KODE TAMPILAN TOMBOL SHARE
login ke akun blog klik tataletak dan klik tambah gadged
copy kode berikut :
pastekan kedalam gadged klik simpan selesai

<style> #social a:hover { background-color: transparent;opacity:0.7; } #social img { -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center> <div id="social"> <a title="Facebook" href="https://www.facebook.com" target="_blank"> <img src="http://www.topproducerwebsite.com/images/site_defaults/generic/facebook.png" name="e902" border="0" width="30" height="30" " style="margin-right:1px;" alt="icon"/></a> <a title="Gg Pluss" href="https://plus.google.com" target="_blank"> <img src="http://www.topproducerwebsite.com/images/site_defaults/generic/Googleplus.png" name="e902" border="0" width="30" height="30" " style="margin-right:1px;" alt="icon"/></a> <a title="Twitter" href="https://twitter.com" target="_blank"> <img src="http://www.topproducerwebsite.com/images/site_defaults/generic/twitter.png" name="e902" border="0" width="30" height="30" " style="margin-right:1px;" alt="icon"/></a> </div> </center>

<style> ul.flatflipbuttons{ margin:0; padding:0; list-style:none; -webkit-perspective: 10000px; /* larger the value, the less pronounced the 3D effect */ -moz-perspective: 10000px; perspective: 10000px; } ul.flatflipbuttons li{ margin:0; display: inline-block; width: 50px; /* dimensions of buttons. */ height: 50px; margin-right: 15px; /* spacing between buttons */ background: white; text-transform: uppercase; text-align: center; } ul.flatflipbuttons li a{ display:table; font: bold 36px Arial; /* font size, pertains to icon fonts specifically */ width: 100%; height: 100%; margin-bottom: 4px; color: black; background: #3B9DD5; text-decoration: none; outline: none; -webkit-transition:all 300ms ease-out; /* CSS3 transition. Last value is pause before transition play */ -moz-transition:all 300ms ease-out; transition:all 300ms ease-out; } ul.flatflipbuttons li:nth-of-type(1) a{ color: white; background: #3B9DD5; } ul.flatflipbuttons li:nth-of-type(2) a{ background: #A1CD3A; } ul.flatflipbuttons li:nth-of-type(3) a{ background: #80C5EC; } ul.flatflipbuttons li:nth-of-type(4) a{ color: white; background: #635746; } ul.flatflipbuttons li:nth-of-type(5) a{ background: #F2C96D; } ul.flatflipbuttons li a span{ -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display: table-cell; vertical-align: middle; width: 100%; height: 100%; -webkit-transition: all 300ms ease-out; /* CSS3 transition. */ -moz-transition: all 300ms ease-out; transition: all 300ms ease-out; } ul.flatflipbuttons li b{ /* CSS for text beneath button */ display: block; position: relative; width: 100%; opacity: 0; -webkit-transition: all 300ms ease-out 0.2s; /* CSS3 transition. 0.2s delay */ -moz-transition: all 300ms ease-out 0.2s; transition: all 300ms ease-out 0.2s; } ul.flatflipbuttons li a img{ /* CSS for image if defined inside button */ border-width: 0; vertical-align: middle; } ul.flatflipbuttons li:hover a{ -webkit-transform: rotateY(180deg); /* flip horizontally 180deg*/ -moz-transform: rotateY(180deg); transform: rotateY(180deg); background: #c1e4ec; /* bgcolor of button onMouseover*/ -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; transition-delay: 0.2s; } ul.flatflipbuttons li:hover a span{ color: black; /* color of icon font onMouseover */ -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); /* flip horizontally 180deg*/ transform: rotateY(180deg); -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; transition-delay: 0.2s; } ul.flatflipbuttons li:hover b{ opacity: 1; } /* CSS for 2nd menu below specifically */ ul.second li a{ background: #eee !important; } ul.second li a:hover{ background: #ddd !important; } </style> <center> <ul class="flatflipbuttons second"></li> <li><a href="http://Your link FB" target="_blank"><span> <img class="expando" border="0" src="http://www.asybijela.com/images/icon_fb.png " width="50" height="50"> </span></a></li> <li><a href="http://Your link Twitter" target="_blank"><span> <img class="expando" border="0" src="http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons-256/3d-glossy-blue-orbs-icons-social-media-logos/097196-3d-glossy-blue-orb-icon-social-media-logos-twitter.png " width="50" height="50"> </span></a></li> <li><a href="http://Your link G+" target="_blank"><span> <img class="expando" border="0" src="http://cdn.mysitemyway.com/etc-mysitemyway/webtreats/assets/posts/731/icons/glossy-blue-orb-googleplus.png " width="50" height="50"> </span></a></li> </ul>

<style> #facebook,#twitter,#pinterest,#linkedin{text-align:center;-o-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-webkit-transition: all 0.4s ease-in;z-index: 1000;font-family:arial;width:150px;position: fixed;left:0;margin-left:-120px;border:1px solid #ffffff;background-position:top right no-repeat;padding:5px;font:15px Arial;color:#eee;border-top-right-radius:8px;border-bottom-right-radius:8px;-moz-border-radius-topright:8px;-moz-border-radius-bottomright:8px;-webkit-border-top-right-radius:8px;-webkit-border-bottom-right-radius:8px;}#facebook {background:-moz-linear-gradient(top,#1E90FF,#00BFFF );background: -webkit-gradient(linear, left top, left bottom, from(#001C5A), to(#001551));top:350px;}#facebook:hover,#twitter:hover,#linkedin:hover,#pinterest:hover{width:150px;opacity:1.0;margin-left:0;cursor:hand}#facebook a:hover,#facebook a:visited,#twitter a:hover,#twitter a:visited,#linkedin a:hover,#linkedin a:visited,#pinterest a:visited,#pinterest a:hover{text-shadow:none;color:#ffffff}#twitter {background:-moz-linear-gradient(top,#67C9E9,#029BC5);background: -webkit-gradient(linear, left top, left bottom, from(#67C9E9), to(#029BC5));top:382px;}#linkedin{background: #51A104 -moz-linear-gradient(top,#F5FFFA,#C71585);background: -webkit-gradient(linear, left top, left bottom, from(#51A104), to(#000));top:414px;}#pinterest,#mys2010 ul li{background: -moz-linear-gradient(top, #AFEEEE, #4169E1);background: -webkit-gradient(linear, left top, left bottom, from(#AF0000), to(#6B0000));}#pinterest {top:446px;}</style> <div id='pinterest'> <a href='https://www.pinterest.com/myscript2010/'target='_blank'>pinterest</a></div> <div id='linkedin'> <a href='https://www.linkedin.com/nhome/'target='_blank'>linkedin</a></div> <div id='facebook'> <a href='http://www.facebook.com'target='_blank'>Facebook</a></div> <div id='twitter'> <a href='http://twitter.com'target='_blank'>twitter</a></div>

<style> p#socialicons img{ /* 1st set of icons. Rotate them 360deg onmouseover and out */ -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } p#socialicons img:hover{ -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } p#socialicons2 img{ /* 2nd set of icons. Rotate them 60deg onmouseover and out */ -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } p#socialicons2 img:hover{ -moz-transform: rotate(70deg); -webkit-transform: rotate(70deg); -o-transform: rotate(70deg); -ms-transform: rotate(70deg); transform: rotate(70deg); } p#socialicons3 img{ /* 3rd set of icons. Rotate them -360deg onmouseover ONLY. Note where the "transition prop is added */ } p#socialicons3 img:hover{ -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -moz-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -o-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg); }</style> <p id="socialicons3"> <a href="https://www.facebook.com/learn.editing.myscript2010" target="_blank"> <img border="0" src="http://www.topproducerwebsite.com/images/site_defaults/generic/facebook.png" /></a> <a href="https://plus.google.com/u/0/101254379497511200564/posts" target="_blank"> <img border="0" src="http://www.topproducerwebsite.com/images/site_defaults/generic/Googleplus.png" /></a> <a href="https://twitter.com/myscript2010s" target="_blank"> <img border="0" src="http://www.topproducerwebsite.com/images/site_defaults/generic/twitter.png" /></a> <a href="https://www.pinterest.com/myscript2010/" target="_blank"> <img border="0" src="http://www.topproducerwebsite.com/images/site_defaults/generic/Pinterest.png" /></a> <a href="https://www.linkedin.com/nhome/" target="_blank"> <img border="0" src="http://www.topproducerwebsite.com/images/site_defaults/generic/linkedin.png" /></a> </p>

<div class="addthis_toolbox addthis_default_style"> <a class="addthis_button_facebook_like" fb:like:layout="button_count" href="https://www.blogger.com/null"></a> <a class="addthis_button_tweet" href="https://www.blogger.com/null"></a> <a class="addthis_button_google_plusone" g:plusone:size="medium" href="https://www.blogger.com/null"></a> <a class="addthis_counter addthis_pill_style" href="https://www.blogger.com/null"></a> </div> <script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script> <script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5156a09e76c1568f" type="text/javascript"></script>

<style> .techprevue-fb-like-box-pure{width:250px;height:200px;border-radius:3px;position:relative;background:#fff;padding:10px}.techprevue-fb-like-box-pure,.techprevue-fb-like-box-pure:before,.techprevue-fb-like-box-pure:after{background:gray;border:2px solid aqua}.techprevue-fb-like-box-pure:before,.techprevue-fb-like-box-pure:after{position:absolute;content:"";bottom:-3px;left:2px;right:3px;height:3px;border-top:none}.techprevue-fb-like-box-pure:after{left:4px;right:4px;bottom:-5px;box-shadow:0 0 2px #1E90FF} </style><br /> <div class="techprevue-fb-like-box-pure"> <div style="height: 155px; overflow: hidden;"> <div class="g-plus" data-action="followers" data-height="350" data-href="https://plus.google.com/u/0/101254379497511200564/posts" data-source="blogger:blog:followers" data-width="400"> </div> <script type="text/javascript"> (function() { window.___gcfg = {'lang': 'en'}; var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'http://yourjavascript.com/904315511712/google-apis-mys2010.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script></div> </div>

<style> #Mys2010{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;} #Mys2010 a{text-decoration:none; font-family:trebuchet ms,sans-serif;} #Mys2010 li{position:relative; height:38px; cursor:pointer; padding: 0 !important;} #Mys2010 .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeq4DlTrVKF1mZBMjfi2pXym5hzKugGXKBN9TLdxsMXB_qM-O5UvK13ky8yVbkRDj_Pg-4KeQSBKjmhEo45mYIfMohuIxdKz3r7H8yw9I-PK82vWXvS0LH-x_7rriLr2RJG6-25My7pyc/s800/sprites.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;} #Mys2010 li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;} #Mys2010 .icon{overflow:hidden; color:#fafafa;} #Mys2010 .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;} #Mys2010 .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;} #Mys2010 .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;} #Mys2010 .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;} #Mys2010 .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;} #Mys2010 li:hover .icon, .touch #Mys2010 li .icon{width:210px;} .touch #Mys2010 li .facebook, #Mys2010 li:hover .facebook{background-color:rgba(59,89,152,1);} .touch #Mys2010 li .twitter, #Mys2010 li:hover .twitter{background-color:rgba(64,153,255,1);} .touch #Mys2010 li .googleplus, #Mys2010 li:hover .googleplus{background-color:rgba(228,69,36,1);} .touch #Mys2010 li .pinterest, #Mys2010 li:hover .pinterest{background-color:rgba(174,45,39,1);} .touch #Mys2010 li .rss, #Mys2010 li:hover .rss{background-color:rgba(255,102,0,1);} </style> <ul id="Mys2010"> <li data-alt="Follow us on Facebook"><a class="icon facebook" href="Link FB">Follow us on Facebook</a></li> <li data-alt="Follow us on Twitter"><a class="icon twitter" href="Link Twitter">Follow us on Twitter</a></li> <li data-alt="Follow us on Google+"><a class="icon googleplus" href="Link G +">Follow us on Google+</a></li> <li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="Link Pinterest">Follow us on Pinterest</a></li> <li data-alt="Subscribe with RSS"><a class="icon rss" href="http://feeds.feedburner.com/~u/17068674145136893494">Subscribe with RSS</a></li> </ul>

All Sources
edited by. Myscript2010

Get Code Test Script

Menghilangkan Tanda Obeng

a. MENGHILANGKAN TANDA OBENG
Cara kesatu menghilangkan
tanda obeng dan tang yang ada di halaman blog
login ke akun blog klik edit HTML temukan kode ]]></b:skin>
gunakan CTRL F untuk pencarian, copy kode berikut pasatekan diatas kode ]]></b:skin> klik simpan selesai. 

.quickedit{
display:none;
}

Jika cara tersebut tidak berhasil gunakan cara kedua,
langkahnya sama dengan diatas
temukan kode  <b:include name='quickedit'/>
hapus semua kode tersebut klik simpan selesai

b. MENGHILANGKAN TULISAN TIDAK ADA ENTRI
 Cara kesatu Langkah yang sama klik edit HTML kemudian temukan kode ]]></b:skin>
gunakan CTRL F untuk pencarian, copy kode berikut pasatekan diatas kode ]]></b:skin> klik simpan selesai. 

.status-msg-body {display:none;
}
.status-msg-wrap {display:none;
}

Jika cara tersebut tidak berhasil gunakan cara kedua,
langkahnya sama dengan diatas,
temukan kode  :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<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>
<div style='clear: both;'/>
</b:if>
</b:includable>

hapus semua kode tersebut ganti dengan kode :

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>
 kemudian klik simpan selesai

c. MENGHILANGKAN TULISAN LANGGANAN ENTRI ATOM
Cara kesatu menghilangkan tulisan langganan Entri Atom
langkah yang sama  Klik edit HTMLSelanjutnya cari kode :

<div class='feed-links'>
<data:feedLinksMsg/>
<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>
Hapus semua kode tersebut
kemudian klik simpan selesai

Jika cara tersebut tidak berhasil gunakan cara kedua, langkahnya sama dengan diatas temukan kode: ]]></b:skin>
gunakan CTRL F untuk pencarian,
kopy kode berikut pastekan diatas kode  ]]></b:skin> 
.feed-links{ display:none; }
 kemudian klik simpan selesai

d. MENGHILANGKAN TULISAN BERANDA atau HOME
Cara menghilangkan tulisan beranda / home
langkah yang sama  Klik edit HTML Selanjutnya cari kode : <data:homeMsg/>
kemudian hapus kode tersebut.
Klik Simpan selesai

berikutya temukan kode :
<a class='home-link' expr:href='data:blog.homepageUrl'>
hapus kode tersebut dan klik simpan selesai 

jika ingin diganti dengan URL gambar hapus kode :  
<data:homeMsg/> 

ganti dengan kode :
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9vbnPSVmLW1ZWXURhERcghXQJI4ejCCEP1PTnB0HHIsFE7bkNfAZjdx2MQvsUads-nPwXaEFKDtgxOBPGxhOW-zrnWat6SR7NWFzOKNdZeRdUIIrs-krq1r3qIjYDkNS5e0N3hK6GiO4/'/>
Klik simpan selesai

e. MENGHILANGKAN TULISAN POSTING LAMA / OLDER POST
Cara menghilangkan tulisan posting lama older post
langkah yang sama  Klik edit HTML Selanjutnya cari kode : <data:olderPageTitle/>
Atau Kode <data:newerPageTitle/>
hapus kode tersebut.
Kemudian Klik Simpan selesai

jika ingin diganti dengan URL gambar hapus kode :  
<data:olderPageTitle/>

ganti dengan kode :  
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpSA3YIndH6vDqqDmGbfJLUEzwSvu6D9qlqj-2iKyJdRPNWaKHNPcvimdELKLq_WGaM-bacpJYvWsXnonwZovm4NyHQKJ58bkYqXUojF1An0r4huP0D8OzsLLlhAseZ9tNmlOn8X4j7TB8/s1600-r/t1mys2010.png'/>
Klik Simpan selesai
 

f. MENGHILANGKAN TULISAN POSTING BARU / NEWER PAGE
Cara menghilangkan tulisan posting baru/newer page
langkah yang sama  Klik edit HTML Selanjutnya cari kode :  <data:newerpagetitle>
kemudian hapus kode tersebut.

jika ingin diganti dengan URL gambar hapus kode :  <data:newerpagetitle>

ganti dengan kode :  
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl4VtmuPOIiLvGTP9FR5pCj5XoDSDH7aIOfMtXqki2dI2ySHcZjR4p_xl9g-iJsirN-4OwBXLGum6hVwG4uu41F08sgZ34Db5_aUwMWiwnMV5vt7hg5IQHCw5IOegVkT8xCUnbWLktU67b/s1600-r/t2mys2010.png'/>
Klik Simpan selesai

g. MENGHILANGKAN TULISAN DIBERDAYAKAN OLEH BLOGGER
Cara menghilangkan tulisan diberdayakan oleh blogger
langkahnya sama dengan diatas temukan kode: ]]></b:skin>
gunakan CTRL F untuk pencarian,
copy kode berikut pastekan diatas kode  ]]></b:skin>
#Attribution1 {
height:0px;
visibility:hidden;
display:none
Klik Simpan selesai
 

Jika cara tersebut tidak berhasil
gunakan cara kedua, langkahnya sama dengan diatas temukan kode : <b:widget
gunakan CTRL F untuk pencarian  kode lengkapnya seperti ini :
<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/>
      </b:if>
    </div>

    <b:include name='quickedit'/>
  </b:includable>
        </b:widget>
hapus semua kode tersebut klik simpan selesai

Jika ingin menambahkan URL HomePage Temukan kode :  
<!-- outside of the include in order to lock Attribution widget -->
gunakan CTRL F untuk pencarian copy kode berikut,
 <center>
Copyright &#169; 2015  <a href='http://Your Link.blogspot.com/'>Your Text</a>. by. Your Text</center>

 letakan dibawah kode
<!-- outside of the include in order to lock Attribution widget -->
Klik simpan selesai

Menghilangkan garis bawah diseluruh isi blog
Langkah yang sama klik edit HTML kemudian temukan kode ]]></b:skin>
gunakan CTRL F untuk pencarian, copy kode berikut pasatekan diatas kode ]]></b:skin> klik simpan selesai.

a:link {text-decoration: none}
a:visited {text-decoration: none}
a:active {text-decoration: none}

Menghilangkan Tulisan Label pada Postingan
Login ke akun blog klik edit HTML temukan kode dibawah ini, gunakan CTRL F untuk pencarian bila sudah ketemu hapus semua kode tersebut kemudian klik simpan selesai

<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' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,
</b:if></b:loop></b:if>
</span> 

Menghilangkan Border bingkai poto pada postingan Login ke akun blog klik edit HTML
temukan kode :  .post img { padding: 4px; border: 1px solid  bila sudah ketemu,
rubah nilai border angka 1 menjadi angka 0 dan klik simpan selesai. lihat contoh dibawah ini :

.post img {
padding: 4px; border: 0px solid

Cara Menghilangkan Kalimat :  
Rekomendasikan ini di google - Login ke akun blog klik edit HTML temukan kode :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='clear:both;'/>
<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>
<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
<table border='0' cellpadding='0' width='100%'><tr>
<td style='font-size:12px;padding-top:2px;' valign='top'><span
class='reactions-label'><data:top.reactionsLabel/></span></td>
<td><iframe allowtransparency='true' class='reactions-iframe'
expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
</tr></table>
</b:if>
</span>
</b:if>

gunakan CTRL F untuk pencarian
bila sudah ketemu hapus semua kode tersebut kemudian klik simpan selesai

all Sumber
edited by. Myscript2010

Tampilan blogger sebelum diedit

Textarea untuk menampilkan Teks

Textarea untuk menampilkan Teks kedalam postingan
Login ke akun blog klik tataletak klik entri halaman baru HTML copy code berikut
pastekan kedalam halaman baru HTML dan klik simpan selesai

1-  Kode Textarea

<div style="border: 3px #00BFFF Double; padding: 30px;background:#444;color:#FFCC00;width:417px;
text-align: left;">
Your Texts
</div>

1- Contoh Textarea untuk menampilkan Teks

Your Texts

 2-  Kode Textarea

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background:#333;color:#FF0000; border-radius: 10px; border-bottom:4px solid #008000; padding: 10px;width: 461px;
height: 42px; text-align: left;">
Your Texts
</div>

2- Contoh Textarea untuk menampilkan Teks

Your Texts

3-  Kode Textarea

<p style="border-bottom:4px solid #40FF1F;padding: 15px; display: block; width:450px; height:40px; background:#2F4F4F;color:#FF0000; text-align: left;">
 Your Texts
</p>

3- Contoh Textarea untuk menampilkan Teks

Your Texts

4-  Kode Textarea

<div style="border: 3px  #8B008B solid; padding: 10px;background: #2F4F4F;color:#FF0000;border-bottom:4px solid  #D2691E;overflow: auto; height: 50px; width: 456px; text-align: left;">Your Texts
</div>

4- Contoh Textarea untuk menampilkan Teks

Your Texts

All Sources
Edited by. Myscript2010

---

Mari Belajar

Beberapa macam model textarea

TEXTAREA

ada beberapa macam model textarea untuk menampilkan script kedalam postingan yang dapat diterapkan ke halaman baru HTML. berikut contoh textarea

1- Textarea Hover dengan warna background

<style>.textarea {
padding:0;
margin:0;
background: #444;
width:483px;
height:100px;
color:#00BFFF;
font:12px arial;
border:0px dashed #fff;
}
.textarea:hover {
color:#fff;
border:2px solid #fff;
}</style>

 <textarea class="textarea" readonly="readonly">             
          your code here
</textarea>

1- Contoh Textarea Hover

your code here

2- Textarea Slect dengan warna background

<textarea class="input" cols="56" onclick="javascript:this.select();" readonly="true" rows="3" style="background:#bffaff;color:#FF0000;border-bottom:4px solid #40FF1F;border-right:4px solid #40FF1F;border-top:4px solid #FFE900;border-left:4px solid #FFE900;line-height:1.5em;padding:5px;">
your code here
</textarea>

2- Contoh Textarea Select

your code here

3- Textarea Auto Slect dengan warna background

<textarea onclick="input" cols="56"this.focus();this.select()" onfocus="this.select()" onmouseover="this.focus()" readonly="readonly" rows="3" style="background:#4B0082;color:#fff;border-bottom:4px solid #40FF1F;border-right:4px solid #1E90FF;border-top:4px solid #1E90FF;border-left:4px solid #FFE900;line-height:1.5em;padding:5px;">
your code here
</textarea>

3- Contoh Textarea Auto Select

your code here

All Sources
Edited by. Myscript2010

---

Mari Belajar

Textarea untuk menampilkan script

Textarea untuk menampilkan script

Cara membuat textarea  agar semua script
dapat tampil dalam sebuah  postingan
langkahnya Sebagai berikut :

Login ke akun blogg klik edit HTML
cari kode ]]></b:skin> gunakan CTRL F untuk pencarian kemudian copy kode berikut, pastekan diatas kode ]]></b:skin> klik simpan

.kotak {
padding:10px;
margin-top:5px;
margin-bottom:10px;
border-left: 10px solid #0b5394;
border-top:1px solid #ddd;
border-bottom:1px solid #eee;
border-right:1px solid #eee;
box-shadow:0px 3px 3px #aaaaaa;
background: url(https://#.png)
no-repeat center center;}

Jika sudah selesai klik tataletak dan klik entri halaman baru HTML, copy kode berikut, pastekan kedalam halaman baru HTML, lalu klik compose, hapus teks yang bertuliskan sample, ganti dengan script yang ingin di posting klik publis selesai

<div class="kotak">
Sample
</div>

Textarea scroll kesamping
<div class="kotak" style="overflow-x: scroll; overflow-y: hidden; padding: 10px; width: 580px;" >
Sample
 </div>

All Sources
Edited by. Myscript200

---

Mari Belajar

Dekorasi HTML & CSS

Contoh dekorasi HTML & CSS

HTML & CSS Myscript2010 Cibeber Cimahi

<style type="text/css">
#box {
    position:relative;
    background:#444;
    width:300px;
    height:200px;
    margin:20px 25px;
}
#ribbon {
    position:absolute;
    top:15px;
    left:-20px;
    width:260px;
    height:55px;
    background:#ff2702;
    color: #F0FFFF;
    padding:30px 40px;
    font-size:40px;
    font-weight:bold;
    border-radius:9px 5px 0 0;
    box-shadow:0 0 9px #333;
    text-shadow:0 0 8px #000;
}
#ribbon:before {
    content:'';
    position:absolute;
    bottom:-20px;
    left:0;
    border-top:solid 10px #ff2702;
    border-right:solid 10px #ff2702;
    border-bottom:solid 10px transparent;
    border-left:solid 10px transparent;

#ribbon:before {
    content:'';
    position:absolute;
    bottom:-20px;
    left:0;
    border-top:solid 10px #ff2702;
    border-right:solid 10px #ff2702;
    border-bottom:solid 10px transparent;
    border-left:solid 10px transparent;
}
#ribbon:after {
    content:'';
    position:absolute;
    bottom:-20px;
    right:0;
    border-top:solid 10px #ff2702;
    border-right:solid 10px transparent;
    border-bottom:solid 10px transparent;
    border-left:solid 10px #ff2702;
}
</style>

<div id="box"><div id="ribbon"> HTML & CSS </div>

Sumber by. Stackoverflow
Edited by. Myscript2010

SAMPLE HTML5

Contoh kode (CSS) dan (HTML)

Contoh kode  (CSS) dan (HTML) 
 
(kode CSS)

h1 {text-align: center; color: #0000FF;}






yang akan digabungkan dengan kode HTML
menjadi sebuah kalimat (Mari Belajar) 


(kode HTML)

<html>
<head>
<title> Post </title>
<link rel=”stylesheet” type=”text/css” href=”css.css”>
</head>
<body> <h1>Mari Belajar </h1>
</body>
</html>                                                                      

Contoh CSS dan HTML yang digabung mengunakan tag penutup
<style type="text/css">  </style>

<style type="text/css">
 h1 { text-align: center; color :  # 0000FF; }
</style>
 <html>
<head>
<title> CSS & HTML </title>
<link rel=”stylesheet” type=”text/css” href=”css.css”>
</head>
<body> <h1>Mari Belajar </h1>
</body>
</html>          

Contoh CSS dan HTML setelah digabung hasilnya menjadi

Mari Belajar

All Sources
Edited by. Myscript2010

Pelajaran Dasar Tentang Kode CSS

                                     (CSS) : adalah Cascading Style Sheets

(CSS) Berfungsi untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. 

(CSS) bukan merupakan bahasa pemograman.

Yang dapat dikendalikan dengan (CSS) adalah Teks spasi paragraf, dan juga border margin pada tabel serta pewarnaan baik itu teks tabel maupun gambar berikut ukurannya. untuk saat ini CSS memiliki 3 Versi yaitu CSS 1 CSS 2 dan CSS 3 masing masing berfungsi untuk mendesain Website maupun Webblog.

 Contoh penulisan CSS :    
               
           h1   
       {
         color: #0789de;
                         }
                                
Penjelasan :

h1      adalah Selector Berfungsi untuk memperbesar Teks
{ }     adalah declaration penutup isi, baik pewarnaan
           border, margin, dan juga ukuran panjang lebar sebuah
           gambar yang akan ditampilkan dalam postingan

#483D8B;
        adalah property Berfungsi untuk pewarnaan yang
        diakhiri dengan titik koma ;

contoh susunan (CSS )     h1 { color: #483D8B; }


CSS dibuat oleh : World WideWeb Consortium (W3C)

 All Sumber
Edited by. Myscript2010

---

Mari Belajar

Pelajaran Dasar Kode Edit Simbol

Pelajaran dasar simbol kode HTML  untuk postingan  (HTML)  Hyper Text Markup Language  adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman webblog, yang menampilkan berbagai informasi di dalam sebuah  webblog, dibawah ini adalah beberapa contoh Simbol kode HTML yang dapat diedit

Simbol Code HTML	Hasil Code HTML
►	►
◀	◀
▼	▼
▲	▲
♣	♣
♥	♥
☼	☼
♫	♫
☠	☠

Nama Simbol Code HTML	Code Simbol HTML	Hasil Code HTML
Trade merk	™	™
Registered	®	®
Copyright	©	©
double Right pointing	»	»
double left pointing	«	«

All Sources
Edited by. Myscript2010

---

Mari Belajar

Pelajaran Dasar Kode Edit Text

Pelajaran dasar kode edit text  untuk postingan di blogg (HTML)  Hyper Text Markup Language  adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman webblog, yang menampilkan berbagai informasi di dalam sebuah  webblog, dibawah ini adalah beberapa contoh kode edit text  HTML yang dapat diedit

Nama Code HTML	Hasil Code HTML
Spasi	     isi teks
Paragrafasi	<p>         isi teks   </p>
Baris Baru	<br>        isi teks  </br>
Teks besar	<h1>       isi teks   </h1>
Teks Kecil	<h6>       isi teks  </h6>
Teks Tebal	<b>         isi teks   </b>
Teks Tebal	<strong> isi teks </strong>
Teks Miring	<i>    isi teks  </i>
Teks Garis Bawah	<u>   isi teks </u>

Font Ukuran & Warna Text
Teks rata kiri	<p align="left">      isi teks   </p>
Teks rata kanan	<p align="right">    isi teks  </p>
Teks rata  tengah	<p align="center">  isi teks  </p>
Font / gaya   text	<font face="arial"> isi teks </font>
Font / warna text	<font color="red">  isi teks </font>
Font / warna text	<span style="color: red;">  isi teks </span>
Font / Ukuran text	<font style="font-size:50%;">   isi teks </font>
Font / warna & &ukuran  text	<font size="3" color="blue"face="arial"> isi teks</font>
Font / ukuran text kecil	<span style="font-size: xx-small;"> isi teks   </span>
Font / ukuran text besar	<span style="font-size: large;">    isi teks    </span>
Font / ukuran text  px	<span style="font-size: 40px;">    isi teks   </span>
Font / warna text	<span style="color: #f53477;">    isi teks   </span>

All Sources
Edited by. Myscript2010

---

Mari Belajar   

Forum Muut dan Google

Pengertian Forum
forum adalah sebuah sarana komunikasi untuk sebuah komunitas. sama halnya seperti Social Network. didalam forum tersebut ada pembagian kategori yang dibuat untuk memudahkan penggunanya dalam berinteraksi. atau bisa diartikan sebagai tempat untuk berinteraksi, dengan adanya forum kita dapat dengan mudah mencari sebuah informasi.
Untuk bergabung klik Forum Contoh Forum Myscript2010

From Contact Us Mys2010

From Contact Us ini berfungsi untuk memudahkan para pengunjung blog agar dapat berkomunikasi secara privasi melalui pesan pribadi kepada penulis, dan juga memberikan saran serta kritik.
Jika ingin memiliki From Contact Us silahkan mengunjungi Link From Contact Us emailmeform
Jika ingin memberikan saran kritik silahkan kirim ke  Myscript2010

Your email

Author

Judul artikel, Author

nama penulis (tanpa gelar akademis), alamat afiliasi penulis ditulis dengan tujuan belajar, Get  in the code untuk menampilkan
gambar author, copy paste Back link untuk persahabatan

About Me

Tentang Saya

Pada awalnya sore hari saya ingin mendownload
lagu lagu pilihan yang saya inginkan melalui sebuah blogg,

saat itu saya melihat sebuah blogg menurut saya
desainnya bagus dan saya tertarik untuk membuatnya
saya coba belajar membuat blogg dengan cara mengikuti tutorial yang ada.

Ternyata membuat sebuah blogg tidak mudah
mendesain sebuah blogg berikut isinya sangat sulit
dan saya terus belajar hingga akhirnya saya dapat mengerti,
bagaimana cara membuat blogg,

blogg yang saya buat merupakan blogg yang berisikan berbagai macam tutorial yang diambil dari internet serta dari pengalaman pribadi.
Namun saya merasa bahwa kemampuan saya belum seberapa,
saya berharap akan adanya koreksi terhadap tutorial yang saya buat demi kemajuan blog ini.

Salam Blogger
Myscript2010 Cibeber Cimahi

---

Mari Belajar   

My Profile

Profile Singkat
Mengenai Myscript2010

Nama Lengkap	Sulaeman
Nama Lain	Myscript2010
Tempat Lahir	Jakarta
Kebangsaan	Indonesia
Agama	Islam
Pekerjaan	Karyawan