laravel 8 is not loading css and js/bootstrap - html

I don't know why, this isn't my first project in laravel but my css isn't working and I can't find any problem in my code, maybe i'm tired or something but this kept me stuck for about 10hours.
It seems that my CSS isn't working, why? I dont know, I have all my folders in the public folder and my website it's not looking at all like the template.
<link href="{{ asset ('animate.css/animate.css') }}'" rel="stylesheet" type="text/css" />
<link href="{{ asset ('fontawesome/css/all.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset ('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700') }}" rel="stylesheet" />
<link href="{{ asset ('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,800,900') }}" rel="stylesheet" />
<link href="{{ asset ('chosen/chosen.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset ('jquery-ui-custom/jquery-ui.min.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset ('pentix/css/pentix.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset ('css/pex-theme.css') }}" rel="stylesheet" type="text/css">
I don't see any error in the terminal neither when I use CTRL + U, all the CSS links are oppening.

My suggestion
<link href="{{ asset ('animate.css/animate.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset ('fontawesome/css/all.css') }}" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Raleway:400,500,600,700" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,800,900" rel="stylesheet" />
<link href="{{ asset ('chosen/chosen.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset ('jquery-ui-custom/jquery-ui.min.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset ('pentix/css/pentix.css') }}" rel="stylesheet" type="text/css">
<link href="{{ asset ('css/pex-theme.css') }}" rel="stylesheet" type="text/css">
You have extra ' in your first asset css here
mate.css') }}'"
If any js or css doesn't working simply try by checking on url like
http://localhost:8000/animate.css/animate.css
and use php artisan serv to run laravel application

the correct syntax to link scrripts and css in laravel is:
link rel="stylesheet" href="{{asset('new_assets/assets/css/style.css')}}"
i have used this in my laravel project my css file are in the "new_assets/assets/css/style.css".
the first "asset" word within two opening courly braces it points to the laravel/public folder.make sure when you are using {{asset('some path')}} then that css or file/folder is in the public folder.

Use the below code:
<link href="{{asset('animate.css/animate.css')}}" rel="stylesheet" type="text/css">
<link href="{{asset('fontawesome/css/all.css')}}" rel="stylesheet" type="text/css">
<link href="{{asset('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700')}}" rel="stylesheet" type="text/css">
<link href="{{asset('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,800,900')}}" rel="stylesheet" type="text/css">
<link href="{{asset('chosen/chosen.min.css')}}" rel="stylesheet" type="text/css">
<link href="{{asset('jquery-ui-custom/jquery-ui.min.css')}}" rel="stylesheet" type="text/css">
<link href="{{asset('pentix/css/pentix.css')}}" rel="stylesheet" type="text/css">
<link href="{{asset('css/pex-theme.css')}}" rel="stylesheet" type="text/css">

<link href="{{ public_path ('animate.css/animate.css') }}'" rel="stylesheet" type="text/css" />
<link href="{{ public_path ('fontawesome/css/all.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ public_path ('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700') }}" rel="stylesheet" />
<link href="{{ public_path ('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,800,900') }}" rel="stylesheet" />
<link href="{{ public_path ('chosen/chosen.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ public_path ('jquery-ui-custom/jquery-ui.min.css') }}" rel="stylesheet" type="text/css">
<link href="{{ public_path ('pentix/css/pentix.css') }}" rel="stylesheet" type="text/css">
<link href="{{ public_path ('css/pex-theme.css') }}" rel="stylesheet" type="text/css">

Related

HTML ignores link directive, and makes no request

I am making a login screen, and trying to attach css to my file, but the CSS is not being loaded, as in no request is made, no errors are thrown, the link tag is ignored
<!doctype html>
<html>
<head>
<!-- This doesn't work -->
<link rel="stylesheet" src="/static/css/skeleton.css"/>
<link rel="stylesheet" src="/static/css/normalize.css"/>
<link rel="stylesheet" src="/static/css/main.css"/>
<script src="/static/js/login.js"></script>
</head>
<body>
<h1>Login</h1>
<form>
<input id="email" type="email" placeholder="Email">
<input id="password" type="password" placeholder="Password">
<button type="button" onclick="loginClick()">Login</button>
</form>
<p id="errorMessage"></p>
</body>
</html>
I am running a web server that handles redirection by itself, but here is my hierarchy
The link tag uses href instead of src, all you need is to substitute the attribute name.
Before:
<link rel="stylesheet" src="/static/css/skeleton.css"/>
<link rel="stylesheet" src="/static/css/normalize.css"/>
<link rel="stylesheet" src="/static/css/main.css"/>
After:
<link rel="stylesheet" href="/static/css/skeleton.css"/>
<link rel="stylesheet" href="/static/css/normalize.css"/>
<link rel="stylesheet" href="/static/css/main.css"/>
All you need to do here is replace
<link rel="stylesheet" src="/static/css/skeleton.css"/>
<link rel="stylesheet" src="/static/css/normalize.css"/>
<link rel="stylesheet" src="/static/css/main.css"/>
With this code :
<link rel="stylesheet" href="/static/css/skeleton.css"/>
<link rel="stylesheet" href="/static/css/normalize.css"/>
<link rel="stylesheet" href="/static/css/main.css"/>
you cannot use src for including files to your HTML in header. you need to replace all the src with href. Also consider following standards and adding the type type="text/css"
in the end you should have this;
<link rel="stylesheet" type="text/css" href="/static/css/skeleton.css"/>
<link rel="stylesheet" type="text/css" href="/static/css/normalize.css"/>
<link rel="stylesheet" type="text/css" href="/static/css/main.css"/>

CSS file won't load in

My CSS file won't load in.
I've tried it with style tags but I don't like that
<link rel="stylesheet" href="style/scss">
<link rel="stylesheet" type="text/css" href="{{ url('style/scss.css') }}">
<link rel="stylesheet" type="text/css" href="path/to/file.css">

The Title of my website isn't showing in the TAB after hosting it?

I'm a newbie in web development just started learning!
after i finished my first portfolio i tried hosting it in "www.000webhost.com" everything is working fine but the title and the favicon aren't showing at all .
but launching the index.html in my browser it works so fine!
here is the head code :
<head>
<title>E-Sabri | Welcome</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="img/l.ico">
<link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'>
<link href="https://fonts.googleapis.com/css?family=Barlow+Condensed" rel="stylesheet">
<link rel="stylesheet" href="bower_components/aos/dist/aos.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css'>
<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300" rel="stylesheet">
<link rel="stylesheet" href="https://unpkg.com/simplebar#latest/dist/simplebar.css" />
<script src="https://unpkg.com/simplebar#latest/dist/simplebar.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://a2.muscache.com/airbnb/static/libs_jquery_2x-4c61948b1a5fa686ed70f7b9bf4a18c9.js" type="text/javascript"></script>
<script src="https://use.typekit.net/iun0wqe.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<script src="css/jquery.mCustomScrollbar.concat.min.js"></script>
<link rel="stylesheet" href="css/jquery.mCustomScrollbar.js" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Slabo+27px" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Saira+Extra+Condensed" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Vollkorn+SC" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
I'm looking forward to your answers thanks for your help !
The website url is : www.Esabri.tk
TLD services (like TK domains) offer two ways of shorten URL,
Redirect
iFrame
You are using the iFrame method, change it to 'Redirect' in the URL settings.
SOLVED
After trying over and over i decided to not park my domain but to POINT IT and it worked so fine ! thanks everyone for your answers have a good day

Link stylesheet from another html

Hi there I would like to import a stylesheet import from another folder/ file when I put it on the other file and import it, it seems to have appear nothing...
folderpath:
app/css/stylesheeta.css
app/css/stylesheetb.css
app/css/stylesheetc.css
app/css/stylesheetd.css
app/module/module.js
app/lib/module/abc.js
In the html page,
app/views/stylsheet.html:
<link rel="stylesheet" href="../css/stylesheeta.css" />
<link rel="stylesheet" href="../css/stylesheetb.css" />
<link rel="stylesheet" href="../css/stylesheetc.css" />
<link rel="stylesheet" href="../css/stylesheetd.css" />
<link rel="stylesheet" href="../module/module.css" />
<link rel="stylesheet" href="../lib/module/abc.css" />
In the main index.html
/index.html:
I include the stylesheet.html:
<head>
<link rel="import" href="app/views/stylsheet.html" />
</head>
<body>
//some other stuff here
</body>
however there isn't any output of the stylesheet at all.. im wondering if what I do is permissable

Favicon is not displaying

I can't find the problem, my favicon is not working.
HTML
<head>
<title>SuomiFTB</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/text.css">
<link rel="shortcut icon" href="http://suomiservut.arkku.net/Finland-icon.ico">
</head>