Kustom Css

Anda bisa mengubah style dari halaman anda dengan merubah css tema anda, caranya sebagai berikut:

Dari menu pengaturan > masukan css anda di kolom CSS > tandai opsi kustom Css

Untuk mengubah 'layout' halaman anda, anda bisa mengubah css dari struktur halaman anda, contohnya seperti berikut:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
/* jika anda ingin merubah background halaman anda, anda bisa merubah Cssnya seperti berikut */

body{
   background:#000 url(http://media.brungut.com/images/vespalx.jpg) no-repeat center fixed;
   margin:0;
   padding:0;
  }

/* jika anda ingin merubah background list konten, anda bisa merubah Cssnya seperti berikut */

.chathare{
     float:left;
     border-top:1px #333 solid;
     padding:4px 0px;
     opacity:0.92; background:#000;
     width:100%;
     color:#ccc;
     display:inline;
     overflow:hidden;
     text-align:top;
     margin-top:4px;
     font-weight:normal;
 }

 masukan kode CSS ini ke kolom CSS, kemudian klik submit.

Struktur Html halaman anda

<!doctype html>
  <html>
    <div id="menu-wrapper">
        <div class="container_16">
             <div id="usernavigation">
                <div class="grid_14">
                    <ul id="pgmenu">
                        <li><a id="nav_home" href="/" class="on">BRUNGUT</a> </li> 
                        <li class="frames-user">
                    		<a href="/alikusnadi" class="timeline-notif">ALIKUSNADI </a>
                    		<ul id="user-menu">
                                <li><a href="/alikusnadi" title="0 pesan baru">TIMELINE </a></li>
		                    </ul>
	                    </li>
                   </ul>
                </div>
            </div>
        </div>
    </div> 
    <div class="clear"></div>
    <div class="container_16"> 
        <div class="konten">
           <div class="grid_12"> 
               <div class="prefix_2">
                    <div class="frame-form">
                        <form id="sendpost">
                            <input type="text" id="message" name="message">
                            <input type="submit" id="submit" value="Kirim">
                            <div class="emot"><a href="#emot-frame" id="show_emot">^_^</a></div>
                            <div class="menuopsitext"><a href="#sendpost" id="show_text"><></a></div>
                            <div class="menuopsiimg"><a href="#postimage" id="show_image">[||]</a></div>
                        </form>
                        <div class="upload-form">
                            <div style="float:left; display:inline; width:45%; margin:0px 5px; font-weight:normal;">
                                <form action="/upload/" method="post" enctype="multipart/form-data" id="postimage">
                                    <input type="file" name="file" id="photoimg" >  
                                    <br /><input type="submit" id="submit" value="upload">
                                </form>
                            </div>
                            <div style="float:left; display:inline; width:45%; margin:0px 5px;" font-weight:normal;>
                                Ukuran berkas maksimal 1mb. berkas gambar yang didukung jpg, jpeg, png, gif
                            </div>
                        </div>
                    </div>
                    <div class="emot-frame">
                        <div class="emot-kamu"> 
                            <a href="#" onClick=klikEmot(":)")><img src="http://media.brungut.com/emot/happy.png" /></a>
                            <a href="#" onClick=klikEmot(":d")><img src="http://media.brungut.com/emot/excited.png" /></a>
                            <a href="#" onClick=klikEmot(":(")><img src="http://media.brungut.com/emot/sad.png" /></a>
                            <a href="#" onClick=klikEmot(";)")><img src="http://media.brungut.com/emot/wink.png" /></a>
                            <a href="#" onClick=klikEmot(":p")><img src="http://media.brungut.com/emot/tongue.png" /></a>
                        </div>
                        <div class="add-emot">
                            <input type="text" id="url" placeholder="Url Emot">
                            <input type="text" id="code" placeholder="Code.. ex (code)">
                            <div class="emots"><a href="#" id="sendemot">ADD</a></div>
                        </div>
                    </div>
                    <br />
                    <div class="clear"> </div>
                    <div class="menuopsi">
                        <a id="flo" href="#" rel="/alikusnadi/all/" title="lihat Semua" class="all">SEMUA</a>
                        <a id="flo" href="#" rel="/alikusnadi/chat/" title="lihat chat" class="chat" class="on">KONTEN</a>
                    </div>
                    <div class="streamhare">
                        <div class="contenthare">
                            <div id="chat"><div class="chat-frame"></div></div><div class="clear"></div><div class="batas"></div>
                              <div class="chathare">
                                    <div class="grid_1">
                                        <img src="http://media.brungut.com/avatar/alikusnadi/avatar32.jpg" width="32px" />
                                    </div> 
                                    <div class="grid_9"> 
                                          <div class="user-date"><a style="color:#FF8B00;" href="http://brungut.com/alikusnadi">Ali Kusnadi</a> <i><abbr class="timeago" title="2012-01-20T20:30">2012-01-20T2030 </abbr> </i>   <a href="#sendpost" onClick="klikBalas('~alikusnadi', '2012-01-20-20-30-00-514983')">balas</a>   -  <a href="#" id="hapuschat" nav="4f196c585dd3e3067300000d">hapus</a> - <a href="/alikusnadi/2012-01-20-20-30-00-514983/">#</a>
                                           </div>
                                           <p><img class="contentimg" style="display:block; max-width:100%;padding-top:5px; margin-bottom:3px; opacity:1;" src="http://d24w6bsrhbeh9d.cloudfront.net/photo/1976273_700b.jpg" /> haha keren #<a href="/topik/9gag/">9gag</a></p> 
                                 </div>
                              </div>
                              <div class="clear"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <!-- SIDEBAR -->
    <div class="sidebar">
        <div class="container_16"> 
            <div class="grid_4">
                <div class="sid-user-detail">
                    <img src="http://media.brungut.com/avatar/alikusnadi/avatar.jpg" />
                </div>
            </div>
            <div class="grid_3">
                <div class="sid-teman">
                    <h3>TEMAN</h3> 
                    <img src="http://media.brungut.com/avatar/alikusnadi/avatar32.jpg" />
                    <div class="clear"></div>
                </div> 
                <div class="sid-teman">
                    <h3>PENGIKUT</h3>
                    <img src="http://media.brungut.com/avatar/alikusnadi/avatar32.jpg" />
                    <div class="clear"></div>
                </div> 
            </div>
            <div class="grid_3">
                <div class="sid-group">
                    <h3>ALIKUSNADI GRUP</h3> 
                 </div>
           </div>
           <div class="grid_3">
                <div class="sid-trending">
                    <h3>TOPIK TERHANGAT</h3>
                    #<a href="/topik/buset/">buset</a> #<a href="/topik/kabar/">kabar</a> #<a href="/topik/disini/">disini</a> #<a href="/topik/dunia/">dunia</a> #<a href="/topik/world/">world</a> #<a href="/topik/ntar/">ntar</a> #<a href="/topik/haha/">haha</a> #<a href="/topik/9gag/">9gag</a> #<a href="/topik/lampu/">lampu</a> #<a href="/topik/beberesnya/">beberesnya</a> 
                </div>
           </div>
           <div class="grid_3">
                <div class="sid-users">
                    <h3>TEMAN ONLINE</h3>
                </div> 
            </div> 
            <div class="clear"></div>
        </div>
    </div>
    <div class="clear"></div>
    <div id="footer_wrepper">
        <div class="container_16">   
            <div class="grid_10">TEMA RETROIKA</div>               
            <div class="grid_6">
                <div class="rights">
                  VERSI 0.3.1 - © 2012 <a href="http://byur.in">BRUNGUT.COM</a> HOSTING AT <a href="http://byur.in">BYUR</a> 
                </div>
            </div>    
        </div>
    </div>   
  </html>

Table Of Contents

Previous topic

Tentang

Next topic

Kustom Template

This Page