Hey can any one tell me about how to link print version CSS?? I have created a head and linked the head file as
< link media="print" type="text/css" rel="stylesheet"
href="#request.subsiteCache[1].url#style/print.css">
but I'm unable to get the exact style version for the print as I have mentioned in print.css
Do I need to do anything more apart from this?
I'm using commonspot.
I wrapped it in cfoutput tags
did you wrap your link tag around cfoutput?
<cfoutput>
<link media="print" type="text/css" rel="stylesheet" href="#request.subsiteCache[1].url#style/print.css">
</cfoutput>
Related
I have my stylesheets linked in my header as
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/meanmenu.min.css">
I'm using the MEAN stack in AWS Cloud9 Development Environment, and when I preview my application, everything is styled exactly how I plan using these stylesheets as they're in my public directory, but when I add any backslash into the end of my URL path in preview the stylesheets are not linking. For example, stylesheets are clearly linked on mysite.com/test, but mysite.com/test/ or mysite.com/test/example seems to unlink and everything is in standard raw HTML format. If I link the CDN they work, but I need to link custom stylesheets as well.
I have
app.use(express.static(__dirname + "/public"));
to tell the browser where to search.
Thanks
If you go to the next level after test (eg: mysite.com/test/example), you need to go up a level, since paths are relative.
Try:
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/font-awesome.min.css">
<link rel="stylesheet" href="../css/owl.carousel.min.css">
<link rel="stylesheet" href="../css/animate.css">
<link rel="stylesheet" href="../css/meanmenu.min.css">
Now, hardcoding your paths might get annoying after a while; you might want to provide these paths as part of your locals.
I need to add the "static" feature to a number of files in my DJango project as mentioned here: howto: static files
It seems to work. But, the instruction says that one needs to make this change
OLD:
<img src="my_app/example.jpg" alt="My image"/>
NEW:
{% load static %}
<img src="{% static 'my_app/example.jpg' %}" alt="My image"/>
to every line that needs it.
I have several hundred lines of already-existing code that is in the old format. How can one change so many lines so at one time so that they will be in the correct format? In "vi", one can use something like:
:1,$ s/static/{% static '/
but that would only take care of the left-hand-side. The right-hand-side would still need: ' %"} . The files being used are sometimes .css, .jpg, .png, and others.
TIA
Here is a sample:
<link href="/static/wforms/assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/morris/morris.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/jqvmap/jqvmap/jqvmap.css" rel="stylesheet" type="text/css" />
[... snip ...]
<div class="mt-avatar">
<img src="/static/wforms/assets/pages/media/users/avatar80_1.jpg" />
</div>
[... snip ...]
Update
#SLePort - thanks for the answer. For my situation, just made a few changes:
The "sed" script creates the result so that - on the right-hand-side - one gets
%} and not %} " (with the extra quote on the end) - see example below
<link href="{% static "wforms/assets/global/plugins/font-awesome/css/font-awesome.min.css" %} rel="stylesheet" type="text/css" />
<link href="{% static "wforms/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" %} rel="stylesheet" type="text/css" />
So, I just ran
:1,$ s/%}/\'%}/g
in the vi editor and all was fine.
Thanks again!
With sed, you can use backreference and the -i flag to edit you file in place:
sed -i 's|="/static/\([^"]*\)"|="{% static "\1" %}|' file
the solution for me is to apply a regex using some text editor. Use replace:
my_app
for:
{% static 'my_app
and for the final bit:
jpg
for:
jpg' %}
If you use linux, gedit or xed. In windows notepad++ is a good choice for these things.(Or your code editor sure has the function replace)
Edit
Komodo edit lets you replace in different files at the same time.
Hope it helped.
Edit 2
Here are the regexp that seem to work:
(href="|src=")
replace with
\1\2{% (adjust this as you need)
The last part:
(jpg|\.css)
replace with
\1\2' %}
I'm working in Django 1.8, OSX, and Chrome. Some ionicons I've included in a rendered template are not showing up in Heroku (staging environment). I'm fairly certain that I have linked/included the icons properly in the css and font files (30464569), because they show up just fine on the localhost, on cPanel, and when published on the person's own website. Additionally, they even show up on Heroku if I use Safari! What is happening here?
I've read a bunch of SO posts about this, but most people are referencing other font packages (29687388) or (14366158), other frameworks (25982037) or (21472458), or completely missing icons (27766015).
EDITED TO INCLUDE HTML (from Django template)
<head>
<meta charset="UTF-8">
<title>{{ student.preferred_name }} {{ student.last_name }}</title>
<!--<meta name="description" content="[Insert your description here]">-->
<!--<meta name="google-site-verification" content="">-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="{% asset 'vendors/css/normalize.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'vendors/css/grid.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'vendors/css/owl.carousel.min.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'vendors/css/owl.theme.default.min.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'vendors/css/ionicons.min.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'resources/css/queries.css' %}">
<link rel="stylesheet" type="text/css" href="{% asset 'resources/css/style.css' %}">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Lato:400,100,300,300italic">
</head>
I'm hesitant to post code because it's not a public project, but here are are two images showing the issue:
Icons on LocalHost
Icons on Heroku
Any ideas on how I can fix this? I need my users to see an accurate preview before they publish their site and this icon issue has been a major headache for over a week.
Thanks!
Sarah
Be sure that run command $python manage.py collectstatic before pushing to heroku.
I had this same problem
confirm that the static assets are correctly spelled
Note that it might not be case sensitive on windows but Linus is case sensitive and Heroku runs on Linus
so ensure that your lower and upper cases are in place
I have a large php application that I am converting to ember.js. In my php application I used to have separate css and js files which was loaded when the specific routes get called. what the best way to accomplish this in ember.js or is there any other best practice for that. Right now I am loading all the js and css files in my index.html file.
<link type="text/css" rel="stylesheet" href="assets/css/gumby.css" media="all" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/global.css" media="all" />
<link type="text/css" rel="stylesheet" href=assets/css/tooltipster.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/jquery.fancybox.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/about.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/admin.css" media="screen" />
<link type="text/css" rel="stylesheet" href="assets/css/pages/global_print.css" media="print" />
js files:
<script src="assets/js/libs/jquery-1.9.0.min.js"></script>
<script src="js/libs/handlebars-1.1.2.js"></script>
<script src="js/libs/ember-1.6.1.js"></script>
<script src="js/libs/ember-data.js"></script>
<script src="js/app.js"></script>
<script src="js/router.js"></script>
<script src="js/account.js"></script>
<script src="js/message.js"></script>
<script src="js/user.js"></script>
<script src="js/inquiry.js"></script>
I saw this tutorial http://madhatted.com/2013/6/29/lazy-loading-with-ember and also looked ember-cli. It will be really helpful for me if people share what they are doing for their application. Thanks in advance.
Typically you can take two paths to preprocess your assets: minify, compress, uglify, etc.
You can do it with the back-end you are using. As examples here, you have Rails using sprockets for its asset pipeline, or PHP's Assetic.
If you don't want to rely on your back-end for this task, you can opt to do it using any front-end build tool. There are a few here, the most popular option for ember-cli these days seems to be broccoli, which comes set up by default. Other choices could be gulp or grunt. All these options involve using your terminal to build your application, using a configuration file as a central point (Brocfile.js, Gruntfile.js, etc.)
It's mostly a matter of personal preference. As an example, I'd probably go with Rails asset pipeline for small projects, while I'd use ember-cli and broccoli if I'd be working on something bigger.
I'm using django 1.3
I'm using a base.html template which my pages inherit from. Everything works fine except for one page (which has a form on it).
That page is trying to call the CSS from /links/addlink/css/site.css but this is the wrong location. It is in /static/css/site.css
In my base.html I have <link rel="stylesheet" href="{{ STATIC_URL }}css/site.css" type="text/css" charset="utf-8" />
If I create a completely seperate template and use the full path like <link rel="stylesheet" href="http://127.0.0.1:8000/static/css/site.css" type="text/css" charset="utf-8" /> then my page renders correctly.
What is wrong?
You are not using RequestContextin your view.
See here: Referring to static files in templates