February 15, 2017

Apa Itu Kode Macro:Include di Template Bawaan Blogger?

Apa Itu Kode Macro:Include di Template Bawaan Blogger?

Apa Itu Kode <macro:include> di Template Bawaan Blogger? What are <macro:include>, <macro:param>?


Berikut ini kode selengkapnya:

<macro:includable id='sections' var='col'>
<macro:if cond='data:col.num == 0'>
<macro:else/>
<b:section mexpr:class='data:col.class' mexpr:id='data:col.idPrefix + &quot;-1&quot;' preferred='yes' showaddelement='yes'/>
<macro:if cond='data:col.num &gt;= 2'>
<table border='0' cellpadding='0' cellspacing='0' mexpr:class='&quot;section-columns columns-&quot; + data:col.num'>

Jangan coba hapus kode tersebut karena itu kode untuk mengatur atau membuat sub-section di area widget --to create sub-sections in widget area, seperti dalam gambar ini:

sub-sections in widget area


Sumber: 
https://productforums.google.com/forum/#!topic/blogger/INxeiHd3DzM
https://productforums.google.com/forum/#!topic/blogger/rZstnsUAWL4

January 15, 2017

Cara Pasang Daftar Posting Terbaru (Recent Post) Simple di Sidebar Blog

Cara Pasang Daftar Posting Terbaru (Recent Post) Simple di Sidebar Blog

Cara Pasang Daftar Posting Terbaru (Recent Post) Simple di Sidebar Blog

Berikut ini Cara memasang widget berisi Daftar Posting Terbaru (Recent Post, Latest Posts, Artikel Terbaru, Entry Terbaru) Simple di Sidebar Blog.


 Daftar Posting Terbaru

Daftar Posting Terbaru ini Otomatis muncul di halaman dalam saja, karena halaman depan sudah tampil, jadi tidak ada judul posting terbaru double.

Kode CSS Recent Post Simple
Simpan di atas kode ]]></b:skin>

#recent-posts{width:85%;padding:10px;margin:0 auto;border:1px solid #ddd}
#recent-posts ul,#recent-posts li{list-style:none}
#recent-posts a{text-decoration:none}
#recent-posts li{border-top:1px dotted #ddd;padding:6px 0}
#recent-posts li:first-child{border-top:none}
#recent-posts h2{margin:12px}


Kode HTML Recent Post Simple
Simpan di bawah kode sidebar. Kalo ada  kode kotak pencarian, simpan di bawah kode kotak pencarian.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='widget HTML' data-version='1' id='HTML3'>
<h2 style='margin:15px;padding: 10px;background: #f1f1f1;'>Recent Posts</h2>
<div class='widget-content'>
<script>
//<![CDATA[
function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<5;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}}
document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="'+ posttitle+'">'+ posttitle+'</a>');document.write('</li>');}
document.write('</ul>');};
document.write("<scr" + "ipt type=\"text/javascript\" src=\"/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts\"></scr" + "ipt>");
//]]>
</script>
</div>
  <div class='clear'/>
</div>
</b:if>

Cara Membuat Footer Tiga Kolom Responsive - Desain Blog

Cara Membuat Footer Tiga Kolom Responsive - Desain Blog

Cara Membuat Footer Tiga Kolom Responsive untuk Blogger

Membuat Footer Tiga Kolom Responsive di bawah halaman blogger atau di atas credit-footer tinggal memasukkan dua jenis kode, yakni kode CSS dan kode HTML seperti di bawah ini.

Footer Tiga Kolom Responsive


KODE CSS Footer Tiga Kolom Responsive 
Simpan di atas kode ]]></b:skin>

#lower{margin:0 auto;padding:1px;width:97%;background:#333}
#lower-wrapper{margin:0 auto;padding:20px 0;width:100%;border:0}
#lowerbar-wrapper{float:left;margin:0 5px auto;padding-bottom:20px;width:32%;text-align:left;color:#ddd;font:bold 12px Arial,Tahoma,Verdana;line-height:1.6em;word-wrap:break-word;overflow:hidden}
.lowerbar{margin:0;padding:0}
.lowerbar .widget{margin:0;padding:10px 20px 0}
.lowerbar .widget h2{font:normal 300 16px Oswald,Arial,sans-serif;margin:0 0 10px;padding:7px 0;border-bottom:2px solid #ddd;text-transform:uppercase;position:relative;color:#fafafc}
.lowerbar .widget h2:after{content:" ";width:90px;height:0;position:absolute;left:0;bottom:-2px;border-bottom:2px solid #e74c3c;content:" ";width:90px;height:0;position:absolute;left:0;bottom:-2px;border-bottom:2px solid #e74c3c}
.lowerbar ul{color:#fff;margin:0 auto;padding:0;list-style-type:none}
.lowerbar li{display:block;color:#fff;line-height:1.6em;margin-left:0!important;padding:7px 0;border-bottom:1px solid #222;list-style-type:none;text-align:left}
.lowerbar li:last-child{border-bottom:none}
.lowerbar li a{text-decoration:none;color:#DBDBDB}
.lowerbar li a:hover{text-decoration:underline}
.lowerbar li:hover{display:block;background:#222}
@media only screen and (max-width:768px) {
#lower,#lower-wrapper{overflow:hidden!important;width:100%!important}
#lowerbar-wrapper{overflow:hidden!important;width:95%!important;padding:5px}
#credits p{text-align:center!important}
}

KODE HTML Footer Tiga Kolom Responsive 
Simpan di atas kode credit footer blog Anda.

<div id='lower'>
<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>

January 13, 2017

Sample Posting dengan Semua Elemen Teks

Sample Posting dengan Semua Elemen Teks

Sample Posting dengan Semua Elemen Teks
Sample Posting User Friendly dengan Semua Elemen Teks.

DI bawah ini adalah contoh tampilan teks, tulisan, atau naskah posting blog yang ramah pengguna (user friendly), sehingga mudah dipindai (scannable) dan mudah dibaca (readable).

Tampilan posting hendaknya rata kiri (align left) sesuai dengan standar penulisan di website menurut W3C, menggunakan alinea pendek (short paragraph), ada jarak antar alinea (white space), dan highglights.

Ma esser debitores duo. Lista americano da non, summario publicava tu que, non ma como signo extrahite. De uso commun finalmente. Es international concretisation duo.

 Al infra synonymo que. E per resultato periodicos, uso un patre anque personas, ille americano vocabulario tu qui.

Union parlar occidental su web. Malo occidental duo lo. Illo texto connectiones es uno, su magazines intermediari sed.

BOLD
E uso debitores encyclopedia, pro tu etiam vocabulos publicate. Da pro contos gymnasios, lo rapide message uno. Sia ma ille pardona incorporate. In qui parola vocabulario. Terra greco-latin duo su, uso clave moderne europeo se.

ITALIC
 Non es nomina linguistas historiettas. Pote laborava sed e. Union tamben le pan, sia texto moderne auxiliary ha. Ha nos traducite continentes, duo iste association representantes ha.

QUOTES:  E que usos preparation, lo prime interlingua per, al via programma conferentias. O web latente supervivite interlingua, cinque involvite duo o, sed un studio lateres programma. Campo spatios complete per in, parlar original non es. Web iala excellente paternoster il, web super incorporate es.

BULLETS
Auxiliary instruction ma pro:
  • Movimento intermediari del ha. 
  • Vista vocabulos ma uso, 
  • da como resultato web. 
  • Web lo debe medical distinguer, 
  • Nos clave supervivite es. 

Sia de avantiate incorporate. Que lo language professional principalmente, uno in tote origine denomination, latente greco-latin uno lo. Il iala rapide comprende del. De uso membros immediatemente.

NUMBERING
Del ha publication immediatemente. Ma sia esseva nostre, pro lo europeo linguage conferentias.
  1. Brevissime angloromanic uso in, 
  2. su linguistas methodicamente sed. 
  3. Appellate intention qui su. 
  4. Pro e toto subjecto, le malo debitas 
  5. Litteratura uno, que vices europa traduction un. 
  6. Ma web magazines 
  7. Grammatica, sine celos language de nos. 

Pan da libera quales, pardona populos concretisation se qui. Tu tres supervivite via, esser studio dictionario web tu. Nos basate voluntate su.

H1: Da con medio articulos independente, patre national (Heading)

H2: Utilitate duo ha, russo technic populos al per. (Subheading)

H3: Campo involvite addresses il pro, toto cinque representantes es pan. (Minor Heading)


Lo uso integre historia. Via lo esseva capital. Servi basate cadeva su con, duce servi debitas web ha. Nos studio nostre historiettas tu. Scientific philologos pan su, hodie linguas sia o. Web ma iala commun intermediari, pan debitores anglo-romanic al.

LINK COLOR Duo vocabulario greco-latin o. Sed tempore instruite anglo-romanic ha, texto pardona ha via. Russo tamben message es que. Uno infra principalmente al. Sia se tempore initialmente introduction, in non durante hereditage, medical publicate millennios su pro.

 Hodie methodicamente pan de, medical greco-latin le del, con active linguistic introductori se. Uno le vostre libere membros, uso ille sitos instruite il. Via medio practic angloromanic al. Ample simplificate in sia, da facto pardona via. Con ma peano anglese, tu deler ample national que. Celos practic es sia, usos infra studio web al.

Demikian Sample Posting dengan Semua Elemen Teks yang ramah pengguna (user friendly).

KESIMPULAN
Tampilan posting blog hendaknya:
  1. Rata kiri (align left) sesuai dengan standar penulisan di website menurut W3C
  2. Menggunakan alinea pendek (short paragraph)
  3. Ada jarak antar alinea (white space)
  4. Highglights.

Cara Menghapus Tulisan Showing posts with label

Cara Menghapus Tulisan Showing posts with label

Cara Menghapus Teks Tulisan Showing posts with label Blogging. Show all posts di halaman label (label page) sehingga tampilan halaman label atau post per kategori bersih.

Cara Menghapus Showing posts with label Blogging. Show all posts


1. Template > Edit HTML
2. Ganti 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>

Dengan

<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

3. Save. Beres!