Minggu, 05 Mei 2013

Tutorial Joomla : Membuat Menu Drop Down Joomla

0 komentar
Dalam pelajaran joomla kali ini, saya ingin memberikan tips Joomla! untuk membuat menu drop down. Jika Anda telah menguasai cara membuat menu beserta membuat menu items pasti tidak sulit untuk anda membuat menu drop down ini. Om Joomla memang telah menyediakan cara langsung untuk membuat menu drop down ini tanpa harus Anda membuat javascript atau kode-kode html terlebih dahulu. Mengasikkan bukan ?

Jika anda membuat menu drop down (biasanya pada bagian top menu), hanya dengan mengarahkan cursor anda pada top menu tersebut , maka secara otomatis akan keluar pilihan submenu-submenunya. Pembuatan menu drop down dapat berdasarkan logika berikut.

Section >>> Category >>> Article
Section >>> Category
Section >>> Article
Category >>> Article

Cara pembuatan menu drop down termasuk dalam cara membuat menu items atau mengisi content menu yang sudah saya tulis dalam tutorial Joomla saya sebelumnya. Untuk lebih memahami pembuatan menu drop down ini, anda bisa pelajari terlebih dahulu tutorial joomla sebelumnya disini.

Langsung saja, caranya sebagai berikut :
  • Login CPanel Joomla anda.
  • Pada CPanel Joomla anda, Pilih menu manager atau langsung pilih menu mana yang ingin dibuat drop down (biasanya top menu). 
  • Klik New.
  • Pilih article > Section.
  • Muncul kotak isian nama dan isikan sesuai nama yang ingin anda munculkan. Misalnya Tutorial Joomla.
  • Pada pilihan parent item, Pilih top menu (Jika menu yang dibuat drop down adalah top menu).
  • Klik Save. Kemudian Klik New kembali.
  • Pilih article > Category blog layout.

  • Isi kembali kotak isian nama sesuai keinginan anda. Misalnya Tips Joomla
  • Perlu diingat, karena membuat drop down, pada pilihan parent item, pilih "Tutorial Joomla" yang sebelumnya sudah dibuat.
  • Klik Save. Jika anda Ingin membuat banyak kategori bisa lakukan dengan cara yang sama.
  • Terakhir kita memasukkan artikelnya, Klik New
  • Pilih article > article layout.
  • Isikan kotak isian nama. dan pilih artikel pada "select article".
  • Ingat, pada parent item pilih"Tips Joomla".
  • Klik Save. Anda bisa memasukkan beberapa artikel sama halnya dengan kategori.
  • Silakan anda lihat hasilnya dengan klik "Preview" di bagian atas kanan. Menu Drop Down anda sudah jadikan ?
Langkah-langkah di atas untuk membuat menu drop down dengan format section >>> Category >>> article. Anda bisa mempraktekkan dengan membuat menu drop down lainnya sesuka hati anda. ^^



Sumber: http://pelajaran-joomla.blogspot.com/2010/02/tutorial-joomla-membuat-menu-drop-down.html
read more

Tutorial Joomla : Membuat dan Mengenal Menu Item Joomla

0 komentar

Dalam tutorial joomla sebelumnya, telah saya jabarkan cara membuat sebuah menu di joomla. Tahap selanjutnya setelah membuat sebuah menu adalah memberikan isi atau content pada menu yang telah dibuat tersebut atau membuat menu item. Jadi dalam artikel kali ini terfokus pada bagaimana cara membuat menu item dari menu baru yang telah dibuat.
Sebelumnya, sedikitnya terdapat 5 type yang bisa dijadikan content sebuah menu yang harus anda mengerti terlebih dahulu.
  1. Artikel. Anda dapat mengisi menu anda langsung dengan sebuah artikel. Jadi saat pilihan dari menu tersebut di klik, maka langsung akan keluar artikel tersebut.
  2. Kategori. Merupakan salah satu content yang berisi beberapa artikel yang tergabung dalam kategori tersebut. Anda dapat memilih tampilan kategori tersebut, jadi saat anda klik kategori tersebut bisa hanya muncul judul artikel-artikel anda dan bisa juga muncul artikel-artikel anda dalam bentuk blog.
  3. Section. Merupakan salah satu content yang berisi beberapa kategori dimana setiap kategori tersebut berisi beberapa artikel. Anda juga bisa memilih tampilan section seperti bahasan kategori sebelumnya.
  4. Frontpage. Content menu yang satu ini biasanya digunakan hanya untuk menu home saja. Karena frontpage merupakan sebuah homepage website kita. Tetapi jangan lupa jadikan home sebagai default menu anda.
  5. Archieve. Dari artinya yaitu arsip merupakan salah satu content yang berisi kumpulan dokumen.
Anda bisa memilih content menu anda sesuai keinginan anda. Dengan memahami konsep pengisian menu di atas anda dapat dengan mudah membuat sebuah menu drop down.
Untuk langkah-langkah mengisi sebuah menu sebagai berikut.
  1. Dari cpanel joomla anda, masuk ke menu manager.
  2. Pilih menu yang ingin diisi kemudian klik edit menu items atau bisa langsung dari menu "menus" pilih menunya.
  3. Klik New, untuk membuat content baru.
  4. Akan muncul beberapa pilihan content yang dapat diisikan.
  5. Pilih "Articles" dan pilih "Article Layout" untuk single artikel.
  6. Kemudian muncul kotak isian title, alias, dll serta select article. Isi saja title dengan judul artikel anda, alias sama dengan title, select article dan pilih artikel yang akan dimasukkan.
  7. Klik Save. Content artikel telah berhasil anda masukkan ke dalam menu anda.

Cara di atas merupakan contoh untuk membuat menu item dengan type artikel. Anda dapat menggunakan type menu item lainnya. Untuk membuat menu item dengan type section maupun kategori, bisa anda pelajari lebih dalam artikel membuat menu drop down karena sudah termasuk dalam materinya.



Sumber: http://pelajaran-joomla.blogspot.com/2010/02/tutorial-joomla-membuat-dan-mengenal.html
read more

Pengenalan Joomla - Apa itu Joomla ?

0 komentar


Joomla! adalah salah satu aplikasi yang digunakan untuk membuat atau membangun sebuah website dinamis yang dilengkapi berbagai fasilitas yang mendukungnya. Joomla! termasuk dalam kategori aplikasi CMS (Content Management System) open source, artinya dapat Anda pergunakan dengan sebebas-bebasnya atau bebas untuk mengoperasikannya. Sejarah Joomla! sendiri awalnya dikembangkan dari aplikasi CMS lainnya yaitu Mambo.

Terdapat 3 hal cakupan dasar yang harus ada untuk membangun website berbasis Joomla!

1. PHP
PHP ( Personal Homepage ) atau yang lebih dikenal dengan sebutan Hypertext Preprocessor merupakan bahasa pemrograman atau scripting yang bersifat server side. Hasil koding atau pembuatan sintaks atau program kode PHP akan dieksekusi oleh webserver dan kemudian akan dikirim dalam bentuk HTML ke browser client. Kode PHP tersebut tidak dapat dilihat oleh pengunjung, melainkan kode HTML yang merupakan hasil eksekusi kode PHP tersebut yang dapat dilihat oleh pengunjung. Untuk mengubah kode PHP tersebut menjadi kode HTML juga diperlukan sebuah aplikasi yaitu Engine PHP. Engine PHP tersebut akan digunakan bersama aplikasi webserver.

2. DataBase
Selain menggunakan bahasa pemrograman atau scripting PHP, Joomla! juga diciptakan dengan menggunakan database MySQL. Database ini akan digunakan untuk menampung data-data Joomla! milik Anda, seperti user, password, dan data-data lainnya. Jika anda ingin download aplikasi MySQL, bisa anda buka http://mysql.com atau klik disini.

3. Webserver
PHP dan database merupakan dua hal dasar yang harus ada dalam membangun Joomla!, tetapi bagian terpenting yang harus ada dalam sebuah website adalah webserver, karena berfungsi sebagai pusat control dari pengolahan data website. Jadi input yang dilakukan oleh pemakai internet akan diolah kemudian dikembalikan lagi kepada pemakainya. Salah satu webserver yang sekarang ini banyak digunakan adalah Apache, karena telah banyak mendukung format file server tanpa perlu tambahan komponen aplikasi lagi. Terlebih lagi Joomla! akan berjalan baik bila menggunakan webserver Apache. Jika Anda ingin download aplikasi webserver, bisa anda buka http://apache.org atau klik disini.




read more

Minggu, 16 Desember 2012

Cara Membuat Buku Tamu Tersembunyi di Blog

0 komentar

Cara Membuat Buku Tamu Tersembunyi di Blog - Cara memasang buku tamu/guest book tersembunyi di blog atau cara agar buku tamu/guest book bisa tersembunyi di blog.
Buku tamu merupakan tempat untuk menaruh pesan singkat di blog anda ketika sedang ada yang berkunjung.  Membuat buku tamu harus menggunakan jasa web yang menyediakan layanan buku tamu. Maksud dari judul tersembunyi disini bukan lah buku tamu yang tidak bisa dilihat oleh pengujung, tetapi buku tamu ini akan berada di sebelah artikel blog yang akan terbuka jika ada yang klik gambar buku tamu tersebut. Langkah ini merupakan salah satu langkah dalam menghemat tempat di blog kita. Selain itu, untuk menghemat tempat, anda juga menambahkan tab view di blog Anda.Sebelum anda membuat buku tamu di blog anda, anda harus memiliki kode buku tamu, anda bisa mendapatkannya di Shoutbox, Cbox, atau Shoutmix. Setelah anda memiliki kode buku tamu tersebut, lanjut ke langkah berikut:

1. Login di blogger dengan ID anda.
2. Klik Tata Letak >> Tambah Gadget >> Pilih HTML/Java Script.
3. Lalu Copy kode berikut dan Pastekan Pada kotak HTML

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

< Letakkan disini kode Shoutbox Anda>

<div style="text-align: center;"><span style="font-size: 10px;"><span style="font-family: &quot;Trebuchet MS&quot;,sans-serif;">Supported by <a href="http://amronbadriza.blogspot.com/" target="_blank">Blogaul</a></span></span></div><div style="text-align:right"><a href="javascript:showHideGB()">
[tutup]
</a>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div>

Ganti tulisan < Letakkan disini kode Shoutbox Anda> dengan kode script buku tamu sobat.
4. Save Widget tersebut.

Jika langkah tersebut sudah anda lakukan, anda dapat melihat hasilnya pada blog anda masing-masing. Demikianlah cara memasang buku tamu tersembunyi ini, semoga bermanfaat.



read more

Cara Membuat Like Box Facebook Tersembunyi

0 komentar
Cara Membuat Like Box Facebook Tersembunyi. Pengguna facebook kian bertambah banyak, hal ini memungkinkan kita para blogger untuk mempromosikan blog melalui sosial media facebook ini. Bagi yang sudah memiliki fans page di facebook pasti sebagian besar para blogger sudah memasang like box yang sudah disediakan oleh facebook.

Nah tampilan like box dari facebook ini pun sudah menarik menurut saya. Tetapi mungkin ada sobat blogger yang kebingungan mencari tempat untuk memasang like box fans page facebooknya karena di blognya sudah banyak terpasang widget. Tenang sob, sobat bisa menyembunyikan kotak like box fans page facebook sobat pada blog sobat. Dengan cara ini juga maka blog sobat kelihatan lebih indah untuk dipandang. Untuk tampilannya sobat bisa lihat gambar di samping.


Apakah sobat juga ingin memasangnya juga di blog sobat? jika jawaban dari sobat ya, maka ikutilah langkah-langkah Cara Membuat Like Box Facebook Tersembunyi.


1. Log in ke blogger.

2.Klik rancangan  » add gadget » HTML/Java Script.
3.Pastekan kode di bawah ini pada kolom yang sudah disediakan.

<script type="text/javascript">

//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background: url("http://3.bp.blogspot.com/-VXmAJdQRHJ8/Tra8E16fZGI/AAAAAAAAClg/o5M632x9qX8/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/MuslihTheKop&amp;width=251&amp;height=270&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true"></iframe><span><a href="http://bdigg.blogspot.com/2012/04/cara-membuat-like-box-facebook.html" target="_blank">+ Get This</a></span></div></div>

 Keterangan :

Ganti kode yang berwarna biru dengan url fans page anda.
4.Pergi ke edit HTML dan letakkan kode dibawah ini di atas kode </head>.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"> </script>


5.Save template anda.


Sekian tutorial tentang  Cara Membuat Like Box Facebook Tersembunyimudah-mudahan artikel ini bisa bermanfaat bagi anda.



SUMBER
read more

Kamis, 09 Agustus 2012

17 Tips agar halaman blog tampil Profesional

0 komentar


Penambahan widgets dan aksesoris pada halaman blog memang menyenangkan dan membuat halaman blog akan terlihat sangat cantik. Tapi tahukah anda ada beberapa hal yang harus dihindari pada halaman blog anda agar terlihat lebih profesional. Kenapa tampilan halaman harus Profesional? untuk menjawab hal ini sangatlah bervariatif yang jelas jawaban abstrak dari saya adalah masalah tampilan, anda tahu kan penampilan halaman dengan user interface yang baik adalah hal yang utama,
read more

Cara mengetahui harga blog

0 komentar


Cara mengetahui harga blog.Anda mempunyai blog? berapa rata-rata kunjungan blog Anda setiap hari? Kalau ada keinginan untuk menjual sebuah blog, kira-kira berapa ya harga yang pantas untuk blog saya? Di posting kali ini kami ingin memberikan cara untuk mengetahui harga suatu blog.
read more