Advertisement
PHP

Quick Tip: Integrate Compass into an Existing CodeIgniter Project

by

I was recently asked about how to use Compass in an existing CodeIgniter project. It seems that the emailer was under the impression that Compass was made for Ruby and Rails. But that's not the case at all!

Note that Ruby will need to be installed on your system in order for Compass to work correctly. It's installed by default on a Mac. Otherwise, the easiest way to install the latest version of Ruby is with RVM. Refer here for detailed instructions.

Choose 720p for optimal viewing.
Subscribe to our YouTube and Blip.tv channels to watch more screencasts.

Let us walk you through the process of getting started with Sass and Compass from scratch.

Related Posts
  • Web Design
    eCommerce
    An Overview of My Shopify Workflow ToolsShopify thumb
    Following the publication of the recent Shopify Theme Series I have had a few people get in touch and ask me about some of the workflow tools I use when building themes. Let's look at just a few of them.Read More…
  • Web Design
    HTML/CSS
    Why I Choose Stylus (And You Should Too)Stylus thumb
    The world of front end web development has been steadily increasing its uptake of what we call "CSS Preprocessors", which extend the functionality of regular CSS. Arguably the two most well known, with the greatest user base, are LESS and Sass/SCSS. However there is a third preprocessor that hasn't received quite as much attention, and that's Stylus.Read More…
  • Code
    Creative Coding
    Adding Custom UI Themes to Wordpress Admin Using SassPreview image@2x
    With the release of WordPress 3.8 we now have a new feature for Admin UI themes. This means that every user can change the color scheme of his admin regardless of the the theme that’s being used on the front-end. To change the color scheme of your admin, go to Users > Your Profile. Here you’ll see eight predefined themes that you can select from. Select any theme from these themes and you’ll see the changes immediately. When you are done with selecting the theme, hit the “Update Profile” button.Read More…
  • Web Design
    Applications and Tools
    Working With Gumby's Parallax ExtensionGumby parallax retina
    Having covered how to install the Gumby framework and how to work with its semantic grids (plus Sass and Compass), it's now time to dive into some of Gumby's extensions. The first extension we're going to play with is the parallax module.Read More…
  • Web Design
    HTML/CSS
    Setting up Foundation With Sass and CompassFoundation sass retina
    Sass is a great way to speed up front-end development in general, I use it in every one of my projects. Sass (as with all other preprocessors) allows for nested styles, functions and prewritten code in what are called mixins. Foundation has a few different versions, currently we've covered the most common HTML/CSS variants, but now let's talk about a version built on Sass.Read More…
  • Web Design
    Workflow
    Quick Tip: Working with SASS and BootstrapPreview
    Twitter's Bootstrap is undeniably popular - and if you're a fan of CSS preprocessors you'll love the fact that it's built on LESS. Unfortunately, if you (like me) enjoy working with SASS, there typically hasn't been anything readily available to get you started. Until now. This tutorial will explain how to combine SASS, Compass, and Twitter's Bootstrap.Read More…