Cara Membuat Minisite Dengan Blogger.

Langkah Demi langkah untuk mengubah blogger menjadi minisite.

Seperti yang saya janjikan dulu disini, kali ini saya tunjukkan bagaimana saya mengubah template blogger menjadi minisite. Jika anda ikut step by step cara ini, saya pasti anda akan berjaya membuatnya juga. Terlebih dahulu, saya meminta maaf kerana lambat untuk membuat artikel ini. Baiklah, anda ikut step ini.

  1. Anda buat satu blog baru.
  2. Anda pilih template minima.
  3. Anda pergi ke edit HTML kemudian terus klik pada kotak expand widget.
  4. Kemudian anda cari code seperti ini :

    <b:includable id='main' var='top'>
    <b:if cond='data:blog.pageType == "item"'>
    <!-- posts -->
    <div class='blog-posts hfeed'>
    <b:include data='top' name='status-message'/>
    <data:adStart/>
    <b:loop values='data:posts' var='post'>
    <b:include data='post' name='post'/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:include data='post' name='comments'/>
    </b:if>
    <b:if cond='data:post.includeAd'>
    <data:adEnd/>
    <data:adCode/>
    <data:adStart/>
    </b:if>
    </b:loop>
    <data:adEnd/>
    </div></b:if>



  5. Anda tambah code yang bewarna merah pada code tersebut, buat seperti yang ditunjukkan.
  6. Kemudian cari code seperti ini pula :

    <div class='feed-links'>
    <b:if cond='data:blog.pageType == "item"'>
    <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>
    </b:if>
    </div>



  7. Anda tambah code bewarna merah seperti saya buat itu.
  8. Kemudian save template anda. Selepas itu anda klik semula kotak expand widget supaya kotak expand widget tidak ditandakan centang.
  9. Kemudian cari pula code ini :

    <div id='sidebar-wrapper'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:section class='sidebar' id='sidebar' preferred='yes'>
    <b:widget id='Followers2' locked='false' title='Followers' type='Followers'/>
    <b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'/>
    <b:widget id='Profile2' locked='false' title='About Me' type='Profile'/>
    </b:section></b:if>



  10. Anda tambahkan juga code bewarna merah kedalam code tersebut.
  11. Kemudian cari code ini pula dan padam code ini :

    <div id='header-wrapper'>

    <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
    <b:widget id='Header1' locked='true' title='Blog Test Template (Header)'
    type='Header'/>
    </b:section>
    </div>



  12. Kemudian cari code ini :

    <div id='content-wrapper'>
    <div id='crosscol-wrapper' style='text-align:center'>
    <b:section class='crosscol' id='crosscol' showaddelement='yes'/>
    </div>



  13. Anda perhatikan showaddelement, anda tukar kepada yes.
  14. Sekarang selesai mengedit template blogger.

  15. Tetapi belum siap lagi minisite anda. Sekarang ini anda buka template minisite anda, anda copy semua code template tersebut. Kemudian anda pergi ke pageElement, dan anda ADD HTML/JAVA dan anda masukkan code minisite.

    Pastikan semua ga,bar yang digunakan untuk template minisite sudah di upload ke web hosting. Jika tiada hosting sendiri, anda boleh menggunakan web yang menyediakan perkhidmatan image hosting secara percuma. Setelah di upload, anda tukar code URL gambar di template minisite tersebut dahulu. Kemudian barulah dimasukkan ke page element.

    Untuk background, anda boleh tukar, caranya anda pergi ke edit HTML, kemudian cari code seperti ini :

    body {
    background: url(http://URL gambar background anda);
    margin: 0;
    padding: 0px;
    font: x-small Verdana, Arial;
    text-align: center;
    font-size/* */:/**/small;
    font-size: /**/small;
    }


    Anda masukkanlah URL image BG anda. Kemudian save template anda. Selesai. wah, dah penat ni buat artikelnya. harap2 menjadi semua ya.. selamat mencuba.

    p/s: Jika anda malas hendak membuat minisite sendiri, saya boleh bantu, baca disini



36 comments:

  1. huhu tq tq, informasi yg ditunggu2

    ReplyDelete
  2. to N ;
    sama2.. penat jugak buat tutorial nih..

    ReplyDelete
  3. tq..sy dah test buat separuh jalan je. sy tersangkut kt cni

    ''Tetapi belum siap lagi minisite anda. Sekarang ini anda buka template minisite anda, anda copy semua code template tersebut. Kemudian anda pergi ke pageElement, dan anda ADD HTML/JAVA dan anda masukkan code minisite''

    copy semua code template tersebut...code yang mana yer?? x paham yg tu. harap membantu tq

    budak br blajo,

    1001rahsiadiri

    ReplyDelete
  4. code yg diambil dalam Microsoft Frontpage agaknya..??

    ReplyDelete
  5. to cyclotron ;
    betul kata N, code yang dimaksudkan adalah code dari front page. template minisite tersebut kita edit dahulu menggunakan front page, kemudian kita ambil semua codenya dan masukkan di page element.

    ReplyDelete
  6. hmm,sampai step ke 8,ada error bila nk save..cmne tu??rasanya kod dah diletakkan cam yg disuruh

    ReplyDelete
  7. to N ;
    ada error?? semalam saya buat xde pula, semalam sy buat artikel ini terus menerus ketika mencubanya di blog yang lain.

    cuba check balik.. jika saya salah dimana-mana, tlg betulkan ya.

    ReplyDelete
  8. saya ada error disini
    We were unable to save your template
    Please correct the error below, and submit your template again.
    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: The element type "div" must be terminated by the matching end-tag "
    ".

    ReplyDelete
  9. to sir ilzam ;
    error "div" yang membuatkan template 2 xbleh nak save. mesti ada code yang tersalah letak.. tengok balik betul2 buat perlahan-lahan.

    ReplyDelete
  10. saya sudah buat.. semua okey.. yang jadi prob pada sy skang adlah sata edit xpakai front page.
    ada x front page untuk sy download? thank.. awak banyak membantu

    ReplyDelete
  11. to sir ilzam ;
    front page sy xtau mane nak download. try la cari kat mane2..

    ReplyDelete
  12. saya dah berjaya buat sebagaimana tutorial ni...terima kasih banyak2x kepada bro soleh...

    tapi satu jer masalah....bila saya bukak pakai firefox semua ok,tapi bila pakai IE,sumer tulisan ke tengah,jadi tak elok dan kemas...

    itu kena edit css plak ker?saya check ada yg kata kena tahu coding css....

    harap dapat membantu...

    tq

    ReplyDelete
  13. to engenius ;
    sama2, emm, ade masalah ya, sy xpasti pula sebab contoh yang saya buat elok sahaja pada ketiga2 jenis browser.. IE ni memang dari dulu ade masalah.

    Cuba lihat contoh yang saya buat ni http://free-template.solehpolysas.com

    ReplyDelete
  14. to miss ;
    ya.. u r welcome..

    ReplyDelete
  15. Belum try. Kena ada frontpage dulu kah? Mula2 buat blog dulu saya guna blogspot(bs) tapi bila nak buat static pages tak reti saya guna wp. Saya lebih selesa pakai bs kalau yang ni jadi saya update balik blog kat bs tu.

    ReplyDelete
  16. to makcik ;
    kalau ade front page lebih mudah untuk setup template minisite. Yang ni menggunakan blogspot. so WP memang sy xbuat.

    ReplyDelete
  17. saya x phm no. 14 tu
    boleh trgkan satu persatu no. 14 tu??

    ReplyDelete
  18. to hakim ;
    better buat minisite betul menggunakan hosting sendiri.. ianya lebih mudah.. mcm makan kacang jer.. :P

    ReplyDelete
  19. salam solah,
    sy dah try buat.tapi tersangkut dekat no 14 tu..
    kat mana nk ubah code url minisite tuh?
    mintak tolong yer..
    thanx..

    ReplyDelete
  20. to amniumairah ;
    pastikan template minisitu tu u ada,
    kemudian buka menggunakan perisian microsoft front page atau sebagainya untuk mengedit template minisite.

    Perisian yg percuma, u cari di google search " NVU download ".

    ReplyDelete
  21. saya dh buat. tapi tak faham..blh solah tgk blog ni..www.panduanmailinglist.blogspot.com. blh bgtau masalah kt mana. thanx..

    ReplyDelete
  22. Tq..info yg sgt berguna. Ade satu ebook berbayar yg mngajar kite menjadikan blogspot sbg minisite. tetapi saudara telah mngajar secara percuma. jutaan terima kasih diucapkan.

    Happy New Year

    ReplyDelete
  23. to aminumairah ;
    masalah tu pada kelebaran blog tersebut. cuba setting width blog tu, cuba besarkan lagi.

    to no scar ;
    cara sy ini mungkin tidak details sangat seperti ebook tersebut, tp jika pandai ubah suai lg sikit, semuanya menjadi.. cubalah..

    ReplyDelete
  24. Untuk code saya tidak mengalami masalah, hanya saja saya menggunakan office enterprise 2007 yang tidak ada frontpage, jika menggunakan dreamweaver bisa nggak? thanks, salam dari indonesia

    ReplyDelete
  25. to Luxury ;
    bisa aja.. silakan...

    ReplyDelete
  26. nk mudAH korang boleh dapatkan minisite yang dah siap just copy and paste jee koding minisite yang akan saya bagi ke laman blog korang..x yah pening2 nk edit coding...dapatkan kat sini http://www.oneminisite.co.cc

    ReplyDelete
  27. wow!!!

    Minisite emang sangat mantabs pak....!!!

    ini dobrakan yg dahsyat untuk bisnis internet dengan minisite! josss

    ReplyDelete
  28. pening sikit..
    tapi bagus sangat

    ReplyDelete
  29. saya mendapati error setelah save tamplate

    ReplyDelete

  30. Thanks for this information your article is very useful
    pleas share your more information about this topic again
    my website talking about home improvement you can visite it from this url

    عزل حراري
    عزل مائي

    ReplyDelete

Blog ini telah menggunakan do follow untuk link komen anda. Link anda akan tersenarai di search engine.