I finally just got my Symfony2 app to work in Heroku except that it's not getting any CSS or JS. Does anyone know what the problem might be?
Including <head> code from the base.twig.html
<head>
<meta charset="UTF-8" />
<title>{% block title %}Machine{% endblock %}</title>
{% block stylesheets %}
<link rel="stylesheet" type="text/css" href="{{ asset('bundles/bmatznerfoundation/css/foundation.min.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('bundles/project/css/main.css') }}">
<link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="{{ asset('bundles/project/js/jquery-1.11.2.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('bundles/project/js/script.js') }}"></script>
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('bundles/project/favicon.ico') }}">
</head>
I noticed that it seems to be using Symfony2 favicon and such. So it might be using the wrong directory somehow, or bundle, for the "web" view of things.
it's
Root >
Web >
bundles >
bmatznerfoundation > ...
framework > (original symfony junk)
project > (THE FILES I WANT)
.htaccess
app.php
app_dev.php
apple-touch-icon.png
config.php
favicon.ico (a Symfony icon)
robots.txt
Haha, this is silly, in my .gitignore file, /web/bundles was there. I simply removed it, re-committed, then everything worked great!
Related
I created a new Laravel project and downloaded the bootstrap CSS and JS files and put the CSS file in resources/css and the JS files of bootstrap and popper and jQuery in resources/js and in the welcome.blade.php I linked the CSS file and the JS files like this
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Osama The Coder</title>
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head>
<body>
<section class="text-danger">
Hello World
</section>
<script src="{{ asset('js/jquery-3.6.0.min.js') }}"></script>
<script src="{{ asset('js/popper.min.js') }}"></script>
<script src="{{ asset('js/bootstrap.min.js') }}"></script>
</body>
</html>
when I opened the project it was just the text without any styles or Bootstrap font-family
even when I linked the app.css and applied color red to the section element I doesn't see any changes
Please follow the following steps
Put all your static assets in public directory
Organize your assets in different folders e.g public/js for js related files and public/css for css related files
Then access your files using the helper method like below
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}">
/* or js files */
<script src="{{ asset('js/jquery-3.6.0.min.js') }}"></script>
I want change in code of open cart theme but all files is .twig so when I write php code in it don't work . until when i change in the stylesheet file . the theme don't see any changes.
how I can change .twig to php and make the theme see the changes in css file ??
this is part of header.twig
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{{ title }}</title>
<base href="{{ base }}" />
{% if description %}
<meta name="description" content="{{ description }}" />
{% endif %}
{% if keywords %}
<meta name="keywords" content="{{ keywords }}" />
{% endif %}
<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,300,700" rel="stylesheet" type="text/css" />
I want to add this code to it but when I put it in header.twig it don't work
<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/style.css">
<?php if($direction=='rtl'){?>
<link rel="stylesheet" type="text/css" href="catalog/view/theme/default/stylesheet/rtl-style.css">
<?php }?>
You really shouldn't mix PHP with TWIG. Just use passed variables. Check the documentation for more info:
https://www.opencart.com/index.php?route=marketplace/extension/info&extension_id=29835
https://twig.symfony.com/doc/2.x/
Use this extension to enable twig: https://www.opencart.com/index.php?route=marketplace/extension/info&extension_id=29835
The CSS don't load em some routes, example, a route with a var:
//LINK
Route::get('/link/{id}', 'PagesController#link');
TEMPLATE:
<link rel="stylesheet" href="../public/css/style.css">,
How I can fix it?
To generate URL's for assets like CSS/JS/images/etc., in Laravel, use the helper function asset, instead of specifying the relative URL:
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
See the documentation
<link rel="stylesheet" href="{{ asset('public/css/style.css') }} ">
or
<link rel="stylesheet" href="{{ asset('css/style.css') }} ">
Use absolute paths like this (starting from the end of 'public'):
<link rel="stylesheet" href="/css/style.css">,
The right solution is the following one:
<link rel="stylesheet" href="/css/style.css">
Don't forget to add the / before the css/style.css or it wont load.
This question already has an answer here:
Install assets from app directory
(1 answer)
Closed 7 years ago.
Im having problems with loading my css and js files.
Css and js are in app/Resources/views/css and app/Resources/views/js folders
This is my app/Resources/views/base.html.twig
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %}Welcome!{% endblock %}</title>
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
<link rel="stylesheet" type="text/css" href="../app/Resources/views/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../app/Resources/views/css/bootstrap-theme.min.css" />
</head>
<body>
{% block body %}{% endblock %}
<!-- this also doesnt work ofcourse -->
<script src="../app/Resources/views//js/jquery-2.1.4.min.js"></script>
<script src="../app/Resources/views//js/bootstrap.min.js"></script>
</body>
</html>
It cant find my files.
How should i solve this?
Thanks!
Your "app" folder is outside the webroot and can't be accessed. Put the files in the "web" folder instead!
I would like to generate a pdf from an html.twig template but something wrong...
In fact, the PDF has been create with the good content but there is no layout. It's seems the CSS files are not import...
I use Bootstrap from twitter to manage the layout.
Here the part of my controller
$filename = "CI-TRI-".$Chrono->getChrono();
$this->get('knp_snappy.pdf')->generateFromHtml(
$this->renderView('WebStoreMainBundle:Admin:customInvoiceTemplate.html.twig', array('User'=>$User,'Parts'=>$parts, 'device'=>$device, 'rate'=>$rate)),
__DIR__.'/../../../../web/download/'.$filename.'.pdf'
);
And here my layout :
<html>
<head>
{% block stylesheets %}
<link rel="stylesheet" type="text/css" href="{{ asset('bootstrap/css/bootstrap.css') }}">
<link rel="stylesheet" type="text/css" href="{{ asset('bootstrap/css/customInvoice.css') }}">
<base href="http://{{app.request.host}}">
<meta charset="UTF-8" >
{% endblock %}
</head>
<body>
{% block header %}
<div class="span2">
<img src="{{ asset('bootstrap/img/GTO_logo.png') }}">
</div>
{% endblock %}
{% block content %}
{% endblock %}
</body>
Wish someone can help me..
PS: Sorry for the typos, english is not my native language.
It would be easier to supply absolute parameter like that:
<link rel="stylesheet" type="text/css" href="{{ asset('bootstrap/css/bootstrap.css', absolute=true) }}">
The assets must be linked using absolute paths. So instead of:
<link rel="stylesheet" type="text/css" href="{{ asset('bootstrap/css/bootstrap.css') }}">
It should be:
<link rel="stylesheet" type="text/css" href="http://yourdomain.com/bootstrap/css/bootstrap.css">
I had this issue myself and this sorted it out for me.
Take note when using Symfony 2.7, Twig has removed absolute argument for asset() function.
<link rel="stylesheet" type="text/css" href="{{ absolute_url(asset('bootstrap/css/bootstrap.css')) }}">
See New in Symfony 2.7: the new Asset component for more info.
#user1805558's answer worked for me. I was also using Less, and used this, which some may find helpful to see:
{% block stylesheets %}
{% stylesheets filter='lessphp' combine=true output='css/pdf.css.twig'
'../app/Resources/assets/css/pdf.less'
%}
<link rel="stylesheet" type="text/css" href="{{ asset(asset_url, absolute=true) }}"/>
{% endstylesheets %}
{% endblock %}
UP for absolute option in asset call :
<img src="{{ asset('/assets/img/AVNZ-Logo-H-SMALL.jpg', absolute=true) }}">
It's related in official bundle repo :
https://github.com/KnpLabs/KnpSnappyBundle/issues/78
I had the same problem. As commented in this issue your asset URLs need to be absolute.
This can be accomplished in symfony using the asset twig funtion and "package urls":
http://symfony.com/doc/current/reference/configuration/framework.html#assets-base-urls
For example:
<link rel="stylesheet" type="text/css" href="{{ asset('bootstrap/css/bootstrap.css') }}">
And then, in your app/config/config.yml
framework:
# ...
templating:
assets_base_urls:
http:
- "http://yourdomain.com/"
If you are in your local configuration, inside your config_dev.yml you should use a different URL instead, like:
- "http://localhost/myproject/web/"