Monday, July 20, 2009

Create Template:Box Positioning(Part 2)

» Click to show Screenshot«


hi...you all,previously i thought you about creating a template ,right??
but,only until the page structure ,so this article will be the next part for the previous one.
this time i decided to tell you about Boxes, it's the main bar and the sidebar
i will tecah you how to move it and create your own design with that,as you know there is some type of template ,like 2 coloumn(only mainbar and sidebar),3 coloumn(usually mainbar and 2 sidebar),and sometimes there is also 4 coloumn or more,the box position itself depends with the one who created it,for example you decided to create 2 coloumn template with the mainbar on the left and the sidebar on the right.
for the position you can change it in the HTML section like i explained in the last article,if you forget where is the HTML section ,it is below this code


]]></b:skin>


the first in the HTML section is the javascript you can input in your template(inside the Head tag but below the code above) and the body tag after that,this is where we can configure our boxes.for example i will using my violet rose template script(you can download it here).the Violet rose is 3 coloumn template type with mainbar on the center and the sidebar on the left and right.
first in the body tag is the header script,i will skip this because this time i will teach you to configure your mainbar and sidebar,so skip the header script until you found this code


<div id='content'>

<div id='crosscol-wrapper' style='text-align:center'>

<b:section class='crosscol' id='crosscol' showaddelement='yes'/>

</div>
.
.
.<!-- This is where the mainbar and sidebar script -->
.
.
</div>


in the violet script i named the center with "main-wrapper",left side with "sidebar-wrapkiri" and right side with "kanan",so the position itself depends where you put the code,for example if you put the "main-wrapper" first, means the mainbar will be located on the left,but if you put it(the "main-wrapper") after "sidebar-wrapkiri" the mainbar will be located on the center ,in this HTML section the code you input will be located from the left to the right.example:
if you put the "main-wrapper" first,"sidebar-wrapkiri" second ,and "kanan" last

[Mainbar][sidebar1][sidebar2]

if you put the "sidebar-wrapkiri" first, "main-wrapper" second ,and "kanan" last

[sidebar1][Mainbar][sidebar2]

if you put the "sidebar-wrapkiri" first, "kanan" second ,and "main-wrapper" last

[sidebar1][sidebar2][Mainbar]

if you delete one of the code,"kanan" for the example,your template will be 2 coloumn, thats how it works....
the question is...will be the naming still the same if we're using other script??
the naming depends on who created the script itself,but don't worry because you only need to found the content script,it's not to hard to find it,many script creator usually name it with "content" so don't worry ,you'll find that code.
ah yes...this trick you can use for the the page structure,you can move it as you wish,for example you put the header code after content and footer script then the header will be located below content and footer,but i think it's not the header anymore if the position like that :D

I think thats enough for the positioning,next time i will teach you how to added new box with two different style,so keep in touch okay...

To be Continued.....




18 comments:

  1. pertamaxx :)

    nice info friend

    ReplyDelete
  2. Yup. . I've done do that to my blog.
    Thats really cool :D

    ReplyDelete
  3. Hmmm, nice to try...
    Thx for Ur tips :)

    ReplyDelete
  4. gile brow bagus banget tampilan sitex...
    mkasih infox ya... :)

    ReplyDelete
  5. Thank's for shareing Nice Topic bro..., sukses ya...

    Iwan Tanjung

    ReplyDelete
  6. Nice topucs for discussion....thx for info my new friend....i luv ur blog full
    visit me at http://hero-bussiness.blogspot.com/ or click Here

    ReplyDelete
  7. Ive come friend !

    blogwalking ,dont forget to follow my blog okay?

    ReplyDelete
  8. was here again my friend..happy monday ;)

    from:-
    ROKOKSALEM

    ReplyDelete
  9. Info baguu....
    Tapi aku tertati-tatih ni bc postingnya...
    bahasa Inggris...

    Diary Osi

    ReplyDelete
  10. Thank's for shareing Nice Topic

    Diary Osi

    ReplyDelete
  11. hehe aq malah nyulik theme blogspot trus tak pasang di script blog bikinan ndiri, byuh puyeng juga sih ngatur posisinya 8-}

    ReplyDelete
  12. @All
    thx for you responds my friend :)

    @Ramuni
    hmm...klo untk them blogspot byasanya nama variabelna spt content,content-wrapper,sidebar,sidebar-wrapper dll yg nandain script mainbar ato sidebar itu sndiri
    tnggal pndah2 aj bro sesuai ptunjuk d ats

    @KOKO9LOVE
    hahaha...maap y bro klo ngerepotin soalnya sy jg skalian lthan bhs.inggris ne yar lbh mantep g2 :D ..mngkin bro bs gunain bantuan translate widget d atas:)

    @ARYA CREATOR
    thx...neh lg mempersiapkan template terbaru
    cm ms ad error d scriptnya jd lum bs d publish...d tnggu aj :D

    ReplyDelete

.