I'm building a WordPress theme which I intend to make available for download, and I want developers to be able to make child themes for it. I would like to use Modernizr in it, but not an entire Modernizr build with every bell and whistle. Just a bare-bones build for the features I need, but also with support for child theme builders who want to add more Modernizr features. Is there a way to do that? I know Modernizr has an addTest() function, but I don't know if this would cover all bases if I add it in to my Modernizr build.
Modernizr is going to add support for multiple versions being hosted at the same time in the future, but in the mean time the best thing you could do is include the bare bones build, and a comment saying that a build with the follow features is required if they want to modify it.
Related
Is the Modernizr required by jQuery, Bootstrap? I seen this nuget package in many MVC.ASP 4.7 projects and just tried to create a new project where it is automatically added. I never used it and I wonder if I can just remove it?
Modernizr is a small, simple and open-source JavaScript library that helps us to take advantage of emerging web technologies; HTML5 and CSS3 maintain the look and feel for older browsers that may not yet support these new technologies.
If you create an ASP.NET MVC Web Application, you get this library by default and by expanding the "Scripts" folder.
Modernizr does three things basically.
It adds classes indicating feature support.
It allows to run feature detection to decide whether to run a script.
It injects html5shiv for allows old browsers to understand HTML5 elements.
If you don't use any of these features, then there's no point in including Modernizr at all.
I have a lot of legacy CSS files from what was a Rails 2.x app that got upgraded to Rails 3.2.8, and I want to switch over to using the Rails asset pipeline for stylesheets. The issue is, the CSS stuff is messy in terms of huge lines of code, duplicate file names, and unorganized folder structure.
After looking through individual pages, and trying to add individual stylesheets and folders into the asset pipeline and spending some cycles debugging, I realized there's probably a better approach.
Is there a way to test to make sure the old CSS matches up with the asset pipeline CSS? What are some good tools for testing and debugging CSS?
that is actually a pretty good question. i just know of one tool called wraith that takes screenshots of your page and compares diffs them. that allows for regression testing of your design. you will need to have a test for every page though.
if you look into your browser you also have the possibility to see which css selectors are not used. you could start by deleting the styles that are not used throughout your page.
i think that you will have to take the bitter pill and refactor your css bit by bit. sass and scss might help you with that.
at some point it might be better to start of with a clean slate though. just start with one page and create the css from scratch. at least you know how it has to look like...
I'm in a similar situation with a large legacy application. While I haven't made the transtion yet, here are the steps I'm anticipating:
Upgrade to latest Rails 3.2.x with asset pipeline disabled (done but still testing now)
Upgrade to latest Rails 4.x (because asset pipeline changed between versions)
Divide my css pages between those that apply to every page, and those that are page specific. For the asset pipeline, include ONLY those that apply to every page, and activate the pipeline.
Over time, rewrite the CSS so that page specific rules can be included in the global rules, until everything is in the first category.
I'm seeing advantages in upgrading to rails 3.2 that have nothing to do with the asset pipeline, so that's a win. I have a number of CSS and JS files that do (or could) get loaded on every page without conflicts, so getting to that stage should be some improvement. Transitioning the remaining stylesheets can be done over time and hopefully in a safe way.
Hope this helps. I look forward to seeing any other answers from people that have made this sort of transition on a less-than-trivial web application.
This is a serious question, specifically relating to the many frameworks out there for Wordpress and Joomla - Warp, T3, Gantry etc. What I dont understand is how they are different to a starter template and what exactly you are supposed to do with them - simply child theme them or is it a whole other codex to learn? I mean, all of the native codex is there with Joomla and WP anyway to construct a theme simple enough so what good does a whole proprietary app do between your design and the CMS? Are they faster to develop with?
What confuses me is that people seem to love them and claim that they make life easier but I dont get how adding another technology to learn can make things easier. Like I say, it is a serious question, not one for effect to make a point.
Can anybody define the difference between a framework and a starter template? I ask in part because I am one of those anxious developers who always feels like I am somehow missing a trick or doing things the "wrong" way - what am I missing?
This is definitely mostly an issue of definition, and I can guarantee that some cases will not follow what I outline below. Obviously, anyone is free to call the template/framework by whatever they want.
Generally though, a template is comprised of basic HTML and CSS that works with the platform (Wordpress, Joomla, etc) that is used to build the output to the page. In Wordpress, this contains the loop and other constructs to get all the content for the page. In Joomla, it outlines all the module positions available and such.
Typically when you purchase a higher end theme, you will have significant choices on the backend to customize the theme without having to actually code. These parameters let you typically change colors and such.
Some of the theme developers and others have taken this parameter settings system to the next level and made it into a framework. In all the cases that I've seen, "framework" is really the basis for the template parameter system. In this way, you can have consistency between different themes and expect the same settings and features between different themes. This is why they use a different word, because it really isn't a "theme" any more. It really is like a "theme engine" in that it is a backend system for changing things in the theme.
Yes, many platforms offer some basic options for editing the theme out of the box, so in most cases, the framework is really an improvement on the base platform's theme engine.
It's been my experience that a theme will be a visual style along with a set of theme options available in the admin (in addition to Customize if it's supported).
Theme Frameworks on the other hand, like Thesis, are installed just like a theme but have a very vanilla visual style that you build your theme on top of. Usually the framework provides many added features that aren't available in WP core.
tl;dr - Themes frameworks aren't installed and used right away, they are installed and built upon to deliver a site.
I want to create custom themes for ExtJS 4 based application. I read ExtJS documentation and found out that we need to install Ruby, Compass and SASS to create custom themes.
As I am not sure whether my client (and my employer too) will allow me to install these 3 tools, I would like to know whether its possible to create custom themes without using these tools?
Thanks in Advance !
Is it possible? Yes. Without SASS, you can still apply any custom styling you need using plain CSS. You'd include the default ExtJS stylesheets on your webpage, and then use custom stylesheets to override whatever styles you need to.
Is it preferable? No. Depending on the extent of the theming changes you're looking to make, using pure CSS is likely to be tedious and troublesome. Using SASS/Compass allows you to use the variables and mixins provided by ExtJS for theming, which is much faster and easier than trying to do it by hand. In addition, the CSS files generated by SASS will be minified, and won't contain the extra CSS bloat you'd end up with trying to do it all manually.
My recommendation: try hard to convince your employer to allow you to use SASS. It will be well worth it if they do. And remember: Ruby, SASS, and Compass are only needed for development, since your SASS files will be compiled into CSS before being included on the webpage. Your client shouldn't need anything extra (other than a browser) to access the ExtJS application. If your employer is really stubborn about installing Ruby, you may have no choice but to create your theme in CSS by hand. But that's likely to be a long, frustrating experience.
I'm developing a web app using python and twitter-bootstrap, and my CSS would really benefit from using LESS in order to generate my styles and themes. I want to inherit from classes provided by bootstrap, which means I've got to get the bootstrap source, and compile my LESS stylesheets against the boostrap .less files.
My question is two-fold:
1) The simplest way it seems to use LESS is not to actually compile stylesheets "on-the-fly" but to have a build step that I run each time I make changes to the styles. Is this typical? It seems like a lot of people run LESS dynamically in their server process, but it's an extra headache that I probably don't need, and I don't want to run less on the client side.
2) Thanks to LESS, my project now depends not just on bootstrap, but the bootstrap "source" - What's the best way to handle this in terms of my project management? I don't want to just absorb the whole of whatever the current version of bootstrap is into my git repos, because it seems like it would be a hassle to update it as newer versions of bootstrap come out (also feels icky!) Still though, I need to have at least the minified js/css in my project tree in order to deploy my app. How do people typically handle dependencies like this when developing web apps?
There are a couple of shoices:
You could use less.js in development, so you don't have to
compile each time you change your less code. You just use *.less files instead of *.css
You could use any of the GUI tools that will automatically recompile less code. I prefer LESS.app.
I use git submodule
I would have linked you to the same post as Pavlo above. Maybe there is no best CLEAN practice for this? Neither there is any magic "package manager" i think.
I went updates BS once and it was a bit of a hassle to find out all the variable names that have been changed in the LESS files.