Less.js not parsing .less files - wordpress

I have tried everything and this makes absolutely no sense! I previously had Less.js working just fine on my site, then I decided to use WP_Less because of some of its added features but then ran into issues when implementing BuddyPress. VERY long story (and day) short I am trying to get back to the basics and I can't seem to get Less.js to just work. I've turned off all plugins and removed all the code except what is in the header so there should be no outside conflicts
the header.php has this code:
<link rel="stylesheet" type="text/css" media="all" href="<?php get_bloginfo( 'stylesheet_directory' );?>/style.css" /> <!-- WP Theme Style -->
<link rel="stylesheet" type="text/css" media="all" href="<?php get_bloginfo( 'stylesheet_directory' );?>/style.css" /> <!-- Theme Less Styles -->
<link rel="stylesheet/less" type="text/css" href="<?php get_bloginfo( 'stylesheet_directory' );?>/css/less/style.less" /> <!-- Style.JS -->
This results in only the the less.js and the default style.css loading no style.less:
If I modify the style.less call to this:
<link rel="stylesheet" type="text/less" href="<?php get_bloginfo( 'stylesheet_directory' );?>/css/less/style.less" />
then they all load but the style.less does not get parsed:
Nothing I have tried down to its simplest form based on their documentation has worked and I simply don't understand why, I've set this up on other sites with no issues before.
If anyone can help you thank you SO MUCH, this is time sensitive and very urgent right now.

In my case, LESS was silently failing due to parsing errors.
In order to debug less.js, open javascript console in your browser (i.e. F12) and type:
less.env = "development";
less.refresh();
I've filed a report to less.js project, so they could fix this.

Related

codeigniter view not finding css. Working on test server

Hi I have the following file set up inside public_html
/application
/views
index.php
/assets
/css
styles.css
kube.min.css
/js
js.js
and a few other things in there, some of the js files actually seem to be working, because it's picking up Paypal buttons but the links are no different at the start. Examples below.
<link href='http://fonts.googleapis.com/css?family=Handlee' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/kube.min.css" />
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/styles.less.css" rel="stylesheet/less" />
<link rel="stylesheet" href="http://deborahspsychicreadings.com/_/assets/css/start/jquery-ui-1.10.4.custom.min.css" />
<script src="assets/js/jquery-ui-1.10.4.custom.min.js"></script>
<script src="assets/js/js.js"></script>
<script src="assets/js/paypal.js"></script>
On the test site the path is a bit different (for the actual folders) because it's not in the root. The same files as above are also inside a folder called index, but when I try this on the client server it doesn't work at all.
Tried adding ../ or ./ or / to the beginning or http://sitename.com/ after reading other suggestions but nothing seems to be working.
please use site_url() function
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/css/kube.min.css'); ?>">
You need to use base_url() of codeigniter. Use the following syntax:
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/css/styles.css">
Please make sure that you configure your base_url in config.php at line 17.

load css in CodeIgniter?

Currently I am using CodeIgniter_2.1.3 and my problem is my css file is not work, but i think it load well because when I view the source code and click the following href link it help me to view the css file.
<link rel="stylesheet" type="text/css"
href="http://localhost/CodeIgniter/_css/style.css"
media="screan" charset="UTF-8" title="no title" />
I keep my css file in CodeIgniter/_css directory and I use the following code ::
<link rel="stylesheet" type="text/css"
href="<?php echo base_url('_css/style.css');?>"
media="screan" charset="UTF-8" title="no title" />
I also use the following but no effect.
<link rel="stylesheet" type="text/css"
href="<?php echo base_url();?>_css/style.css"
media="screan" charset="UTF-8" title="no title" />
Make sure you have loaded URL helper :
$this->load->helper('url');
Inspect using firebug or other web development tools for browsers if valid link has been printed on your link href.
If everything seems fine, then refresh the page. Ctrl + F5 which fetches the file from server again.
URL Helper: Codeigniter Guide
Is that localhost address what you're using? That's only going to work if you're running the browser on your server . . . spelling screen correctly would help as well.

CSS is missing when rendering an html page with codeigniter

I'm aware this is similar to numerous existing posts but after looking at a number of others I wasn't able to solve my problem. I'm attempting to load a folder full of html files I've been supplied with. I didn't write them but I have been modifying them to integrate them into an existing system.
I've tried three ways of opening them, with varying success:
1) Simply right click on 'index.html' and go 'open with' and select a browser. This works perfectly!
2) Place the whole folder contents, unchanged, onto my server under 'public_html/cat/html' and navigating to the url 'localhost/cat/html/index.html'. This returns a '404 page not found error'.
3) The strange one. Place the html files in the 'application/view' folder, separate the included css and javascript files and place them in existing folders 'public_html/css' and 'public_html/js' and update the links to them in the html files appropriately. These now look something like:
<link type="text/css" href="css/cat/style.css" rel="stylesheet" />
If I load this page by running a function that uses CodeIgniter's $this->load->view(...) function it finds the index file but loads it with no css and with broken links to the other pages. I've explored the page source and seen that the link is exactly as above but clicking gives an error that reads "404 Not Found...The requested URL /css/cat/style.css was not found on this server".
I've attempted to use the base_url() function (and site_url()) like this:
<link type="text/css" href="<? base_url('css/cat/style.css') ?>" rel="stylesheet" />
and it yields the same result on the surface but examining the page source reveals the link line has become:
<link type="text/css" href="" rel="stylesheet" />
which seems to be even worse!
Any hints?
Thanks for reading
Try the following:
<link type="text/css" href="<?php echo base_url('css/cat/style.css') ?>" rel="stylesheet" />
base_url() functon simply return value, you should take a care for displaying returned value to output! :-)
Have you correctly configure you config file in codeIgniter ?
Or shorthand
<link type="text/css" href="<?=base_url('css/cat/style.css') ?>" rel="stylesheet" />
Then view your page source and copy the link from there to your browser, see if you can access it.
Can try this code <link type="text/css" href="<?=base_url('css/cat/style.css');?>" rel="stylesheet" />
if it doesn't work, you could try <link type="text/css" href="<?=base_url('css/cat');?>/style.css" rel="stylesheet" />

LESS & Twitter Bootstrap Not Playing Nice

So I am developing a pretty hefty WordPress website where I am using the 320press Twitter Bootstrap theme and I am utilizing LESS CSS.
Some general info to know:
WordPress 3.5
Bootstrap 2.0
LESS 1.3.3
Everything has been working alright on the WordPress side, the Bootstrap side, etc. But...I had a heck of a time getting LESS to work correctly. I downloaded the less-1.3.3-min.js file from lesscss.org and dropped it in the appropriate folder. I then referenced it in the header.php file. I know all of things are correctly linked up because if you View Source on the page and click the less-1.3.3.js reference it loads perfectly.
Here's what the section of code looks like in my header.php file
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/css/fonts.css">
<link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/css/custom.css">
<link rel="stylesheet/less" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/less/bootstrap.less">
<link rel="stylesheet/less" type="text/css" href="<?php echo get_template_directory_uri(); ?>/library/less/responsive.less">
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/library/js/less-1.3.3-min.js"></script>
So as instructed on the LESS website I loaded the script after I loaded CSS files. Things should start happening correct? No. So I played around a lot and couldn't figure it out.
<-- Readers text when LESS isn't working
I then found the regular "less-1.3.3.js" file on GIT and downloaded it. BOOM everything worked.
<-- this is how it should look (the word "Readers")
Woohoo, victory dance.
Not so fast....
When I shrink my browser down to 979px or under there is a massive gap under the nav.
This gap should be more like this:
Ok, maybe I messed up some CSS...after about 4 hours of investigating I noticed that the Bootstrap.css file that gets compiled is showing twice. Once as a linked stylesheet:
and then again as an embedded stylesheet.
Using the Web Developer Extension in firefox I delete all of the embedded styles and everything looks great. But I can't figure out what's dumping that into the site head other than something that the javascript. Does this happen to everybody?
Any ideas? Of course it's an internal-network only development environment so I can't share a URL with you but I have thrown in a few screenshots to show what I'm talking about.
Help me please! My brain is fried trying to find this issue.
Thanks.
Thanks to Scott Simpson for the direction here. I was looking everywhere but the functions.php file which is my first issue.
I commented out the responsive.css in the funcitons.php file and that fixed it. I knew it was going to be something dumb.
Thank you again.

How do I stop drupal from creating a different consolidated CSS file for every node type?

I have a fairly large Drupal 6 site with different modules enabled for different node/page types which is resulting in a different CSS file for each page type after the CSS has been consolidated. I understand the logic of not wanting to load css for every module, but is there a method for loading sitewide css into one file so that we can utilize the caching benefits of CSS?
Homepage:
<link type="text/css" rel="stylesheet" media="all" href="/site-files/example.com/files/css/css_1f2e88da1acf78556ee565984845d7cd.css" /></code>
Article:
<link type="text/css" rel="stylesheet" media="all" href="/site-files/example.com/files/css/css_1786ec41724511f6c0984222b790dca6.css" />
Category:
<link type="text/css" rel="stylesheet" media="all" href="/site-files/example.com/files/css/css_b7f516c6ab4921929598cfd377ce4523.css" />
Video:
<link type="text/css" rel="stylesheet" media="all" href="/site-files/example.com/files/css/css_a702453ef81af3318ad63a194280100e.css" />
There must be some logic in making these all one file when you consider that the difference between them is minimal.
Cheers, Steve
Answering my own question...
As always with Drupal, someone's already been there and done that, and here it is:
http://drupal.org/project/advagg
A little extra research into the benefits of first page load time vs a larger site side cached file, etc. has been very insightful.

Resources