Cara Membuat Blog Offline dengan CSS atau Notepad

 Cara Membuat Blog Offline dengan CSS atau Notepad




Hallo guys, kali ini saya akan sedikit memberi informasi tentang bagaimana cara membuat Blog Offline dengan menggunakan CSS atau Notepad, Caranya cukup mudah dan tidak menggunakan jaringan internet sama sekali. Oke langsung saya menuju ke langkah -langkahnya :
1. Pertama Siapkan dulu Laptop Anda
2. Buka Aplikasi Notepad 
Kemudian Copy dan Paste Source Code Di bawah ini.
<html>
<head>
<title>
afin.tkj
</title>
<link href="1.css" rel="stylesheet" type="text/css" />     //link untuk file cssnya
</head>
<body bgcolor="white">    //Warna Latar Belakang
<h1><p align="center"> My Diary Activity </p></h1>   //Judul Isi Blog anda 
<hr><hr>
<img src="Profil.jpg" width="180" height="200" border="1"> //link foto yang akan anda masukan
<h3>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbspPerkenalkan nama saya Afin NaSsrulloh saya lahir di Kediri pada tanggal 14 november 1999, saya umur 16, saya bertempat tinggal di Dsn Pojok Ds bulusari Kec Tarokan Kab Kediri, saya akan menceritakan Pengalaman saya pada setiap hari mulai dari bagun tidur sampai akan tidur yaitu; saya bangun tidur
pukul 04.45 lalu kemudian saya mandi lalu menuju masjid untuk sholat subuh, setelah sholat subuh kemudian saya membaca al-quran atau belajar, sekitar jam setengah 6 saya bersiap-siap
berangkat kesekolah, pukul 06:15 saya berangkat dari rumah dan sampai sekolah pukul 06:30.<br> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbspDi sekolah saya belajar yaitu di Smkn 1 Kediri, Saya pulang sekolah setiap hari berbeda kurang lebih sekitar jam 2 siang, kemudian
saya pulang, setelah sampai dirumah saya istirahat, sekitar jm setengah empat saya bangun lalu menuju kemasjid untuk sholat ashar, setelah sholat saya bermain sepokbola bersama teman-teman sekitar rumah sampai menjelang magrib,
setelah itu saya sholat magrib kemudian mengaji sampai isya', setelah itu saya sholat isya', setelah sholat isya' saya makan kemudian belajar sampai kira-kira pukul sembilan, setelah itu saya tidur
<br>
<br>
<br>
<table border="2">
<tr>
<td>
<a href="link_afin.html">BIODATA</a> //link ke halaman selanjutnya
</td>
</tr>
</table>
</body>
</html>
Kemudian Save dan beri nama Terserah anda (exp: index.html) ini wajib .html karena untuk menjadikan file bertipe WEB
Hasilnya seperti ini.



3. Buat bagian bawah dari blog atau biasanya disebut footer dengan cara, buka notepad baru
Kemudian Copy dan Paste Source Code Di bawah ini.
<html>
<head>
<title>
afin.tkj
</title>
</head>
<body bgcolor="white">
<center>
Copyright@07_AfinNaSsrulloh_X-TKJ1
</body>
</html>
Kemudian Save dan beri nama Terserah anda (exp: footer.html) ini wajib .html karena untuk menjadikan file bertipe WEB
Hasilnya seperti ini.



4. Buat halaman baru dari blog atau biasanya disebut link yang akan kita gunakan sebagai BIODATA dengan cara, buka notepad baru
Kemudian Copy dan Paste Source Code Di bawah ini.

<html>
<head>
<title>
afin.tkj
</title>
</head>
<body bgcolor="white">
<h1><p align="center">BIODATA</p></h1>
<hr><hr>
<table>
<tr>
<td>nama</td>
<td>:</td>
<td>Afin NaSsrulloh</td>
</tr>
<tr>
<td>TTL</td>
<td>:</td>
<td>Kediri, 14 November 1999</td>
</tr>
<tr>
<td>Sekolah</td>
<td>:</td>
<td>Smkn 1 Kediri</td>
</tr>
<tr>
<td>Jurusan</td>
<td>:</td>
<td>teknik Komputer dan Jaringan</td>
</tr>
<tr>
<td>Asal SMP</td>
<td>:</td>
<td>SMPN 1 Grogol</td>
</tr>
<tr>
<td>alamat</td>
<td>:</td>
<td>Ds Pojok Bulusari Kec Tarokan Kab kediri</td>
</tr>
<tr>
<td>Hobby</td>
<td>:</td>
<td>Sepakbola, berenang</td>
</tr>
<tr>
<td>Cita-cita</td>
<td>:</td>
<td>Editor</td>
</tr>
<tr>
<td>Alasan </td>
<td>:</td>
<td>Karena SMK mengajari dibidang non akademik dan bidang kejuruhan, dan setelah lulus mempunyai ketrampilan untuk bekerja</td>
</tr>
<td>Misi </td>
<td>:</td>
<td>Sukses Dunia dan Akhirat</td>
</tr>
</table>
</body>
</html>
Kemudian Save dan beri nama Terserah anda (exp: link_afin.html) ini wajib .html karena untuk menjadikan file bertipe WEB
Hasilnya seperti ini.


4. Buat Notepad baru ini digunakan sebagai pusat dari halaman- halaman yang sudah dibuat tadi kemudian di jadikan 1 (satu).
Kemudian Copy dan Paste Source Code Di bawah ini
<html>
<head>
<title> //Judul yang anda buat
afin.tkj
</title>
</head>
<body bgcolor="black"> //Warna latar Belakang
<center>
<iframe src="index.html" width="800" height="580" ></iframe><br> //halaman yang sudah anda buat
<br>
<iframe src="footer.html" width="800" height="50" ><iframe> //halaman yang sudah anda buat
</body>
</html>
Kemudian Save dan beri nama Terserah anda (exp: afin.html) ini wajib .html karena untuk menjadikan file bertipe WEB
Hasilnya seperti ini.

7. Kemudian yang terakhir file CSS nya
Seperti biasa Copy Paste di Notepad
a {text decoration: none;
text-size:default;}
a:hover { text decoration: underline;
font-size: 30px;
color: red;
background: yellow;}
img {float:left;}
Lalu save file dengan tipe file CSS  (exp: 1.css)

8. Catatan
Untuk semua file yang sudah dibuat tadi jadikan 1 folder 

9. Selesai Untuk Memukan keseluruhan buka yang "afin.html"

Semoga Bermanfaat, Jangan Lupa klik Like dan Ikuti untuk bisa mengetahui informasi dari blog saya,
Untuk Request Silahkan Comment di bawah .....