I have a subdirectory for a website:
www.example.com/admin
I'm using includes throughout the site that all use the same path structure:
<link rel="stylesheet" href="assets/css/styles.css">
The stylesheets also have links in them for things like background images.
My problem is that the includes don't work in the /admin directory because they all refer to /assets/css or whatever folder that are all up one level. (Those links work fine for the main website in the root directory, but no good for the admin area.)
Anyone got any ideas how to solve this problem?
You need to either add a / to your link (making it an absolute URI instead of the relative URI that it is):
<link rel="stylesheet" href="/assets/css/styles.css">
Or you can add a URI base in your page headers:
<base href="/">
Related
Okay here's my problem:
My website:
https://www.bffmatch.com/
If I go to a subdirectory that is in my website root it shows index page without any css which is very weird:
https://www.bffmatch.com/css/
And if i go to a file it shows that file:
https://www.bffmatch.com/css/match.css
The same goes for php files and whatnot
So how can i disable access to these and just redirect to my website root or something
Thanks!
The problem is here:
<link rel="stylesheet" href="css/homepage.css">
css/homepage.css is a relative path.
The browser uses the URL of the current page to make a full URL out of it.
The URL of the current page ishttps://www.bffmatch.com/css/. This makes css/homepage.css to be expanded https://www.bffmatch.com/css/css/homepage.css and it does not exist.
Use full paths for the resources and it will work:
<link rel="stylesheet" href="/index.css">
<link rel="stylesheet" href="/css/homepage.css">
<link rel="stylesheet" href="/css/profile.css">
<link rel="stylesheet" href="/css/match.css">
And so on.
Use your browser's Web Developer Tools to find out other requests that cannot be found (the server's response for them is 404 Not Found).
I replaced all of the files in images/touch with my own logo, and also replaced favicon.ico in the main directory of my project, but the favicon still displays as the default asterisk that comes with web starter kit. I tried refreshing the cache of my browser, and adding in
<link rel="shortcut icon" href="http://mywebsite.com/app/favicon.ico?v=2" />
to try and manually link the favicon. This works, only when
<link rel="icon" sizes="192x192" href="images/touch/chrome-touch-icon-192x192.png">
is also commented out. But this will change the behavior of chrome for Android so that it is incorrect. Also, "images/touch/chrome-touch-icon-192x192.png" has been replaced with MY icon now, so why does this line make the favicon revert back?
I have the same problem after I replace following files with my own image:
/app/favicon.ico
/app/images/touch/apple-touch-icon.png
/app/images/touch/chrome-touch-icon-192x192.png
/app/images/touch/icon-128x128.png
/app/images/touch/ms-icon-144x144.png
/app/images/touch/ms-touch-icon-144x144-precomposed.png
Problem was solved when I close and open again my browser.
I have built a small node server using express and I want to serve index.html which contains angular app. How ever the browser sends GET request for favicon.ico. I have installed serve-favicon, however still it looks for physical file. Is there a way to override it? or from where can I find such file
The recommended way is actually just to use a link tag in your index.html:
<link rel="icon" href="/img/favicon.png">
Just change the href to link to an img in your public folder and you're good to go.
http://www.w3.org/2005/10/howto-favicon
You can use this site to get free favicon.ico
Then add your favorite favicon.ico to your html .
<link rel="icon" type="image/png" href="../images/favicon.ico" />
I am using Orchard v.1.9.1.0.
I have my custom theme with a layout page that starts off like this:
#using Orchard.UI.Resources;
#{
Script.Require("ShapesBase");
// css
Style.Include("//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css");
Style.Include("//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css");
}
Using Script.Include, I thought loading the CDN reference would work, but when building the project and viewing it locally, the reference is not there and instead renders like this:
<link href="/Themes/HotToddy5K/Styles/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
Why does Orchard do this? I can't seem to find where in the base/core it's applying this. I tried to delete that bootstrap.min.css file in that "scripts" folder, hoping it would then fall back to my CDN reference, but no luck.
Any ideas?
You can easily do this on your ResourceManifest.cs.
Actually it is better, because you can provide fallbacks as for debugging files. you can manage this feature from the Settings section in the Admin.
Where is says "Resource Mode", in 1.9x you can trigger the CDN too.
I use Script/Style.Require instead of Include as it gives me more control. it also maintains your script/style dependencies.
Using h:outputStylesheet I can embed CSS resources in the HTML head section, but how can I build a <link> for a favicon image resource which renders HTML like in this example:
HTML output:
<head>
...
<link rel="icon" type="image/png" href="favicon.png" />
...
</head>
The image resource is located in <web>/resources/images.
If I use direct HTML code in the JSF template like href="/resources/images/favicon.png" the resource is not found - navigating to /resources/images/favicon.png leads to the error
/resources/images/favicon.png/index.jsf
not found
(I have set index.jsf as index page in web.xml which might explain this path)
Your webapp is apparently running on a non-empty context path. The leading slash / brings you to the domain root. Use #{request.contextPath} to dynamically inline the context path.
<link rel="shortcut icon" type="image/png" href="#{request.contextPath}/resources/images/favicon.png" />
(note that I fixed the rel as well to make it crossbrowser compatible)
The href="/resources/images/favicon.png" is actually looking in the root direcotry of your server http://localhost/resources/images/favicon.png and not inside your web application directory.
Your href location will need to include the web application directory href="/webappname/resources/images/favicon.png" http://localhost/webappname/resources/images/favicon.png
If your .xhtml file is in the same directory as your resources folder then removing the forward slash at the being should work as well.
href="resources/images/favicon.png"