Senin, 16 Desember 2013
Hallo,
Kali ini gue mau ngasi sedikit Cara Membuat Template Blog Sendiri dengan Artisteer. Artisteer adalah aplikasi untuk membuat template yang bisa diekspor ke berbagai platform blog, contohnya blog gue ini, buatan gue pake artisteer Cara buatnya sih sebenernya gampang banget, tinggal milih model template yang kita suka terus tinggal setting sedikit warnanya.
Untuk memperbesar gambar-gambar di bawah ini, klik aja gambarnya ya.
Untuk memperbesar gambar-gambar di bawah ini, klik aja gambarnya ya.
Pertama, buka dulu website artisteer (http://www.artisteer.com). Lalu pilih menu download. Klik tulisan can be downloaded by clicking here.
Setelah download selesai, instal seperti menginstal program pada biasanya.
Buka aplikasi artisteer, pilih Try Standard Edition *Perlu diingat, karena kita memakai versi trial, pada hasil akhir, semua ikon akan diberi watermark trial, oleh karena itu, lebih baik kita tidak memakai ikon apapun*.
Pada tampilan awal, kita bisa memilih tempate yang akan kita edit, bisa memilih Blank Template atau memilih template yang sudah ada (tinggal di edit sedikit).
Gue akan beri contoh membuat template dari Blank Template. Seandainya lo bingung cara mendesainnya, pilih Suggest Design di sebelah kiri atas. Suggest Design berfungsi untuk memberikan desain-desain yang sudah ada pada artisteer. Klik terus Suggest Design sampe lo menemukan desain template yang cocok.
Misalnya desain ini yang akan gue edit.
Mulailah mengedit dari menu Layout.
Pada menu Layout ini kita bisa mengatur Design Layout (pilih sendiri sesuai selera).
Memilih lebar header, Sheet Width atau Page Width (gue rekomendasikan Sheet Width aja).
Selanjutnya di menu Layout ada pilihan Menu, Footer, Sheet Width, Margin, Padding, Column Width, Column Style, Margin, Widgets, dan Blocks. Lo bisa bereksperimen sendiri dengan pilihan-pilihan tersebut. (Gue memakai lebar kertas/Sheet Width 1000 pixels).
Setelah menu Layout selesai, mulailah mengedit dari menu Header
Pada menu Header ini juga terdapat berbagai banyak pilihan, lo bisa bereksperimen sendiri dengan pilihan-pilihan ini. Lo bisa mengatur tinggi header (tinggi header gue 300 pixels).Lo bisa mengupload gambar header lo sendiri (tentunya dengan gambar yang seukuran dengan header lo, misalnya gue pake lebar header 1000 pixels dan tinggi header 300 pixels, berarti ukuran header gue 1000 x 300 pixels). Lo juga bisa mengubah jenis font untuk judul dan slogan blog lo.
Untuk pilihan Controls pada menu Header sebaiknya tidak usah dipakai, karena seperti yang gue bilang sebelumnya, jika kita menggunakan artisteer versi trial, semua bentuk ikon ketika dieksport nanti akan bertanda trial.
Selanjutnya kita mengedit pada tab Menu. Lagi-lagi lo mengedit sesuai selera lo aja. Gue akan memberikan gambarannya.
Pada tab Menu, lo bisa mengganti model menu di template. Lo juga bisa mengganti warnanya pada pilihan Active (menu yang sedang aktif dalam blog), Passive (menu yang sedang tidak dipilih), Hovered (menu yang tidak dipilih tapi sedang disorot oleh kursor mouse).
Jika lo mau buat menu lo ada submenunya (menu bisa turun ke bawah), lo edit aja bagian Levels, Submenu Area, Subitem. Tapi kalo lo gak mau ada submenunya, pilih Show Menu in Pages dan hilangkan ceklist di Subpage 1, Subpage 2, Subpage 3. (saran : ga usah menggunakan submenu karena pada edit HTML nanti agak rumit).
Selanjutnya pada menu Background. Pada menu ini lo bisa mengubah warna background, memberi pola pada background, ataupun mengupload background lo sendiri (saran : gunakan warna soft dan polos pada background agar loading blog tidak berat dan tidak membuat mata pembaca sakit).
Setelah itu, kita akan mengedit bagian Content atau isi dari blog. Di bagian ini agak rumit, tapi setelah lo coba-coba sendiri pasti mengerti.
Yang perlu digaris bawahi dalam mengedit Content adalah jangan lupa mematikan semua fungsi ikon, inget kita menggunakan versi trial, jadi semua ikon bakal bertanda trial. Matikan semua fungsi ikon pada Quote, Bullets, Headline, Post Header, dan Post Footer. Selebihnya lo bisa ngedit sesuai selera lo.
Tambahan penjelasan untuk edit Content. Pilihan Hyperlink berguna untuk mengubah warna pada link di content blog. Pilihan Quote berguna untuk mengubah warna qoute (tanda kutipan) pada blog.
Setelah edit Content selesai, selanjutnya kita akan mengedit Blocks. Blocks adalah sidebar (widget pada blog). Lo bisa coba-coba setiap pilihannya. Jangan lupa pada bagian Bullets fungsi ikonnya dimatikan.
Terakhir adalah edit Footer. Lo bisa bereksperimen sendiri. Jangan lupa pada bagian Bullets fungsi ikonnya dimatikan.
Tambahan untuk mengedit Controls. Pada gambar yang diberi kotak merah di bawah adalah fungsi untuk mengedit tulisan Read More atau Baca Selengkapnya pada blog. Kita bisa mengedit warna huruf, dan lain-lain.
Jika kira-kira sudah selesai, kita Export template yang telah kita edit sesuai dengan platform blog kita. Ingat, seteah export selesai jangan tutup dulu Artisteernya, karena dalam versi trial, Artisteer tidak bisa di save.
Untuk mengupload template yang sudah dibuat ke blog, masuk ke Dashboard Blogger, pilih Template. Lalu pilih Unduh Template Lengkap untuk membackup template yang ingin diganti. Setelah mendownload template yang ingin diganti, pilih Choosen File, cari file yang telah kita Export dari Artisteer tadi (filenya bernama "Main". Lalu klik Unggah.
Template buatan lo udah jadi. Kalo dirasa masih ada yang kurang, lo bisa edit lagi di Artisteer yang belum ditutup tadi, lalu Export dan Upload ulang. Bisa diliat bahwa header pada template baru tidak ada. Lo harus memasukkannya secara manual melalui edit HTML.
Sebelum edit HTML, lo harus upload gambar header lo (ukuran gambar header harus sama dengan ukuran header, ukuran header gue 1000 x 300 pixels, gambar gue juga berukuran 1000 x 300 pixels. Kalo gak sama, gambar tidak akan pas di tengah-tengah header) di hostingan gambar gratis (gue upload di imageshack, kalo belum punya akunnya daftar aja dulu). Setelah lo upload gambar header di imageshack, lo bakal dapet link dari gambar itu. Copy link itu.
Kemudian lo balik lagi ke Dashboard Blogger, pilih Template, kemudian pilih Edit HTML. Pada halaman Edit HTML, klik sembarang mouse di dalam kotak kode HTML, kemudian tekan CTRL + F. Pada kotak pencarian ketikkan background-image. Hasil pencarian akan menunjukkan 3 hasil, copy link gambar header yang udah lo copy tadi seperti yang ditunjukkan gambar di bawah. Inget, linknya berada di luar tanda petik ('_'), contoh 'linkgambarlo'.
Selesai, pilih Simpan Template.
Nih ada video tutorialnya, tapi mohon maaf suaranya gak jelas soalnya mikrofon gue agak rusak :
Oke, sekian postingan kali ini mengenai Cara Membuat Template Blog Sendiri dengan Artisteer. Kalo ada yang mau ditanyain, silakan komen di bawah ya. CIAO!
Langganan:
Posting Komentar
(Atom)
Postingan Paling Hot! Nyesel Kalo Gak Baca
Postingen Paling Laris!
-
Hallo, Pada tulisan di blog Kiting kali ini, gue akan memberikan tips : Mau Beli Honda CB150R Streetfire ? Baca Ini Dulu ! Kalian pa... -
Hallo, Kali ini gue mau ngasi sedikit Cara Membuat Template Blog Sendiri dengan Artisteer . Artisteer adalah aplikasi untuk membuat templ... -
Hallo, Pada postingan kali ini gue bakal bahas Be a Good Trafficers, Be a Good Citizens . Citizens di sini bukan fans clubnya Manchester ...
ane prnah main sih artisteer, cuma ga sampe dipake templatenya buat blog :"
BalasHapusini templatenya blog ini bikin sndri ya?
iya pake artisteer hehe
Hapuswah baru denger nih... bisa dicoba buat ngutek-ngutek template blog lagi nih... oiya.. salam kenal ya, gue jga anak BE.. tapi jarang nongol.. HEhe
BalasHapusiya hehe, salam kenal :)
Hapusgue lebih suka ngedit langsung pake script. lebih greget aja, menantang pula heheheh. disana bisa nambahin java, css atau html5 gitu ngaaa. terus halaman home sama halaman post nya gimana bedainya.
BalasHapusitu cuma pake laman doang di dashboard blogger, otomatis nama jadi menu sendiri kalo udah jadi :)
Hapusaku mau tanya ini bisa dipake buat header ga?? soalnya pengen bikin header sendiri tp ga tau caranya -_- kalo template masih demen download aja hihi, tp makasih loh infonya kapan2 mau nyoba deh kalo kuota lgi banyak,habis harus download dulu sih -_-
BalasHapusmaksudnya buat header pake tombol yang bisa dipencet? sebenernya bisa, tapi kalo versi trial nanti gambar tombolnya ada tulisan trial. atau pake aplikasi lain namanya dreamweaver :)
Hapusapakah ini masih menggunakan bahasa HTML dalam pengeditannya?? saya sebenarnya mau nyoba dan baru tau infonya he..he.. moga moga saya sukses dalam editannya aamiin..
BalasHapusdalem pengeditan tempalte engga sama sekali, cuma milih warna dan style nya aja kok :)
Hapuskecuali pas mau masukkin gambar header, cuma edit dikit kok, simple :)
Belum mengerti, tapi nanti kapan2 dicoba deh :D
BalasHapusemang mesti dicoba biar ngerti, simple banget kok caranya :)
HapusAduh ini bahasa pemrograman apa gimana..
BalasHapusBanyak yg mau gue tanyain tentang ngdit tamplate blog, tapi gue bingung. Mau yg mana dulu hahaha
Ntar gue coba sendiri ajah ahh.. Skalian liat tut-nya di youtube
engga, cuma milih milih warna sama style doang kok, gampang :)
Hapusmending coba aja sendiri biar lebih tau ;)
gue juga pernah pake software ini, cuman masih banyak yang kurang menurut gue.
BalasHapusapa tuh kekurangannya kalo boleh tau?
Hapusemang sih semua aplikasi pasti ada kekurangannya hehe
pengen diibikinin *manja :P
BalasHapusbayar berapaa? ahaahha
HapusWihh thanks ya, tutorialnya keren nih :)
BalasHapusyohaa sama sama :))
Hapushehehehehe bagus men, tapi gue biasanya download dari web terus gue edit sendiri pake edit html :D.
BalasHapusiya, tapi kalo ini kan kita bisa berkreasi :p
HapusWihhh ini nihh ilmunya banyak banget..
BalasHapusmuehehe makasih bang kiting
sama sama B) lunasa ya janji gue hehe
HapusMANTAB!!!
BalasHapusKunjungi balik ya.. :)
Eh, ini blognya udah bisa di buka Bang? hehehe. Jadi berminat nih bikin template sendiri. Biar lebih so sweet gitu hadiah buat blog hahaha.
BalasHapusudah, bisa sendiri gitu aja haha
Hapusiya monggo coba buat ;)
Nice post. Meskipun gue programmer dan proyek gue berhubungan dg html,css,jsp,dan php. Gue ga bener-bener ngerti cara bikin tema sendiri dari awal. Keren
BalasHapusmehehe, ayo coba bikin pake artisteer :)
Hapusoke, boleh di coba nih. selama ini aku ga pernah pake template bikinan sendiri, selalu cari gratisan haha. Thanks infonya :)
BalasHapushahaha, ayo ayo dicobaa :))
HapusWiih nice, lebih mempermudah memahami pembuatan dan edit template blogger.
BalasHapusGue pernah nyoba juga pake corel web creator, tapi lebih ke situs professional, jadinya, malah ribet buat blogger :|
iya haha, simple banget kok caranya :)
Hapusiya, yang ini simple banget, mudah buat blogger :)
HapusOke Ting, walopun terlihat rumit buat orang gaptek macam gue, gue bookmark biar lusa kalo ilmu gue udah tinggian ntar gue amalkan yak biar blog gue makin asoyy yak Ting!!
BalasHapuskeren amat dah lu yak bisa bikin tutorial sampe banyak bingit gini detail amirrr...bagus!
hahaha, silakan CTRL+D deh haha, makasih yaa, pasti bermanfaat :P
BalasHapusWah niat banget ini ...
BalasHapusKalo gue sih .. Belum perlu beginian.. Udah cocok sama template yang sekarang..
Haha
Wah niat banget ini ...
BalasHapusKalo gue sih .. Belum perlu beginian.. Udah cocok sama template yang sekarang..
Haha
muehehe, selera masing-masing juga sih :p
Hapusgue pernah nyoba bikin pake artister ini, cuman waktu itu dapetnya trial. dan hasil templatenya nggak bisa gue custom manual lewat blogger-nya. makanya gue jadi bingung. untung lo kasih link downloadnya hehe
BalasHapusgue coba lagi deh :D
monggo dicobaaa :p
Hapusini linknya trial juga toh?
Hapusiya trial, tapi banyak kok cracknya :)
Hapuswih, keren banget. download softwarenya ah.. sizenya besar juga ternyata -___-
BalasHapusnice tips broh! bikin tutorial bermanfaat lagi yaaa
iyaa, 100 megaan haha. sip sip, tunggu aja yaa hehe
Hapuswah bagus nih tips bagi gue yang jarang ganti template karena gaptek huhu --
BalasHapushaha belajar aja dikit dikit mas hehe
Hapuswah tips bagus nih bagi gue yang jarang ganti taplet karena gaptek :(
BalasHapusaku udah pernah bikin pake artisteer. Susah buat nge-modif script yang kepanjangan dan gajelas alurnya...
BalasHapustapi enak kalo mau diedit secara visual dan ganti2 warna plus layout..ahaha
iya kalo scriptnya emang beda, tapi kalo buat tampilan keren emang haha
HapusDulu pas masih di hosting sendiri, sering bikin tema wordpress pake artisteer ini.
BalasHapusiyaa bagus kan hehe
Hapuswoooo jadi ini intinya cuman buat otak atik style doang gitu ? lebih simpel dari dreamweaver sih, dulu waktu mash kelas 1 smk, bisa bikin web dari dreamweaver itu udah seneng banget lo hahahaha *curhat*
BalasHapusiya memang hehe, dreamweaver lebih rumit, kalo buat pemula mending pake ini :)
Hapusgue gagal cui... *nangis
BalasHapusahhh cupu nih hhaha
Hapusoke boleh dicoba nih.
BalasHapussaya pemula dan harus mencoba semuanya :D
sama, gue juga pemula, coba coba berhadiah haha
Hapuswah bagus nih tutorialnya, patut dicoba. Btw, artistteer, itu apa sih bang ? hehe
BalasHapusartisteer itu aplikasi buat bikin template blog hehe
HapusMaaf Kiting.. baru sempat ninggalin jejak.nih.n saya baru tahu kalau ada app buat header gtu.. infonya mrnarik lhooo
BalasHapushaha, dicoba dicoba biar tau lebih hehe
Hapuswow mantaaaaaaap gan dan terimakasih informasinya jadi bisa belajar buat template sendiri neh izin bookmark dan nemplok. salam kenal dari nubi yg lagi jalan jalan dan mengharapkan kunjungan balik agan yg ganteng di tutorialbelajarseoblog
BalasHapusinfo yang menarik dan mudah di pahami. saya bisa memperaktekkan info dari anda ini dengan mudah. Terimakasih
BalasHapuszie's for you - JalanJalan | Berkunjung | Silaturahmi
Terima kasyih kyevin. Blognye bagus mwehehe.
BalasHapusmakasih banget nih tutorialnyaaaa
BalasHapusberhasiiilll... \( ^,^ )/
eh mas mas.. tapi kok widget followers G+ ga bisa muncul ya? emang ga support ato gimana?
BalasHapuskok blog yang udah ane buat dan udah ane pasang tp ga sama ama yang ane buat sebelumnya ya ??
BalasHapuskok ga keluar apa2 ??
mohon bantuannya bang..
iya gan sama.... malah jadi eror blog gue
Hapusjadikan aku muridmu master
BalasHapusgan cara menghubungkan ke database mysql ke artisteer-nya gmn? ane buat databse SQL di navicat.
BalasHapushelp me suhu.....
Abang tangkyuuu berat niihh..
BalasHapusgak pusing dengan kode html lagi...
Woow, ini dia yang cari, terima kasih atas postingannya ...
BalasHapuswaah.. bagus postx bos, kebetulan lg mau buat template sendiri nih.. thanks bos..
BalasHapustrialnya berapa lama gan?
BalasHapusDi Bookmark Dulu :D
BalasHapusBro file yg bagian mana di upload ke blognya??
BalasHapusThankz mas bro infonya berguna banget, ane juga mw coba dech
BalasHapusDari emang pengen banget bisa bisa template blogger sendiri
terimakasih infonya,tapi kok kategori nya gak muncul ya
BalasHapusmakasih gan infonya
BalasHapusmakasih gan infonya salam blogwalking
BalasHapusThx Bro .... Infonya menarik banget. Izin copy buat dokumen pribadi gue ya ....
BalasHapusSaya praktekin dulu sob, thank's for share ...
BalasHapusSy coba dulu brow, makasih buat infonya, kapan" kunjungi blog ku juga http://galihthyo.blogspot.com
BalasHapusmantaps nih catatannya,..
BalasHapusmampir di catatan saya jga ya gan.
http://catatansaif.blogspot.com/
dicoba gan
BalasHapussilahkan mampir farhan2995.blogspot.com
waktu unggah template gabisa gan, ada pesan 'Kami tidak dapat menyimpan template Anda.
BalasHapusTemplate Anda tidak dapat diuraikan karena template tidak terbentuk dengan baik. Pastikan semua elemen XML ditutup dengan benar. pesan kesalahan XML:
The element type "link" must be terminated by the matching end-tag ""'
maksudnya gmn itu gan?
Gan ini gimana kok muncul gini.
BalasHapusKami tidak dapat menyimpan template Anda.
Template Anda tidak dapat diuraikan karena template tidak terbentuk dengan baik. Pastikan semua elemen XML ditutup dengan benar. pesan kesalahan XML:
The entity "nbsp" was referenced, but not declared.
Komentar ini telah dihapus oleh pengarang.
BalasHapusthanks mas tapi punya saya msh brantakan yaudah pakai template biasa aja :D
BalasHapuskunjungi ya audreydevineir.co.uv
cobaa ahh :v
BalasHapuskok gak bisa ya (?) padahal udah download 2 kali pas mau di instal kagak bisa , gmn itu :3
BalasHapusThanks Atas infonya gan !!
BalasHapusKalo minta tolong bikinan sama bang kiting boleh gak ?
BalasHapussaya berani ngebayar deh
Wah infonya sangat bermanfaat sekali gan. izin nyimak ya gan dan jangan lupa update terus artikelnya. Oh iya sob, kapan-kapan saya akan mampir lagi jika ada waktu luang. hehehehehe. jangan lupa di update terus ya blognya. salam kenal.
BalasHapusCara Menerapkan Template Johny Wuss
Thanks.
thank you banget bang
BalasHapusMakasi buat infonya, bermanfaat banget dan langsung saya terapkan di blog baru saya guskum.blogspot.com
BalasHapusJangan lupa mampir-mapir.. hehehehe
http://android-apk27.blogspot.com/
BalasHapusada yang full versi gak mas ??
BalasHapushttp://sukasukaandroid.blogspot.com
BalasHapushttp://cara-rifqi.blogspot.com/
BalasHapusmantab banget sob tutorialnya...
BalasHapusMakasih yah gan, ane cobak dulu yah gan caranya
BalasHapuswww.sebarbrosursurabaya.com dan www.jasaseowebprofessional.com
#sebarbrosur #sebarbrosursurabaya #jasasebarbrosursurabaya #jasasebarbrosur
kok aku selain header, sidebar sama backgroun gak keluar ya? padahal itu aku gak dari appsnya, tapi bikin sendiri
BalasHapusMakasih infonya bro..BTW,,gue juga kriting.. hehehe
BalasHapuskapan" ke blog gue ya bro... everuday.blogspot.com
SALAM KRITING
Saya nyob tapi knpa hasilnya beda dengan apa yang ada di aplikasinya, tolong di informasikan kepada saya di musafirmudaislam@gmail.com
BalasHapus