Archive for June 2017

Membuat efek Zoom pada HTML dengan CSS

07:33:00 Add Comment

Yops, setelah lama Saya tidak membuat postingan lagi, kali ini saya kembali dengan membawa sebuah tutorial CSS dasar, yaps kali ini saya akan coba membuat efek zoom pada HTML dengan menggunakan CSS, oke langsung saja kita coba membuat efek Zoom ini, tapi pastikan kalian menyiapkan text editor kalian, jika sudah coba kalian copy saja source code di bawah ini.

Untuk index nya copy saja code berikut dan beri nama "index.html tanpa tanda kutip
<!DOCTYPE html>
<html>
<head>
<title>Efek zoom | Malming.web.id</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>Membuat efek Zoom | Malming.web.id</h1>
<div class="wrapper">
<div class="zoom">
<div class="box">
<img src="http://www.suratkabar.id/wp-content/uploads/2016/05/bentuk-planet-bumi-bulat.jpg">
</div>
</div>
</div>
<p>&nbsp</p>
<div class="footer">
Copyright <a href="http://malming.web.id/">Malming.web.id</a>
</div>
</body>
</html>
Untuk CSS nya copy saja code berikut dan beri nama "style.css" (sesuaikan saja seperti inputan pada html nya)
body {
background-color: #95A5A6;
}
h1 {
text-align: center;
}
.box img {
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  width: 700px;
}
.zoom:hover .box img {
  -webkit-transform: scale(1.08);
  transform: scale(1.08);
}
.wrapper {
width: 700px;
margin: auto;
}
.footer {
text-align: center;
}
.footer a {
text-decoration: none;
}

Nah code yang paling berpengaruh pada efek zoom ini adalah di code berikut
.box img {
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  width: 700px;
}
 .zoom:hover .box img {
  -webkit-transform: scale(1.08);
  transform: scale(1.08);
}
di sini kita menggunakan efek transis yang memungkinkan sebuah elemen secara bertahap berubah dari satu gaya ke yang lain. Fungsi dari Efek Transisi ini adalah untuk membuat animasi pada hover, dimana saat kursor kita arahkan pada elemen yang mempunyai fungsi hover maka elemen tersebut akan secara bertahap berubah gaya.

Nah jika kalian ingin tau seperti apa efeknya, silahkan kalian copy saja code di atas dan coba kalian praktekan atau kembangkan sendiri.

Nah mungkin cukup sekiyan dari saya kali ini, terimakasih. Wassallam
gambar : http://www.suratkabar.id/wp-content/uploads/2016/05/bentuk-planet-bumi-bulat.jpg

Download Script Websie Portfolio (Malming Template V1.2)

17:02:00 Add Comment

Yo guys, kembali lagi dengan saya di malming blog, ok kali ini saya akan membagikan sebuah script website portfolio, mungkin sebelumnya saya sudah mengshare script yang serupa, tapi ini lebih dari yang pertama, kali ini saya menambahkan beberapa fitur menarik lainnya di script ini.

Nah seperti apa sih script yang pertama dan script ini?
Untuk yang pertama silahkan kalian baca artikel ini
Membuat website portfolio responsive
Nah kalau kalian ingin mendownload script yang versi kedua ini, silahkan kalian download scriptnya di bawah ini.

Download

password rar : malming

Untuk lebih detail lagi mengenai script ini, silahkan simak video berikut ini


Kiranya cukup sekiyan dulu dari saya, terimakasih. Wassallam ...........

Membuat Mail Server Pada Debian Menggunakan Squirrelmail

14:24:00 3 Comments

Mail server berfungsi sebagai pengatur atau penerima dan penyalur respon atas email yang masuk. Tak hanya itu fungsi utama dari program ini adalah sebagai aplikasi yang digunakan untuk menginstal email. Oleh karena itu aplikais ini sangat penting karena akan mengatur jalannya email dan merespon setiap email yang masuk (sumber: artikel-az.com).

Nah, dalam artikel kali ini mimin akan mencoba membuat sebuah mail server kita sendiri. Sebelumnya pastikan anda telah mengikuti tutorial tentang membuat web server pada debian. Jika sudah maka langsung saja ke step membuat mail server pada debian.
Jika belum, silahkan lihat tutorial ini: Membuat Web server pada debian.

Langkah-langkah :
1. Install Courier-imap, Courier-pop, dan postfix.



2. Pilih "internet site". 



3. Sysem mail name, isikan nama domain anda.



4. Create direcories for web-based kita pilih yes.



Jika muncul pesan eror seperti ini.



Maka cara meng-fix nya adalah harus mengedit postfix nya, seperti ini langkah-langkahnya, edit postfix.



Tampilannya akan seperti ini.



Scroll paling bawah. Dan tambahkan “home_mailbox = Maildir/” (tanpa tanda kutip).



Jika sudah, kemudian save. Dan selanjutnya buat directory untuk maildir-nya.
ketik "maildirmake /etc/skel/Maildir" tanpa tanda kutip dan "M" besar untuk /Maildir


5. Jika sudah meng-fix nya selanjutnya kita reconfig postfix nya.



6. Pilih “Internet site”.



7. Root and postmaster kita kosongkan saja.


8. Other destinations pastikan ada domainanda.com dan mail.domainanda.com.



9. Force synchronus kita pilih “no” supaya tidak mengsinkron.



10. Local network tambahkan ip 0.0.0.0/0 fungsinya ialah agar semua ip yang terhubung dapat mengirim/menerima mail darri web kita.



11. Use procmail kita pilih “no”.



12. Mailbox limit kita pilih default saja.



13. Local address extension juga kita isi default saja.


14. IP use kita pilih sesuai selera boleh piih Ipv6 boleh juga Ipv4 (recomend).



15. Selanjutnya install squirrelmail.


16. Jika sudah, selanjutnya kita edit apache-nya.


Scroll paling bawah sampai pada bagian "Include the virtual host."



17. Lalu tambahkan seperti ini "Include /etc/squirrelmail/apache.conf" tanpa tanda kutip.



18. Jika sudah, kemudian save dan kita edit file directory yang kita taruh di apache tadi.


19. Tampilannya akan seperti ini.


20. Cari virtual host kemudian hapus (#) supaya meng-enable-kannya.


21. Pada virtualHost 1.2.3.4 kita ganti jadi *:80 (karena menggunakan apache) dan servername kita isi mail.domainanda.com.


22. Kemudian save dan kita restart postfix, courier-imap,  courier-pop, dan apache2 nya.


23. Kemudian kita buka browser ketik mail.domainanda.com, jika berhasil maka akan muncul seperti ini.


Jika ingin menambahkan user, maka tinggal ketikkan “adduser (nama user)”.


Sekarang kita coba login dengan user “achmad”.


Done


Jika kalian masih merasa kebingungan dengan tutorial gambar diatas, kalian bisa simak video berikut ini,


Nah mungkin itu saja tutorial yang dapat mimin bagikan kali ini, jika ingin merequest tutorail lainnya bisa kalian inbok Fanspage Malming.web.id di facebook. Sekiyan wassalaam..

Download Source Code Website Portfolio

09:29:00 4 Comments

Yo, kita bertemu lagi di malming.web.id, yaps kali ini Saya akan membagikan sebuah script portfolio. Sebelumnya apa sih website portfolio itu? Website portfolio sendiri ialah website yang menunjukan atau menonjolkan suatu produk barang atau jasa yang diolah dari website tersebut. Untuk contoh website portfolio dapat kalian temukan di website http://www.jespervos.nl.

Nah kali ini saya sudah menyiapkan sebuah script website portfolio sederhana buatan Saya sndiri. Untuk revieewnya, mungkin kalian bisa simak video berikut ini.


Fitur :

  1. Responsive design
  2. Support HTML 5
  3. Bootstrap framework
  4. Smooth scroolling
  5. Portfolio
  6. Contact Us
  7. Etc
Untuk scriptnya kalian boleh download di link di bawah ini 


Password Rar : malming

Konfigurasi Web Server dan DNS Pada Debian 8

16:29:00 Add Comment

Osu, yah kembali lagi di Malming.web.id, kali ini mimin bakal membagikan tutorial debian server nih, lebih tepatnya kita akan membuat Web server serta DNS dalam server kita. Sebelumnya pastikan kalian sudah melihat tutorial "Konfigurasi DHCP-Server pada debian 8" agar lebih memahami maksud dari postingan kali ini.

Oke jika sudah, maka kita bisa lanjut saja ke tutorialnya.

Install apache2 pada debian


Kemudian install bind9


Agar lebih mudah saat menyeting, maka sebaiknya kita masuk ke directory /etc/bind.


Kemudian lihat isi dari direktori tersebut, ketikkan perintah “ls”.


Copy named.conf.default-zones ke named.conf.local.


Kemudian edit named.conf.local dengan cara berikut.


Isinya akan seperti ini.


Hapus beberapa perintaah sehingga menyisakan dua perintah saja, seperti ini.


Edit perintah yang tersisa.


Kemudian save, dan copykan db yang default ke db yang sudah di edit, misal seperti db.local di copy ke db.kelompok dan db.127 ke db.30


Edit db.kelompok (nama sesuaikan db yang di copy tadi).


Seperti inilah tampilannya.


Kita edit jadi seperti ini.


Jika sudah, kemudian save. Setelah itu kita edit db.30.


Tampilan defaultnya akan seperti ini.


Kita edit jadi seperti ini.


Save dan kemudian restart apache2 dan bind9 nya.



Kemudian kita cek di windows virtual kita, ketik pada browser windows virtual kita www.namadomain.com


Jika berhasil maka akan muncul tampilan web seperti gambar di atas.

Nah jika kalian masih merasa bingung dengan tutorial versi gambar, saya sudah menyiapkan tutorial versi videonya nih, oke kita langsung saja simak tutorial versi videonya di bawah ini.



Nah mungkin cukup sekiyan dulu tutorial kita kali ini, terimakasih karena telah berkunjung di blog saya. Wassallam.....
Subscribe to: Posts (Atom)

Kategori

Kategori