Jumat, 02 Februari 2018

Cara memasang icon icon di blog dan website kalian lengkap

 
Februari 02, 2018

Halo sobat , banya blog blog atau website professional menggunakan icon icon untuk men-visualisasikan code code agar mudah dipahami , dan agar pesan yang ingin disampaikan itu benar-benar masuk ke target audients.

dulu untuk memasang ikon itu cukup sulit, hal yang harus dilakukan adalah merancang icon yang pas dengan format PNG ataupun SVG, lalu jika sudah maa icon yang tadi kita buat langsung di compress size agar ringan untuk bandwidth web kita.

Tapi di zaman now , sudah banyak website yang memberikan pelayanan icon free dan berbayar dengan segala kelebihan dan kekurangannya masing masing , dan tentunya icon zaman now sudah tidak mempengaruhi space disk di hosting kita

salah satu website penyedia layanan icon icon unik yang kami rekomendasikan adalah Fontawesome.io yang sekarrang move domain , nama domainnya sama hanya extensi .io berubah menjadi .com, mungkin karena di dalamnya ada hal hal yang bersifal komersil atau dia berjualan, makannya move domain.


yap ini dia website yang menyediakan icon icon unik untuk blog/website resmi kalian , dengan menyediakan lebih dari 2000 macam icon tepatnya 2,316 ( dua ribu  tiga ratus enam belas ) icon , pastinya akan cocok banget untuk di pasangkan ke website kalian.

dan mungkin hanya ini website yang terus update icon iconnya , mulai dari versi 4.1.0 , 4.2.0, hingga yang terbaru versi 5.0.6 yang baru saja realese, tentunya makin banyak icon icon baru yg bermunculan , misalnya Category branding : facebook, google, twitter, gmail, ,linked in, dll

yuk langsung saja kami beri tau gimana cara memasang icon pada blog atau website mudah dan cepat, dengan hanya beberapa step saja kalian bisa langsung menggunakannya.

untuk kalian yang menggunakan website hosting sendiri, kalian bisa mendownload fontnya, download filenya hanya berukuran 20mb/megabyte saja , tentunya tidak akan menghabiskan banyak kuota.

oke berikut langkah-langkah untuk memasang icon di website:
  1. download filenya
  2. extract filenya
  3. lalu buka folder web-fonts-with-css di dalam file rar yang baru kalian extract tadi
  4. lalu copy data yang di folder css ke file website project kalian
  5. lalu copy folder webfonts ke file project web kalian
  6. lalu buka file page website kalian
  7. pastekkan code di bawah ini dibawah code </head>
  8. <link rel="stylesheet"  type="text/css" url="css/fontawesome.css"/>
    <link rel="stylesheet"  type="text/css" url="css/fontawesome-all.css"/>
    <link rel="styleshebody"text/css" url="css/fa-brands.css"/>
    <link rel="stylesheet"  type="text/css" url="css/fa-regular.css"/>
    <link rel="stylesheet"  type="text/css" url="css/fa-solid.css"/> 
  9. Save
oke sudah kelar untuk kalian yang menggunakan website hosting berbayar, lantas kalo yang menggunakan blogger bagaimana ? bukannya blog yang platform blogger itu tidak menggunakan hosting, tenang saja, yuk kita kupas sekarang.

berikut langkah langkah untuk memasang icon di blogger :


  1. buka blogger dashboarrd kalian
  2. buka template > edit html
  3. cari code  <head>
  4. lalu pastekan code ini dibawah code di atas kode tersebut
    <link rel="stylesheet" src="https://maxcdn.bootstrapcdn.com/font-awesome/5.0.6/fonts/fontawesome-webfont.eot?v=5.0.6" type="text/css">
  5. save


Cara Memasang icon di blog / website
sedangkan untuk memanggil iconnya hanya menggunakan code italic <i></i> dan dengan ditambahkan class fa (code icon) didalamnya, contoh : <i class="fa fa-user"></i>, untuk melihat code icon kalian bisa lihat di fontawesome.io/icons


Oke mungkin ssudah selesai postingan kali ini , bagaimana ? mudah bukan ? jika kalian bingung tentang posting ini , jangan sungkan untuk meninggalkan comentar dibawah ini , dan jika kalian suka dengan artikel ini silahan untuk subscribe dan share artikel ini 

Read More

Kamis, 01 Februari 2018

4 Hal penting untuk membuat website simple

 
Februari 01, 2018

Oke pertama tama , perkenalkan blog ini terlebih dahulu , untuk kamu yang suka dengan web dan ga bisa jauh jauh dari coding atau kamu yang lupa dengan tutorial tapi malas untuk nyari video tutorial , disini tempat yang tepat untuk mendapatkan itu semua.

Blog ini berisi tentang tutorial tutorial cara membuat website from zero to hero , atau dari awam sampai ke yang expert, blog ini dibuat khusus untuk tutorial tutorial cara simple untuk membuat tampilan web kamu unik dan ciamik.

Untuk Mengawali pembukaan blog ini , saya akan update info tentang dasar dasar membuat website , seperti sebenarnya apa sih itu website ? Definisi serta tahapan tahapan atau langkah langkah membuat website simple dan menarik

thehotelweek.com ( Author by me )
menurut sumber wikipedia  :

A website is a collection of related web pages, including multimedia content, typically identified with a common domain name, and published on at least one web server. A website may be accessible via a public Internet Protocol (IP) network, such as the Internet, or a private local area network (LAN), by referencing a uniform resource locator (URL) that identifies the site.
atau yang yang artinya : "Situs web adalah kumpulan halaman web terkait, termasuk konten multimedia, yang biasanya diidentifikasi dengan nama domain yang umum, dan dipublikasikan di setidaknya satu server web. Sebuah situs web dapat diakses melalui jaringan Internet Protocol (IP) publik, seperti Internet, atau jaringan area lokal pribadi (LAN), dengan merujuk pencari sumber daya seragam (URL) yang mengidentifikasi situs tersebut."

nah itu adalah pengertian website , setelah mengerti tentang pengertiannya , apa aja sih langkah langkah untuk membuat website sederhana , berikut langkah langkah mudah untuk membuat website :

1. Struktur HTML

    apa sih itu HTML ? orang awam seperti kita mungkin bertanya tanya tentang HTML , Hypertext Markup Language (HTML) adalah bahasa markup standar untuk membuat halaman web dan aplikasi web. Dengan Cascading Style Sheets (CSS) dan JavaScript, ia membentuk tiga serangkai teknologi landasan untuk World Wide Web.  Browser web menerima dokumen HTML dari server web atau dari penyimpanan lokal dan menjadikannya ke dalam halaman web multimedia. HTML menggambarkan struktur halaman web secara semantis dan awalnya menyertakan isyarat untuk tampilan dokumen.

biasanya file html itu ber extensi (.html) contoh : www.panduan-webmu.blogspot.com/index.html, atau www.panduan-webmu.blogspot.com/about.html

untuk struktur kodenya sendiri sangat sangat simple , berikut code struktur HTML :
<!DOCTYPE html>
<html>
<head>
    <title></title> /*
ini untuk judul di address bar */
</head>
<body>

</body>
</html>
2. kenali code code struktural

contoh code code struktural adalah seperti Heading h1 - h6 , lalu code bold, italic, underline , bahkan juga code div ( untuk awal abaikan div ), table, tr , td , th, untuk tempat code struktural ini mungkin kita akan bahas di postingan selanjutnya.

3. memahami system CRUD
apa sih itu CRUD ? merupakan singkatan dari Create,Read, Update, Delete, sama seperti  Struktur html , untuk membuat website dinamis kita sangat sangat wajib untuk memakai system ini , bayangkan nih kalo kalian punya website yang setidaknya 1 minggu bisa update content yang berbeda , kalian akan males untuk updatenya karena kalian harus terus terusan buka akun cpanel kalian.

4 menentukan thema atau template

iixs.id (author by me )

nah untuk itu artikel ini saya terbitkan , karena di sini kita bisa menentukan thema sesuai dengan imajinasi kita , thema akan menjadi sangan penting jika website kalian itu web company profile , karena sebuah perusahaan perlu ciri khas atau ciri identik dengan produk yang akan mereka jual.

jadi sebelum kalian membuat website , terlebih dahulu kalian tahu ilmu dasarnya , kalo kalian tidak tahu ilmu dasar bagai mana kalian akan bisa , dan perlu diingat untuk membuat website itu yang terpenting adalah pemahaman tentang code bukan seberapa banyak code yang kalian hafal.

Reletade Keyword Search :
panduan lengkap membuat web dengan wordpress, panduan lengkap desain web macromedia 8, panduan lengkap membuat web dengan dreamweaver, panduan membuat halaman web, panduan webmoney, panduan membuat web, panduan membuat web gratis ,panduan membuat web design
panduan membuat web dengan notepad ,panduan web padamu negeri, panduan membuat web toko online gratis, panduan membuat web toko online, panduan web programming, panduan pemrograman web, panduan desain web pdf, panduan padamu.siap.web.id, panduan pembuatan web, panduan desain web dengan photoshop, panduan web report fastpay, panduan rumahweb, panduan domain rumahweb, panduan web service feeder, panduan web sekolah, panduan web service, panduan web service pddikti, buku panduan web site, panduan membuat web sendiri, panduan membuat web sekolah, panduan siap web sekolah, panduan web unbk 2018, panduan membuat web untuk pemula
panduan desain web untuk pemula, panduan web wordpress, panduan membuat web di wordpress
panduan membuat web dengan wordpress pdf, panduan wysiwyg web builder 8

Read More

Cara membuat fixed header mudah

 
Februari 01, 2018

hai sob , balik lagi di blog panduan web mu , yang menyajikan banyak tutorial untuk mempercantik dan membuat blog kalian lebih profesional layaknya web web perusahaan yang besar , dan jangan ragu dengan kami , kami menyajikan informasi yang sangat  mudah untuk pengaplikasiannya terhadap blog atau web kalian.


kali ini blog panduan webmu akan memberikan sedikit turtorial tentang menu header , daya tarik sebuah website adalah bagian header atau bagian atasnya ,jadi jika website atau blog kalian sudah tidak menarik dari bagian header kalian , lantas bagaimana viewer kalian mau scroll kebawah

trick ini cocok untuk mengakali header kalian yang Position : static; dan kalian malas mengoprek oprek header kalian agar tampilannya Fixed saat di scroll seperiti blog blog diluar sana yang lebih keren , seperti : blog kangismet, eltelu, blog kangrian, dan lain lain atau kalia bisa cek blog demo yg ini : demo  Yaudah yuk kita langsung ke scriptnya :)

 langkah langah cara membuat fixed header blog dan web mudah , sebagai berikut :

#1 Membuat css .scroll
  1. buka blogger dashboard kalian
  2. buka theme > edit html
  3. lalu cari code <b:skin> 
  4. Sisipan css ini di bawah code diatas tersebut
    /*scroll fixed*/
    .scroll{
    position:fixed;
    width:100%;
    z-index:999999;
    }
  5. Save Template
 jangan dulu liat blog kalian, karena javascriptnya belum di pasang , jadi balik lagi edit html blog kalian ,tenang cara ini sangat sangat mudah kok, yuk buka lagi html editor blog/website kalian, yuk check this out !

#2 Menambahkan script untuk meng aplikasian ke template
  1. Cari code </body>
  2. Lalu sisipkan code dibawah ini diatas code tersebut
    <script type='text/javascript'>
        $(window).scroll(function () {
        var sc = $(window).scrollTop()
        if (sc > 50) {
            $("header").addClass("scroll")
        } else {
            $("header").removeClass("scroll")
        }
    });
        </script>
          Keterangan :
    • 50 : itu jarak in pixel
    • header : code <header> sebagai target
    • scroll : css yang tadi kita buat

  3. Save Template
Coba sekarang kalian cek blog kalian apakah berhasil atau tidak trik ini , jika kalian sedikit mengerti code html maka seharusnya bisa dan work , nah klo ada sesuatu yang ingin ditanyakan silahkan tinggalkan comment dan tolong hargai writer dengan mreninggalkan comment yg relevan

Read More