Kenapa Icon Boostrap Tidak Muncul?

Discussion in 'HTML & Website Design' started by wrep17, Aug 23, 2017.

  1. wrep17

    wrep17 Well-Known Member

    Joined:
    Sep 26, 2015
    Messages:
    1,325
    Likes Received:
    246
    Trophy Points:
    63
    Google+:
    Halo warga bersosial, sedang apa kalian saat ini? Semoga sehat semua dan diberikan kemudahan saat menjalankan aktivitas sehari-hari.

    Sesuai dengan judul diatas, saya ingin bertanya kira-kira kenapa ya? Penyebab permasalahannya apa?
    Saya sudah memasukkan code ini
    Code:
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
    Terus saya coba browsing dan ketemu sama Stack Overflow suruh masukkin code tambahan atau font face, saya milih yang ini aja
    Code:
    <link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
    Akhirnya BISA MUNCUL.
    Akan tetapi, semuanya menjadi mengerut / mengecil berbeda saat sebelum script itu dimasukkan. Agar lebih jelas, mari lihat penampakan berikut.

    Sebelum diberi Code Tambahan
    [​IMG]

    Sesudah diberi Code Tambahan
    [​IMG]

    Ayo2 yang tau pada jawab :p
     
    wrep17, Aug 23, 2017
    #1
  2. ziuma

    ziuma Well-Known Member

    Joined:
    May 23, 2014
    Messages:
    1,564
    Likes Received:
    240
    Trophy Points:
    63
    kalau kodenya seperti dibawah ini, kira-kira muncul ngak

    Code:
    <link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' id='fontawesome' rel='stylesheet' type='text/css'/>
    Code:
    <link href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css' rel='stylesheet' type='text/css'/>
    bisa dilihat diblognya @KangAndre

    Code:
    https://www.lenteraseo.com/mengapa-icon-font-awesome-tidak-muncul
     
    ziuma, Aug 23, 2017
    #2
    wrep17 likes this.
  3. acep saepul

    acep saepul Member

    Joined:
    Jan 4, 2017
    Messages:
    74
    Likes Received:
    2
    Trophy Points:
    8
    Pembahasannya kurang ngerti mas *pusing*
     
    acep saepul, Aug 23, 2017
    #3
  4. wrep17

    wrep17 Well-Known Member

    Joined:
    Sep 26, 2015
    Messages:
    1,325
    Likes Received:
    246
    Trophy Points:
    63
    Google+:
    wrep17, Aug 23, 2017
    #4
  5. ys. herbi

    ys. herbi Well-Known Member

    Joined:
    Mar 6, 2016
    Messages:
    1,251
    Likes Received:
    190
    Trophy Points:
    63
    Google+:
    hmm.. nggak ngeh..
    nyimak buat belajar
     
    ys. herbi, Aug 23, 2017
    #5
  6. Yayan Casper

    Yayan Casper Member

    Joined:
    Jul 18, 2014
    Messages:
    670
    Likes Received:
    77
    Trophy Points:
    28
    Ga mudeng ane ckckckc
     
    Yayan Casper, Aug 23, 2017
    #6
  7. Garett

    Garett Super Level

    Joined:
    Apr 13, 2015
    Messages:
    1,105
    Likes Received:
    1,049
    Trophy Points:
    163
    Google+:
    Itu masalah pada sumber CSS. Selalu gunakan versi 3.x sampai dua tahun mendepan karena alasan kestabilitas dan long-term.

    Saya liat kamu gunakan CSS CDN bersumber dari sumber berbeda sudah kamu cek kalau css satu dengan yang kedua itu berbeda? Yang kedua itu bersi fix 3.0.0 dan hanya menyediakan glyphicons. Padahal versi 3.2+ glyphicons menjadi satu.

    Saran saya gunakan CDN yang berasal dari halaman ini: https://getbootstrap.com/docs/3.3/getting-started/
    Masalah teratasi.
     
    Garett, Aug 23, 2017
    #7
  8. wrep17

    wrep17 Well-Known Member

    Joined:
    Sep 26, 2015
    Messages:
    1,325
    Likes Received:
    246
    Trophy Points:
    63
    Google+:
    Ya sepertinya begitu, saya agak lupa dapetnya darimana :D

    Oh iya dapetnya dari sini https://www.bootstrapcdn.com/
     
    wrep17, Aug 24, 2017
    #8
  9. iwan008

    iwan008 Member

    Joined:
    Aug 17, 2017
    Messages:
    286
    Likes Received:
    26
    Trophy Points:
    28
    pusing ane liat nya,,,nyimak dulu aja siapa tau tar jadi bisa
     
    iwan008, Aug 24, 2017
    #9
  10. Firmanz

    Firmanz Member

    Joined:
    Aug 24, 2017
    Messages:
    46
    Likes Received:
    6
    Trophy Points:
    8
    aku hanya bisa nyimak saja :(
     
    Firmanz, Aug 25, 2017
    #10
  11. Acep Husen

    Acep Husen Member

    Joined:
    Apr 8, 2018
    Messages:
    20
    Likes Received:
    2
    Trophy Points:
    8
    Kalau ini cara saya ya mas, saya download terlebih dahulu bootstrapnya dan jquery jadi untuk bagian <HEAD> seperti ini :
    Code:
    <head><meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<script src="bootstrap/js/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script></head>
    Pada tag <body> kalau kita mau link kita pakai icon jadinya seperti ini :
    Code:
    <a href="https://apapun.com" class="btn btn-primary"><span class="glyphicon glyphicon-list"></span> Klik Link</a>
    Selamat mencoba CMIIW
     
    Last edited by a moderator: Apr 12, 2018
    Acep Husen, Apr 12, 2018
    #11
  12. ncang

    ncang Super Level

    Joined:
    Feb 7, 2013
    Messages:
    4,654
    Likes Received:
    763
    Trophy Points:
    113
    Google+:
    hanya saran, forum ini bisa nulis [ code ] [ / code ] jadi lebih terlihat rapih
    Code:
    kodenya disini
     
    ncang, Apr 12, 2018
    #12
    Acep Husen likes this.
  13. Acep Husen

    Acep Husen Member

    Joined:
    Apr 8, 2018
    Messages:
    20
    Likes Received:
    2
    Trophy Points:
    8
    ohh pakai itu hehehe aduh makasih banget kang hehehe biasanya ada di editor bar hehehe makasih ya sarannya hehehe
     
    Acep Husen, Apr 12, 2018
    #13
  14. Lusfikars

    Lusfikars New Member

    Joined:
    Jun 2, 2018
    Messages:
    8
    Likes Received:
    0
    Trophy Points:
    1
    Paling gampang, download ionicons, karena bootstrap 4 gak include icon. Terus link css dan jsnya seperti ini:

    <link href="/path/to/ionicons/css/ionicons.min.css" rel="stylesheet"> <!--icon pengganti-->
    <link href="/path/to/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <script src="/path/to/jquery/jquery.min.js"></script> <!-- harus ada -->
    <script src="/path/to/bootstrap/js/bootstrap.bundle.min.js"></script>
     
    Lusfikars, Jun 17, 2018
    #14
Loading...
Similar Threads - Kenapa Icon Boostrap
  1. hasan_bersosial

    [ASK] Ada yang tau kenapa postingan lama diindex di webmaster tool ?

    hasan_bersosial, Nov 9, 2015, in forum: HTML & Website Design
    Replies:
    34
    Views:
    7,730
    Unmetered
    Nov 20, 2015
  2. Zerki Juliandri

    [ASK] Kenapa Tampilan Website Jadi Berbeda Di Browser Chrome & Firefox ?

    Zerki Juliandri, Aug 5, 2015, in forum: HTML & Website Design
    Replies:
    18
    Views:
    6,567
    Zerki Juliandri
    Aug 8, 2015
  3. ngeblogasyikk

    ( ask ) Ini Kenapa ya? Help!

    ngeblogasyikk, Mar 9, 2015, in forum: HTML & Website Design
    Replies:
    10
    Views:
    2,302
    ngeblogasyikk
    Mar 21, 2015
  4. exabytes-id

    [Share]free resource video, imageHD & icon

    exabytes-id, Oct 23, 2014, in forum: HTML & Website Design
    Replies:
    2
    Views:
    1,805
    Yusuf.S
    Oct 23, 2014
  5. exabytes-id

    Bingung Bikin Icon Untuk Web? Cek Disini!

    exabytes-id, Feb 27, 2014, in forum: HTML & Website Design
    Replies:
    6
    Views:
    1,782
    DimensiBlock
    Jun 30, 2016

Share This Page