Adding Icons to link text with Bootstrap SASS

April 2, 2012

I’m on about week 12 on my uncoordinated attempts to learn Ruby on Rails with help from wonderful resources like the Rails 3.2 version of the Ruby on Rails tutorial (after first trying out the previous 3.0 version).

One of the neat things about the tutorial is that it incorporates Twitter Bootstrap (via bootstrap-sass. Unfortunately most of the resources and tips on the web are for LESS and since the tutorial doesn’t really get deep into bootstrap, figuring out some simple things can be difficult for a beginner like myself.

However, I really did want to incorporate an icon alongside link text for a button. After the usual searching, experimenting, here’s the solution I found for the button below.

<%= link_to raw('<i class="icon-ok-circle icon-white"></i>' ' Sign up now'), new_user_registration_path, class: "btn btn-large btn-success"%>

Discussion, links, and tweets

Good Morning!