Category Archives: Disain Website

Cara Membuat favicon Menggunakan ImageMagick

Pertama sediakan atau buat sebuah gambar atau logo transparan, dalam contoh ini saya menggunakan GIMP dan menyimpan hasilnya dengan nama rahmatriyanto.png

Logo rahmatriyanto

Pastikan Imagemagick sudah terinstall di Linux dan gunakan code ini di terminal linux

convert -resize x16 -gravity center -crop 16x16+0+0  -flatten -colors 256 rahmatriyanto.png favicon.ico

 

Untuk membuat icon transparan dapat memakai code ini

convert -resize x16 -gravity center -crop 16x16+0+0 -flatten -colors 256 -background transparent rahmatriyanto.png favicon.ico

 

Selesai, terakhir upload file icon favicon.ico diroot folder tanpa perlu memambah code apapun di dalam head html/php. Jika menggunakan wordpress.com, blogspot.com atau layanan yang lain upload favicon.ico cari linknya dan tambahkan code ini sebelum code </head> seperti dibawah ini

<link href='https://www.rahmatriyanto.com/favicon.ico' rel='icon' type='image/x-icon'/>

Cara Menulis Simbul & Karakter Khusus dalam HTML

Kode Nomor HTML Kode Nama HTML Tampilan Simbul Karakter Keterangan
&#32; Spasi
&#33; ! Tanda seru
&#34; &quot; " Kutip ganda
&#35; # Simbol pagar
&#36; $ Simbol dollar
&#37; % Simbol persen
&#38; &amp; & Simbol dan
&#39; ' Kutip satu
&#40; ( Kurung buka
&#41; ) Kurung tutup
&#42; * Tanda bintang
&#43; + Tanda tambah
&#44; , Tanda koma
&#45; - Tanda kurang
&#46; . Tanda titik
&#47; / Garis miring
&#48; 0 Nol
&#49; 1 Satu
&#50; 2 Dua
&#51; 3 Tiga
&#52; 4 Empat
&#53; 5 Lima
&#54; 6 Enam
&#55; 7 Tujuh
&#56; 8 Delapan
&#57; 9 Sembilan
&#58; : Titik dua
&#59; ; Titik koma
&#60; &lt; < Kurang dari
&#61; = Sama dengan
&#62; &gt; > Lebih dari
&#63; ? Tanda tanya
&#64; @ Simbol [at]
&#65; A
&#66; B
&#67; C
&#68; D
&#69; E
&#70; F
&#71; G
&#72; H
&#73; I
&#74; J
&#75; K
&#76; L
&#77; M
&#78; N
&#79; O
&#80; P
&#81; Q
&#82; R
&#83; S
&#84; T
&#85; U
&#86; V
&#87; W
&#88; X
&#89; Y
&#90; Z
&#91; [ Kurung siku buka
&#92; Garis miring terbalik/backslash
&#93; ] Kurung siku tutup
&#94; ^ Tanda sisipan/sirkumfleksa
&#95; _ Garis bawah
&#96; ` Tanda petik
&#97; a
&#98; b
&#99; c
&#100; d
&#101; e
&#102; f
&#103; g
&#104; h
&#105; i
&#106; j
&#107; k
&#108; l
&#109; m
&#110; n
&#111; o
&#112; p
&#113; q
&#114; r
&#115; s
&#116; t
&#117; u
&#118; v
&#119; w
&#120; x
&#121; y
&#122; z
&#123; { Kurung kurawal buka
&#124; | Garis tegak/pipe
&#125; } Kurung kurawal tutup
&#126; ~ Simbol ekuivalen
&#160; &nbsp; Non-breaking space
&#161; &iexcl; ¡ Tanda seru terbalik
&#162; &cent; ¢ Simbol sen
&#163; &pound; £ Simbol pondsterling
&#164; &curren; ¤ Simbol mata uang
&#165; &yen; ¥ Simbol yen
&#166; &brvbar; ¦ Garis tegak terputus
&#167; &sect; § Simbol bagian/seksi
&#168; &uml; ¨ Titik dua di atas huruf vokal
&#169; &copy; © Simbol hak cipta (Copyright)
&#170; &ordf; ª Indikator ordinal feminin
&#171; &laquo; « Panah kiri ganda
&#172; &not; ¬ Simbol bukan
&#173; &shy; ­ Tanda penghubung halus
&#174; &reg; ® Simbol merek dagang terdaftar (Registered trademark)
&#175; &macr; ¯ Garis atas
&#176; &deg; ° Simbol derajat
&#177; &plusmn; ± Simbol lebih kurang
&#178; &sup2; ² Pangkat dua, kuadrat, persegi
&#179; &sup3; ³ Pangkat tiga, kubik
&#180; &acute; ´ Aksen akut
&#181; &micro; µ Simbol mikro
&#182; &para; Simbol pilcrow, simbol paragraf
&#183; &middot; · Titik tengah, koma Georgia
&#184; &cedil; ¸ Spasi cedilla
&#185; &sup1; ¹ Pangkat satu
&#186; &ordm; º Indikator ordinal maskulin
&#187; &raquo; » Panah kanan ganda
&#188; &frac14; ¼ Satu per empat
&#189; &frac12; ½ Satu per dua, setengah
&#190; &frac34; ¾ Tiga per empat
&#191; &iquest; ¿ Tanda tanya terbalik
&#192; &Agrave; À
&#193; &Aacute; Á
&#194; &Acirc; Â
&#195; &Atilde; Ã
&#196; &Auml; Ä
&#197; &Aring; Å
&#198; &AElig; Æ
&#199; &Ccedil; Ç
&#200; &Egrave; È
&#201; &Eacute; É
&#202; &Ecirc; Ê
&#203; &Euml; Ë
&#204; &Igrave; Ì
&#205; &Iacute; Í
&#206; &Icirc; Î
&#207; &Iuml; Ï
&#208; &ETH; Ð
&#209; &Ntilde; Ñ
&#210; &Ograve; Ò
&#211; &Oacute; Ó
&#212; &Ocirc; Ô
&#213; &Otilde; Õ
&#214; &Ouml; Ö
&#215; &times; × Simbol perkalian
&#216; &Oslash; Ø
&#217; &Ugrave; Ù
&#218; &Uacute; Ú
&#219; &Ucirc; Û
&#220; &Uuml; Ü
&#221; &Yacute; Ý
&#222; &THORN; Þ
&#223; &szlig; ß
&#224; &agrave; à
&#225; &aacute; á
&#226; &acirc; â
&#227; &atilde; ã
&#228; &auml; ä
&#229; &aring; å
&#230; &aelig; æ
&#231; &ccedil; ç
&#232; &egrave; è
&#233; &eacute; é
&#234; &ecirc; ê
&#235; &euml; ë
&#236; &igrave; ì
&#237; &iacute; í
&#238; &icirc; î
&#239; &iuml; ï
&#240; &eth; ð
&#241; &ntilde; ñ
&#242; &ograve; ò
&#243; &oacute; ó
&#244; &ocirc; ô
&#245; &otilde; õ
&#246; &ouml; ö
&#247; &divide; ÷ Simbol pembagian
&#248; &oslash; ø
&#249; &ugrave; ù
&#250; &uacute; ú
&#251; &ucirc; û
&#252; &uuml; ü
&#253; &yacute; ý
&#254; &thorn; þ
&#255; &yuml; ÿ
&#338; &OElig; Œ
&#339; &oelig; œ
&#352; &Scaron; Š
&#353; &scaron; š
&#376; &Yuml; Ÿ
&#402; &fnof; ƒ
&#710; &circ; ˆ
&#732; &tilde; ˜
&#913; &Alpha; Α Alpha
&#914; &Beta; Β Beta
&#915; &Gamma; Γ Gamma
&#916; &Delta; Δ Delta
&#917; &Epsilon; Ε Epsilon
&#918; &Zeta; Ζ Zeta
&#919; &Eta; Η Eta
&#920; &Theta; Θ Theta
&#921; &Iota; Ι Iota
&#922; &Kappa; Κ Kappa
&#923; &Lambda; Λ Lambda
&#924; &Mu; Μ Mu
&#925; &Nu; Ν Nu
&#926; &Xi; Ξ Xi
&#927; &Omicron; Ο Omicron
&#928; &Pi; Π Pi
&#929; &Rho; Ρ Rho
&#931; &Sigma; Σ Sigma
&#932; &Tau; Τ Tau
&#933; &Upsilon; Υ Upsilon
&#934; &Phi; Φ Phi
&#935; &Chi; Χ Chi
&#936; &Psi; Ψ Psi
&#937; &Omega; Ω Omega
&#945; &alpha; α alpha
&#946; &beta; β beta
&#947; &gamma; γ gamma
&#948; &delta; δ delta
&#949; &epsilon; ε epsilon
&#950; &zeta; ζ zeta
&#951; &eta; η eta
&#952; &theta; θ theta
&#953; &iota; ι iota
&#954; &kappa; κ kappa
&#955; &lambda; λ lambda
&#956; &mu; μ mu
&#957; &nu; ν nu
&#958; &xi; ξ xi
&#959; &omicron; ο omicron
&#960; &pi; π pi
&#961; &rho; ρ rho
&#962; &sigmaf; ς sigmaf
&#963; &sigma; σ sigma
&#964; &tau; τ tau
&#965; &upsilon; υ upsilon
&#966; &phi; φ phi
&#967; &chi; χ chi
&#968; &psi; ψ psi
&#969; &omega; ω omega
&#977; &thetasym; ϑ Simbol theta
&#978; &upsih; ϒ Simbol upsilon
&#982; &piv; ϖ Simbol pi
&#8194; &ensp; Spasi en
&#8195; &emsp; Spasi em
&#8201; &thinsp; Spasi tipis
&#8204; &zwnj; Zero width non-joiner
&#8205; &zwj; Zero width joiner
&#8206; &lrm; Tanda kiri ke kanan
&#8207; &rlm; Tanda kanan ke kiri
&#8211; &ndash; Garis en
&#8212; &mdash; Garis em
&#8216; &lsquo; Kutip kiri tunggal
&#8217; &rsquo; Kutip kanan tunggal
&#8218; &sbquo; Kutip rendah tunggal
&#8220; &ldquo; Kutip kiri ganda
&#8221; &rdquo; Kutip kanan ganda
&#8222; &bdquo; Kutip rendah ganda
&#8224; &dagger; Salib
&#8225; &Dagger; Salib ganda
&#8226; &bull; Peluru
&#8230; &hellip; Ellipsis horisontal
&#8240; &permil; Per mil
&#8242; &prime; Menit
&#8243; &Prime; Detik
&#8249; &lsaquo; Panah kiri tunggal
&#8250; &rsaquo; Panah kanan tunggal
&#8254; &oline; Garis atas
&#8364; &euro; Simbol Euro
&#8482; &trade; Merek dagang
&#8592; &larr; Panah kiri
&#8593; &uarr; Panah atas
&#8594; &rarr; Panah kanan
&#8595; &darr; Panah bawah
&#8596; &harr; Panah kiri kanan
&#8629; &crarr; Simbol Enter/Carriage return
&#8704; &forall;
&#8706; &part;
&#8707; &exist;
&#8709; &empty;
&#8711; &nabla;
&#8712; &isin;
&#8713; &notin;
&#8715; &ni;
&#8719; &prod;
&#8721; &sum;
&#8722; &minus;
&#8727; &lowast;
&#8730; &radic;
&#8733; &prop;
&#8734; &infin;
&#8736; &ang;
&#8743; &and;
&#8744; &or;
&#8745; &cap;
&#8746; &cup;
&#8747; &int;
&#8756; &there4;
&#8764; &sim;
&#8773; &cong;
&#8776; &asymp;
&#8800; &ne;
&#8801; &equiv;
&#8804; &le;
&#8805; &ge;
&#8834; &sub;
&#8835; &sup;
&#8836; &nsub;
&#8838; &sube;
&#8839; &supe;
&#8853; &oplus;
&#8855; &otimes;
&#8869; &perp;
&#8901; &sdot;
&#8968; &lceil;
&#8969; &rceil;
&#8970; &lfloor;
&#8971; &rfloor;
&#9674; &loz;
&#9824; &spades;
&#9827; &clubs;
&#9829; &hearts;
&#9830; &diams;