Instalasi Web Server Apache pada openSUSE

Apache HTTP Server
Server HTTP Apache atau Server Web/WWW Apache adalah server web yang dapat dijalankan di banyak sistem operasi (Unix, BSD, Linux, Microsoft Windows dan Novell Netware serta platform lainnya) yang berguna untuk melayani dan memfungsikan situs web. Protokol yang digunakan untuk melayani fasilitas web/www ini menggunakan HTTP.
Pada openSUSE, ada beberapa cara menginstall web server Apache. Cara tersebut sama mudahnya.
Menggunakan YaST.

- Jika menggunakan DVD installer sebagai repository, pastikan bahwa DVD tersebut sudah diset dengan baik.
- YaST -> Software -> Software Management -> View = pattern -> Web & Lamp Server -> Accept.
Dengan demikian web server kita telah terinstall.

Menggunakan Konsole

# zypper in apache2
Loading repository data...
Reading installed packages...
Resolving package dependencies...                                                                                             

The following NEW packages are going to be installed:
  apache2 apache2-itk apache2-utils libapr1 libapr-util1 

5 new packages to install.
Overall download size: 1.3 MiB. After the operation, additional 3.2 MiB will be used.
Continue? [y/n/?] (y): y [enter]
 
Secara default pasca instalasi, status web server Apache belum berjalan. Untuk menjalankan service tersebut gunakan perintah
service apache2 start
Atas pertimbangan keamananan data web, openSUSE secara default hanya mengaktifkan folder yang memiliki file index (misalnya index.html). Jika tidak ada, openSUSE akan menampilkan tulisan Access Forbidden. Hal ini kadang membuat kita bingung padahal web server telah terinstall tetapi acces forbidden. Untuk mengatasi hal itu, berikut cara mengaktifkan pilihan index file :

- Buka file /etc/apache2/server-default.conf
vim /etc/apache2/default-server.conf

# Configure the DocumentRoot #
 # Possible values for the Options directive are "None", "All", # or any combination of:
# Indexes Includes FollowSymLinks SymLinksifOwnerMatch ExecCGI MultiViews #
# Note that "MultiViews" must be named *explicitly* --- "Options All" # doesn't give it to you. #
# The Options directive is both complicated and important. Please see # http://httpd.apache.org/docs-2.2/mod/core.html#options
# for more information.
Options None
 # AllowOverride controls what directives may be placed in .htaccess files.
# It can be "All", "None", or any combination of the keywords:
# Options FileInfo AuthConfig Limit AllowOverride None
 # Controls who can get stuff from this server. Order allow,deny Allow from all

- Ubah Options dari None menjadi All.
- Restart Apache dan buka http://localhost di browser. Jika tidak terdapat pesan access forbidden berarti instalasi telah berhasil.
 

Cara membuat Header Menjadi dua Kolom ( templete Baru)


Kalau kita lihat header pada blogger bawaan akan terlihat satu kolom panjang yang terletak di bawah Nav Bar ...emang udah dari sono nya bentuk nya kayak gitu he he.. dan mungkin sobat udah bosan dengan tampilan seperti itu.. tapi tenang saja ada suatu keinginan saya untuk membagi header menjadi dua kolom akhir nya saya cari di search engine dan setelah menemukan kode html trus saya coba untuk mengobok-obok blog saya ,,awal nya sih masih rada-rada susah maklum saya masih bodoh tentang kode-kode html dan setelah membanting tulang,memeras keringat dan menghabiskan berbatang-batang rokok ahh,,,akhir nya saya berhasil juga...

Bagaimana sih bentuk header dua kolom tersebut...kira-kira seperti sobat lihat di bawah ini....yang sebelah kiri merupakan header utama yang di potong sedangkan sebelah kanan header hasil potongan...ada keuntungan yang bisa kita ambil dengan adanya dua klom header ini mungkin kita bisa meletakan tulisan,gambar,maupun kode script di samping judul blog kita..



Di dalam postingan ini header yang akan di modifikasi adalah untuk blog yang memakai templete baru jika templete sobat memakai templete lama silahkan baca artikel selanjut nya di sini.

Jika sobat berminat untuk membelah header cara nya ga terlalu ribet cukup bawa pisau dapur atau celurit terus di belah bereskan..!!! he he sorry bercanda juragan....

Ok..!!! kita langsung aja mengikutin langkah-angkah nya...
1. LANGKAH PERTAMA

  • seperti biasa anda login terlebih dahulu..kalau sudah login silahkan langsung ke RANCANGAN
  • Anda klik Edit HTML
  • sebelum nya anda download dulu templete agar jika ada kesalahan templete anda bisa di kembalikan seperti semula.
  • Jangan lupa di centang Expand Template Widget
  • Kalau sudah kita mulai mengobok-ngobok kode html nya
CARI KODE DI BAWAH INI..!!! cara cepat nya tekan (Ctr + F pada keyboard) fokus pencarian pada huruf bercetak tebal



.header-outer { background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;}

anda hapus kode di atas dan ganti (replace) dengan kode di bawah ini...


.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;min-height: 154px; /* untuk mengatur tinggi header (height) */}
#header {
width: 45%; /* untuk mengatur lebar header kiri - title, description, image */
margin-right: 10px;float: left; }
#bgsGR_headerkanan {
float: right;
width: 49%; /* mengatur lebar header kanan */
margin: 20px 10px 5px 10px;
padding: 2px;}
#bgsGR_headerkanan .widget {margin: 3px;}

2. LANGKAH KEDUA
Cari kode di bawah ini


<div class='region-inner header-inner'>

Terus anda tambahkan dengan kode di bawah in...

<b:section class='bgsGR_headerkanan' id='bgsGR_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>

Hasil nya kayak di bawah ini..


<div class='region-inner header-inner'><b:section class='bgsGR_headerkanan' id='bgsGR_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>

catatan :
  • Untuk yang bercetak tebal merupakan kode yang di tambahkan tambahan 
  • Untuk yang bercetak merah angka nya bisa anda bisa ganti dengan angka 2,3,4 atau lain nya..maksud nya untuk susunan kolom kebawah. 


3. LANGKAH KETIGA selesai dan simpan templete

Sekarang Lihat hasil nya... langsung anda kerancangan... selamat mencoba....

membuat tulisan berkedip-kedip pada blog

Setelah kita belajar membuat tulisan berjalan, yang dulu pernah kita pelajari bersama. sekarang kita beralih pada cara membuat tulisan berkedip-kedip. Mungkin kita juga bisa kasih julukan dengan tulisan genit.  Karena dengan tulisan berkedip-kedip ini akan menjadi daya tarik orang untuk melihatnya. Bayangkan saja jika ada cewek di dekat kita yang mengedip-ngedipkan matanya.
langsung saja kita ikuti beberapa cara untuk membuat tulisan berkedap-kedip :

1. Login ke blogger
2. Pilih Tata Letak kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode-kode berikut ini
<blink><b>TUTORIAL WEB DESAIN</b></blink>

5. Sedang untuk yang kita sisipkan link kodenya akan seperti ini
<blink><a href="http://www.software-dan-tutorial.blogspot.com/"><b>TUTORIAL WEB DESAIN</b></a></blink>
hasilnya akan seperti ini :

Tutorial web Desain

Membuat Efek Marquee


Sebelum kita mengenal marguee pasti kita bertanya-tanya Apa sih marquee itu?
Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Program marquee ini banyak diminati dan di pakai oleh para blogger di dalam blognya karena sifat program ini yang dinamis serta menarik untuk di lihat disamping untuk menghemat tempat pada halaman blog.
Agar lebih jelas akan saya Berikan contoh beberapa macam marquee :

Contoh marquee dari gerakan dari kanan ke kiri : 


<MARQUEE align="center" direction="right" height="200" scrollamount="2" width="30%">

Tutorial software

</MARQUEE>  

hasilnya :
 
tutorial web desain 
 
Contoh marquee dari gerakan bolak balik :
<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="70%" behavior="alternate">
 
tutorial web desain

</MARQUEE>

hasilnya :

tutorial web desain  

Contoh marquee dengan variasi hurup dan warna latar belakang :

<div align="left"><FONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="RED" width="70%" scrollamount="3" behavior="alternate">
tutorial web desain
</MARQUEE></b></FONT></div>
hasilnya :
tutorial web desain
 Ada variasi lain dari marquee ini, yakni ketika mouse sedang berada di area marquee teks akan berhenti dan ketika mouse di geser kembali ketempat lain maka teks akan bergerak kembali, ini hanya di tambahkan sedikit program pada kolom marquee.

Contoh, silahkan arahkan mouse anda ke area marquee di bawah ini :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="20" align="center">

tutorial web desain

</marquee>

hasilnya :


tutorial web desain