0

I am trying to make an ecommerce store in codeigniter frameworks. I have downloaded a template and converted it according to the code igniter file systerm. I have separated header and footers. There is a controller that loads the index.php page. Now the problem is that none of my glyphicons are working.

This is how I have linked bootstrap

<link href="<?php echo base_url();?>css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />

and there is this icon coded in the same file like this 

<div class="w3l_login">
                <a href="#" data-toggle="modal" data-target="#myModal88">
                    <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
                </a>
            </div>

All the folders for js, css and images are at the root directory exactly where the folders like application and system folder recides. All the css and js effects are being loaded by this but only the glyphicons are causing trouble. How do I solve this?

This is how glyphicon fonts are being loaded

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
   url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'),
    url('../fonts/glyphicons-halflings-regular.woff') format('woff'), 
  url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
   url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

This piece of code is from bootstrap.css file.

Bhaumik Bhatt
  • 446
  • 8
  • 21
  • Browser console say anything? – 04FS Feb 07 '20 at 09:01
  • Yes it gives this Loading failed for the – Bhaumik Bhatt Feb 07 '20 at 09:12
  • and specifically for glyphicon it is giving CORS error Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://[::1]/code/fonts/glyphicons-halflings-regular.woff2. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). – Bhaumik Bhatt Feb 07 '20 at 09:14
  • https://stackoverflow.com/questions/33197751/fonts-are-blocked-in-web-client-cors, https://stackoverflow.com/questions/27726802/css-font-being-blocked-from-cross-origin-resource-sharing-policy – 04FS Feb 07 '20 at 09:15
  • I saw the answer but I still do not understand and also can I have a solution without editing .htaccess file? – Bhaumik Bhatt Feb 07 '20 at 10:06
  • If you don’t want to add any HTTP headers, then you have to see to it that the fonts are not requested from a different origin to begin with. The font gets requested from `http://[::1]/` according to your error message, but you seem to access your project via some different base URL. These two need to match, if you don’t want any CORS issues regarding web fonts. – 04FS Feb 07 '20 at 10:12
  • Yes but I have the font files in localhost and I am trying to access the site using the same localhost so I amm not able to figure out what to do – Bhaumik Bhatt Feb 07 '20 at 10:41
  • You’re gonna need to figure out what makes your system create that kind of URL for embedding the fonts to begin with. You have only shown how you embed the bootstrap CSS, so is that responsible for loading the fonts as well? If so, maybe you need to configure your system to use a different base URL then. – 04FS Feb 07 '20 at 10:58
  • I have edited my question to show how this glyphicons are being loaded. – Bhaumik Bhatt Feb 07 '20 at 11:06
  • These are relative URLs, so they get resolved against the URL of your stylesheet. So that must mean, your stylesheet itself gets embedded using `http://[::1]/…` already, and that in turn means, this is indeed due to the return of the `base_url` function you are calling there … so, go check where that value is configured / created. – 04FS Feb 07 '20 at 11:11
  • So does that mean that I have to convert the file to php and use base_url() before the path? – Bhaumik Bhatt Feb 08 '20 at 07:02
  • All the resources are coming from the same URL only these glyphicons are causing problems. Why?????? – Bhaumik Bhatt Feb 10 '20 at 07:32

0 Answers0