MEMBUAT TEMPLATE BLOGGER DENGAN HTML, CSS DAN JAVASCRIPT (BAG:1)

Diposting Oleh:
Quality Templates. Membuat template sendiri adalah sangat mungkin bagi siapa saja terutama blogger. Banyak keuntungan yang kita dapatkan jika telah bisa membuat template sendiri di samping kepuasan hati tentu saja. Contohnya:
blogger layout
blogger layout
  • Meningkatkan pengetahuan web
  • Meningkatkan ketrampilan desain web
  • Meningkatkan pengatahuan koding web seperti HTML, CSS dan JavaScript
  • Memiliki template buatan sendiri yang dapat di sesuaikan dengan selera kita sendiri
  • DLL
Poin terakhir itu keren. Semahal dan se premium apapun template yang kita beli dari website penjual template, bentuk dan ciri cirinya akan mirip jika di gunakan oleh orang banyak. Contohnya walaupun telah di robah warna warni template viomagz tetaplah viomagz buatan Mas Sugeng. Tidak ada totalitas yakni sebuah halaman web dengan ciri ciri khas dirinya sendiri.

Membuat template sendiri membutuhkan pengetahuan, dan pengatahuan itu berguna sekali bukan hanya untuk membuat template tapi juga untuk hal hal lain di luar itu. Pengatahuan yang sebenarnya telah di ajarkan di bangku sekolah: HTML, CSS dan JavaScript.

Dengan catatan apabila kita bloggingnya menggunakan platform blogger blogspot karena platform ini berbasis HTML. Jika kalian bloggingnya melalui CMS seperti Wordpress org atau igniester, maka kalian harus memiliki pengetahuan PHP yang lebih baik karena platform platform tersebut di buat berbasis PHP. Namun biar demikian pengatahuan HTML tetaplah penting disana, jika kalian ingin membuat template.

Kita sedang membahas peralatan membuat template blogger blogspot. Saya suka karena saya bisa mengutak atik 2 peralatan dasar template blog:
  • HTML
  • CSS
  • JavaScript
Lho kemana XML? Walaupun elemen yang saya sebutkan penting untuk material desain, namun pada pembuatan template bagian XMLnya cukup mengutak atik yang sudah ada saja deh, cukup main standar dulu.

1. HTML
Contoh dasar penulisan HTML adalah sbb:
<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
<h1>ini bagian heading</h1>
<p>dan ini bagian pragraf.</p>
</body>
</html>
Kalau mau di ikuti ada berton ton contoh penggunaan HTML, namun faktanya untuk membuat atau mendesain ulang sebuah template blogger, HTML itu wajib di pelajari, karena:
  • HTML itu adalah standar bahasa Mark Up untuk halaman WEB
  • Dengan mempelajari dan menguasai HTML kita dapat membuat halaman website kita sendiri
  • HTML amat mudah di pelajari.

2. CSS

CSS nyaris tidak terpisahkan dari HTML terutama jika terkait dengan desain WEB, contoh penulisannya adalah sebagai berikut:
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
p {
font-family: verdana;
font-size: 20px;
}
Jadi jika HTML dapat mendeskripsikan tampilan suatu halaman web CSS dapat membuat style untuk merubah antarmukanya sesuai dengan keinginan kita. Misalnya untuk mewarnai background, font dan juga untuk membentuk border pada halaman web.
Untuk membuat template CSS sangat penting di pelajari karena:
  • Ia adalah bahasa yang dapat mendeskripsikan style suatu dokumen HTML
  • CSS mendeskripsikan bagaimana HTML di tampilkan dan di lihat orang di halaman WEB.

3. Javascript

Belajar Javascript adalah wajib karena JavaScript adalah bahasa pemrograman HTML dan WEB yang tidak dapat kita tinggalkan pada saat membuat sebuah template menjadi hidup, contoh kode JavaScript:

<!DOCTYPE html>
<html>
<body>
<h2>My First JavaScript</h2>
<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
</html>
Kesimpulannya adalah:
  1. HTML berguna untuk membuat dan menentukan konten pada halaman web
  2. CSS untuk membuat dan menentukan tataletak halaman web
  3. JavaScript untuk memprogram perilaku halaman web (meskipun dalam beberapa hal CSS dapat melakukan hal yang sama)
Kita akan mendiskusikan bagaimana ketiga peralatan tempur diatas dapat di pergunakan untuk mendesain dan membuat template HTML untuk diguanakan dalam membangun halaman web sesuai dengan keinginan kita pada kesempatan penulisan berikutnya.

Baca Juga:

Komentar

  1. mantep nihh.. saya akan ikutin cara membuat template blogger ini, ditunggu bagian selanjutnya mbak :)

    BalasHapus
  2. Lanjut part 2

    BalasHapus
  3. mantap ini sangat membantu

    BalasHapus

Posting Komentar

Labels

adwords aibo ajax alexa algoritma alternative Am I Responsive amazon ambigu Amerika AMP Andorid Android Android 10 Angular animasi apple ARM Art Of War artikel sabtu asesories autodidact avatar avatar penulis awesome awsome back to top backdoor backlink bahasa bank btn batam beautiful beginning belajar belajar koding berita bing web master biografi blackberryOS blackhat blockquote blog blogcomments blogger bloggerhelp blogging Blogging mobile bloging blogspeed blogspot bluetooth bootstrap border dash breadcrumb browser btn mobile bugs Buku business capital letter cara catatan catatan awal tahun Cek IMEI Cerita cerpen cewek chimpense chipset chrome chrome 76 Cina cinta clickjacking codepen coding compose compose view contact form contempo contempo base contempo blackmagic contempo hibrida contempo hybrid converter coolest copy-paste copyright covid 19 covid_19 cowok CPC credit footer css CTR cuitan curhat cybercrime Dahlan Iskan dark mode dasbor data default Demo desain diblokir dirtylink disway DOM domain domain authority Donald Trump download download template terbaru dropdown earn money edisi minggu edit editblogtema editor HTML ekonomi elektronik Elle Darby embed emoji emporio emporio hybrid english error essential expires header expires headers facebook fakta fanpage fast loading template fastloading template favicon featured posts feed burner firefox fitur fixed fixed sidebar font font awsome footer footer link Footer navigasi forbes Free friendship fuchsia full stacks furure g-suite gadget gagdet galeri gambar gambar bergoncang gambar profile penulis gambar responsive game generasi Alpha Generasi Z geng motor genius gerhana girl gmail Gmetrix gong xi fa cai good news google google chrome Google Domain google drive google font Google honemoon google Plus google search console google webmaster Googlewebmaster gradasi warna grafik gramedia gratis grid style GTmetrix h1 Habibie hack hacker halaman web hamburger menu hanya opini hapus hari bumi harimau heading headings heart secret hewan hoax hobi hotpink HTM5 html HTML view huawei hukum human Idulfitri Iklan ikon Imlek in memories indie Indonesia Indonesia darurat corona indosat infinite color infinity war informasi instagram intel inteligensia internal link internasional internet internt interntet interntt intert iOS iPad iPadOS iPhone isu IT italia Jaime Ocabo java JavaScript jimdo jin Ping jingling Jokowi jQuery JSitor kaca pembesar kafe kalimantan kalkulus kamera kanonis kartun keamanan keamanan blogger kebijkan kecepatan blog mobile kehidupan kemanusiaan kesehatan keyakinan keyboard keyword khusus kiata G+ klasik klik kode warna koding komentar komentar blog komputer konsipirasi konten konversi kopi kota kotak navigasi menu blog kotak pencarian kotlin kriminalitas kualitas kucing label laptop lay out lay out version 3 theme layarlipat layout lazyload lifehack lingkungan logitech logo love Macbook Macbook Air machine learning MacOS magnifier maintenance makmur manusia margasatwa masa depan masonry matahari matematika medsos mega menu mengganti tempa menu menu navigasi menu pencarian menulis merombak metafisika Microsoft microsoft edge Minggu minify misteri mitos mobile modal modern modifikasi monetisi morality motivasi motivation moz myths nasehat terbaik navbar navigasi navigasi menu blog ngeblog nibbler notable office Omnibus online online editor operating sistem opini otodidak pagelist pagerank paginator Pandora panduan panduan mobile paradox parameter parasit parse pembatasan pemilu 2019 Pemilu Indonesia 17 April 2019 pemrograman pemula pendidikan pengalaman pengaturan pengusaha Penulis perang dagang Cina vs Amerika perang dunia ketiga perangdagang perceraian perihal perubahan pexel phablet PHP plagiat plagiator PlagScan play store polemik politik ponsel popularitas popularposts portable powered by blogger Powerpoint prediksi premium privasi produk profesi profile programmer programming programming. prosesor pseudo-sains psikologi Python rahasia ramalan ranking faktor rawgit re-desain re-desain tema blogger React Reactions read more recentPosts redesain related posts remaja resolusi responsinator responsive review robot robot.txt sains samsung sanggahan saran temaplate blogger saran template search secrets security sederhana sejarah seken selegram semrush SEO share button sharing buttons I.O sidebar sidenav siginifikan silikon simple simpson singularity sitelink sitemap smartphone snippet soho solusi somadmorroco spesial spoiler star wars sticky sidebar sticky widget Strategi SEO Student study study online style submenu subscriber success sudut cerita SVG SVG icon syimbian tab s2 tabel tablet tabs2 tagging takdir takhyul talenta tataletak Teen teka teki teknik teknologi TELKOMSEL tema tema kesederhanaan template template premium template premium gratis template SOHO template versi ke-2 terkemuka tes popularitas testimoni testmysite text theme Thucydides tip tips toggle tokoh tombol berbagi tombol pengalihan tombol reply komentar tops traffik trafic trafik translator tribun tricks Trik triks troubleshooting Tutorial Tutorial Anissa tutorialKhusus twitter uang UAS unduh unik update urang utan ustazd Abdul Somad vanilla Script video viomagz viral virus corona vlogging vue w3-css w3school W3Shool wabah warna web web story WebAssembly webdesign WEBP website whatsapp widget wifi ID windows Windows Mobile wisata WIX wordpress X-Frame xiomi xml yandex youtube youtuber z-index
Tampilkan selengkapnya

Populer

Cara memperbaiki add numbering dan add bullets yang tidak bisa tampil pada postingan blog

Downoad Notable simple yang pas buat blog curhat

Download Update Template Blogger Notable simple versi kedua