FontAwesome icons not showing, why? - installation

No matter what I try, every single time I want to install FontAwesome into any project, it does not work and I have to try and figure out for many hours why not. What is going wrong here? I've put both the css and webfonts directory into the same directory called fontawesome. I've linked to those files and I literally tried everything I could think of:
URL with dots,
URL without dots,
no first slash,
with first slash,
HTML file,
PHP file,
Changing URLS in all.css (same as above) to point to the right path...
There is no icon showing, not even a 'missing icon' square. The file opened here is index.php and is located directly inside the admin directory (not in a subdirectory).
What am I missing here?

Use this cdn link and remove all other fontawasome cdn links
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
For Example :
<html>
<head>
<title>Demo</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
</head>
<i class="fa fa-address-book" aria-hidden="true"></i>
</html>

Related

LARAVEL 9: I cannot reach my css file code anytime i have a doube url like this : /user/profile. How can i solve this?

LARAVEL 9: I am using a template in Laravel 9 and I cannot reach my CSS file code anytime I have a double URL like this : /user/profile. However, It only works when I have a single URL like this: /profile. But I want to be able to reach my CSS files when I have double URLs. How can I solve this? Any suggestions?
Did you put the files correctly in the public folder?
Do you invoke it correctly within the blade as the following example:
<link href="{{URL::asset('assets/plugins/fontawesome-free/css/all.min.css')}}" rel="stylesheet">
Have you checked the error by inspecting your browser?
You can check this link contains many useful examples for your case
Put a slash "/" at the beginning of the css address. For example if you have somethin like this:
<link rel="stylesheet" type="text/css" href="css/style.css">
Change it to this:
<link rel="stylesheet" type="text/css" href="/css/style.css">

<link rel the bootstrap-4 Source files?

I've been developing a site with bootstrap 4 and linking externally to:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
However, I need to load the site locally as the network connection isn't stable. So I downloaded the full stack bootstrap-4.0.0 Source file and added it to my WebServer directory thinking all I need to do is change the link to to point to bootstrap.min.css, like this:
<link rel='stylesheet' href="http://localhost/webfiles/wp-content/themes/Cussons/bootstrap-4.0.0/dist/style.css?ver=4.9.4">
The site works, but I'm getting a 404 not found for style.css?ver=4.9.4
All permissions at set to allow full access and I cleared caches and all of the links href's appear correct, but I cant seem to get my head around why the site wont pick up the color changes I've added to files like /assests/scss/_navbar.ccss
If anyone can see whats wrong, I'll be very grateful :)
Just download the precompiled files here, place them in an accessible folder and then link them like :
<link rel="stylesheet" href="relative_path_to_css_parent_folder/css/bootstrap.min.css">
same for the js at the bottom of the body :
<script src="relative_path_to_js_parent_folder/js/bootstrap.min.js">
or
<script src="relative_path_to_js_parent_folder/js/bootstrap.bundle.min.js">
Take a look at this : How do I link to my css stylesheet for local file?
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="UI.css"> <!-- made up name-->
<script src="jquery.js"></script><!-- made up name-->
<script src="jquery.ui.js"></script><!-- made up name-->
<script src="script.js"></script>
But what if the js files are all in the projects/js/ folder? Point
your page to this location:
Assuming our HTML is in the blackjack folder, which is a sibling
folder to 'projects/js', then your script tags will look something
like this:
<script src="../js/script.js"></script>
Notice the ../? This references the parent folder of the one the
document is in. We go up one level to where the js folder is.

URL rewrite issue not loading .css

I'm porting an old site to a new template and am having problems with the Windows 2008 rewrite module. The link I'm trying to rewrite looks like this:
http://ltweb2008.serveronline.net/product.php?pID=75
and brings up the page just fine. Then I apply the new URL and it loads the proper content, but doesn't load the template's style.css file anymore.
http://ltweb2008.serveronline.net/product/75/any-text-here
The problem seems to be that the company who made the template (canvas) put the main .css file in the root directory, but loaded all the rest in /css. Now I can't get the main .css file to load using the rewrite and when I move it down to /css it only displays a blank page, though when I check out the page source it's all there.
With this the page shows but is not using style.css (with rewrite):
<link rel="stylesheet" href="style.css" type="text/css" />
With any of these the page is completely blank (with rewrite):
<link rel="stylesheet" href="/style.css" type="text/css" /> OR
<link rel="stylesheet" href="/css/style.css" type="text/css" /> OR
<link rel="stylesheet" href="http://ltweb2008.serveronline.net/style.css" type="text/css" />
I'm using this for the Pattern:
^product/([0-9]+)/([^/]+)$
And the Rewrite URL:
/product.php?pID={R:1}
Does anyone know what I'm missing?
one solution is that use absolute path (ex /css, or /js rather than just css/, /js but this is not looks a reliable solution since we've to change it on all files,
This is because your relative URIs have their base changed. Originally, the base is / when the page is /product.php?id=75, and the browser properly fills in relative links with the / base. But when the browser goes to a page like /product/75/any-text-here the base suddenly becomes /product/ and it tries to append that in front of all relative URLs and thus none of them load.
You can either make your links absolute, or change the URI base in the header of your pages (inbetween the <head> </head> tags):
<base href="/">
Maybe you need one thing, maybe both, I didn't test, but this solved it for me:
1.) ADD THIS in page_load :
Page.Header.DataBind() ' Needed because we have <%# %> codeblocks in the HEADER (seems header only causing this) WITH the AjaxControlToolkit running on the page. That's what broke it until we put in this and put in the pound instead of = sign in the html.
2.) Add this in ASPX:
<%# MasterType VirtualPath="~/dir1/dir2whateverdir/MasterPage.master" %>

Where to put css file in laravel project

I have been searching for an answer to this question with no luck. This is my second day using laravel and I'm trying to create a custom 404 error page. I don't know where/how to include my .css file. Can someone please help me with this?
Place your css files inside public folder and use link tag in html document (or 404 template)
Example
<link rel="stylesheet" type="text/css" href="{{ url('/css/style.css') }}" />
The best way is using blade syntax with the laravel helper for what you need
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
this folder css or whatever you named it, must be placed inside your public folder.
Search for Public folder in Laravel.
Create css folder (that contains stylesheet files of your project), javascript and Images folder (contains images that you will use in your project).
Go to layouts in app.blade.php file update html code using blade syntax:
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
and JS:
<script src="{{ asset('pickadate/lib/picker.js')}}"></script>
1. put your CSS file in directory [PUBLIC/CSS]
2. in your FileName.blade.php in file just write :
<head> <link rel="stylesheet" href={{ asset('css/article.css')}}> </head>
Note Again : Don't Write asset('public/css/article.css') this wrong
put it in your public file and the html tags in view then to connect them with the css use
<link rel="stylesheet" href="{{ URL.asset('css/style.css') }}">
<link rel="stylesheet" href="css/app.css">
simply add this your blade.php file

Print order in Magento 1.7 not using theme CSS

I've successfully setup my theme and using it for the rest of my site on Magento 1.7, however the print order screen (http://<my-domain>/index.php/sales/order/print/order_id) seems to be ignoring local.css and using all of the styles from styles.css.
For example button.button span from styles.css is being used for the Close button when I have this in local.css and the rest of the site uses this. I've even tried to set a more specific selector but this gets ignored.
Is there something simple I'm missing on this screen as I haven't had this problem anywhere else.
Edit: Workaround solution: I viewed the source HTML of the page and can definitely see that local.css is not loaded anywhere in the page. On other pages I can see it being pulled in. Seems like a bug in Magento 1.7.0.2, so I copied /app/design/frontend/base/default/template/page/print.phtml to my template path(/app/design/frontend/default/<my-theme>/template/page/print.phtml) and fixed.
It seems this block isn't doing what it's meant to do and does in other pages
<head>
<?php echo $this->getChildHtml('head') ?>
</head>
So in my copy of the file in my template directory I added the line below just before </head> which worked.
<link rel="stylesheet" type="text/css" href="<?php echo $this->getSkinUrl('css/local.css') ?>" media="all" />
I logged a defect here: http://www.magentocommerce.com/bug-tracking/issue?issue=15841

Resources