In part fourteen of this series we consider using Font Awesome as part of Bootstrap.
Font Awesome works really well with the full range of Bootstrap components. Consider these examples:
<a class="btn btn-danger" href="#"> <i class="fa fa-trash-o fa-lg"></i> Delete</a> <a class="btn btn-default btn-sm" href="#"> <i class="fa fa-cog"></i> Settings</a>
As you can probably work out by now, this produces the following buttons.
Of course, being a Moodle teacher or designer you might use something more like:
<a class="btn btn-lg btn-success" href="#"> <i class="fa fa-info fa-2x pull-left" style="color:#800000"></i> Learner support area</a>
This produces a button like this:
Note the href=”#” part of the code.
You can replace the # with any URL – such as https://wwwyoursite.com/learner_support
The link could be internal – to a page on your Moodle site, or external – to your main company website, or any other website address.
So now you know how to add simple buttons that link to different parts of your course or site 🙂
More next month!