I am getting the following error in Chrome browser
Fatal error:Theme css could not load after 20 sec
I am loading theme css in <head> tag using the following html
<link rel="stylesheet" type="text/css" href="${copart.url("css/galleria/galleria.classic.css")}" name="galleria.classic">
and loading galleria js separately in <body> tag
<group name="galleriaJs">
<js minimize="false">/galleria/galleria-1.3.2.min.js</js>
<js minimize="false">/galleria/themes/classic/galleria.classic.min.js</js>
</group>
I am opening galleria in modal window and loading all the css and js on page in parent window on page load.
As I am loading galleria.classic.min.js using script tag as per my understanding I don't need to load galleria.classic.min.js' separately in my js file using the following method:
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
Your help is greatly appreciated.
Related
In spring-boot application, pointed all css, js, images are in below structure:
JSP page is loading with all css/js/images when the URL is like this http://localhost:8080/request/
But when the URL is like this http://localhost:8080/request/rt/home
(css/image/js are not loading).
When I click the url of bootstrap.min.css from view source page, it is showing like below:
http://localhost:8080/request/rt/public/css/bootstrap.min.css
"rt" is adding in between the url.
How to omit the "rt" from path.
so that will get path like http://localhost:8080/request/public/css/bootstrap.min.css
It will load css/js/images
Please suggest
Without seeing your jsp, according to your statements of how it behaves, I would say that you are declaring your stylesheet and resources reference this way, without starting by a /:
<link href="public/css/bootstrap.min.css" rel="stylesheet">
<script src="public/css/bootstrap.min.js"></script>
This means that the resources are relative to the virtual directory of the url bar of the browser.
You should declare your references this way:
<link href="/request/public/css/bootstrap.min.css" rel="stylesheet">
<script src="/request/public/css/bootstrap.min.js"></script>
To avoid hardcoding the contextpath, you could use:
<link href="${pageContext.request.contextPath}/public/css/bootstrap.min.css" rel="stylesheet">
<script src="${pageContext.request.contextPath}/public/css/bootstrap.min.js"></script>
Whicho would resolve your context name
Try this way
<link href="/resources/css/bootstrap.min.css" rel="stylesheet">
or
<link href="${pageContext.request.contextPath}/resources/css/bootstrap.min.css" rel="stylesheet">
I want to add if condition in layout xml file to allow css to load in below scenarios.
To load css file only in home page alone.
To load css by devices(Desktop, mobile & tab)?
Please let me know how to add condition in layout xml file?
<head>
<css src="fonts/Lato/lato.css" /> <!-- Should be loaded in website home page only -->
<css src="css/styles-mobile.css"/> <!-- Should be loaded in mobile devices only -->
</head>
To load css file only on home page you need to do this things.
You can add below code in you custom theme
app\design\frontend\<vendor>\<theme>\Magento_Theme\layout\cms_index_index.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="fonts/Lato/lato.css"/>
</head>
<body>
</body>
</page>
And add lato.css into app\design\frontend\<vendor>\<theme>\web\css\fonts\Lato.
I'm sorry but I spent long time but can't figure out what is wrong to pop-up the other html file with the Featherlight. The manual says nothing additional so I will be happy if you will guide me what's wrong:
<link href="//cdn.rawgit.com/noelboss/featherlight/1.5.0/release/featherlight.min.css" type="text/css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-latest.js"></script>
<script src="//cdn.rawgit.com/noelboss/featherlight/1.5.0/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script>
Open Ajax Content
<br>
Ver2
<br>
Open Ajax Content
You need to specify the class in your target html page
So within http://www.htmliseasy.com/popup/popup1.html
there should be a content here
(you can rename "jQuery-Selector" whatever you wish...)
Im developing a golang webpage and am running into some troubles when deploying my page to google app engine (appspot.com). This is because Im running it using http when developing on my machine, but over https when deployed.
Google chrome doesnt like this so it blocks the content trying to be loaded over http. Im fine with this since I like security. But I cant find the source.
All my includes are https or //, or just local files.
Here is a image of the error in chrome.
This is some includes that I use. Maybe some of them is loading a font?
<link href="/static/css/googlefont.css" rel='stylesheet' type='text/css'>
<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="/static/css/style.css" rel="stylesheet" type="text/css">
<link href="/static/css/sweetalert2.css" rel="stylesheet" type="text/css">
<link href="/static/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="/static/css/modal.css" rel="stylesheet" type="text/css">
<script src="/static/js/jquery.js"></script>
<!--<script src="/static/js/jquery.min.js"></script>-->
<script src="/static/js/register.js"></script>
<script src="/static/js/login.js"></script>
<script src="/static/js/sweetalert2.min.js"></script> <!-- Sweetalert -->
<script src="/static/js/spin.min.js"></script> <!-- ?? -->
<script src="/static/js/bootstrap.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="/static/js/jquery.cookie.js"></script>
<script src="/static/js/stuff.js"></script>
<script src="/static/js/flat-ui.min.js"></script>
<script src="/static/js/application.js"></script>
<script src="/static/js/bootbox.js"></script>
I cant seem to find the source..?
Thankful for any help in the right direction, i'm going crazy here..
Check all the CSS stylesheets your document is loading, including any CSS stylesheets that are getting loaded through an #import. In one of the CSS stylesheets, you most likely have a rule with a url(…) call something like this:
src: local('PT Sans'), local('PTSans-Regular'), url(http://fonts.gstatic.com/s/ptsans/v8/fhNmDCnjccoUYyU4ZASaLVKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
Use the Network tab (or equivalent) in your browser devtools to get a view of all the resources your document is loading. You can sort that resource view by type. So, set it to sort by type and then look through the source of all the type=stylesheet or type=css resources to see which one has a url(…) that uses an insecure http scheme.
If someone hasn't already, there really should be a feature request lodged with Google. The fact that Chrome knows the location of the error but just displays "(index):1" in the developer console just doesn't cut it.
In the meanwhile, the easiest way to find the offending CSS in Chrome (ver 68) is to "Customize and control DevTools" by clicking on the 3 dots in the top right corner of the development console and clicking "Search" ) or "Ctrl+Shift+S". You might have to drag up the horizontal pane at the bottom of the screen.
I have a folder in my root directory that is candyfive and it has my html website that is properly working and a domain is pointing to it, I have a subfolder inside candyfive that is named "portal". It is an admin panel of the site with its own css and images.
The problem is that the site in candyfive folder is loading correctly but the site in portal is not loading any image or css.
The link of css in my portal admin site is
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" />
What should I add in this code to make it work in subfolder ?
Here is the site structure :
candyfive/portal/index.php
candyfive/index.html - is working fine
candyfive/portal/index.php - css and images not loading ?
Use
<link href="../css/templatemo_style.css" rel="stylesheet" type="text/css" />
instead of:
<link href="css/templatemo_style.css" rel="stylesheet" type="text/css" />
.. Is used to go up in the directory tree stucture..