REVIEW: Font Awesome 4 & 5 integration in Wappler

Well it is almost this time of the year that everybody gets present, but we decided to start yearly :slight_smile:

So here is the upcoming Font Awesome 4 & 5 integration for your review.

Adding the Font Awesome framework

Font Awesome is available as framework to insert in the standard Add Framework menu:

image

It is also auto included when you choose the other frameworks like Bootstrap 4:

image

But you can also add it manually:

image

The green checks indicate the included version, so switching from Font Awesome 4 to version 5, is just a single click away:

image

We even have a build in convertor that will magically translate all Font Awesome 4 codes to the new version 5!

image

Making the transition really easy to the latest version!

The Font Awesome Icon Inspector

Once added on the page you will be able to inspect the existing icons by just choosing an element and scrolling down the property panel:

There you will see the new Font Awesome icon properties.

Brand New Icons Picker

And picking a new icon has never being easier with the brand new icon picker:

There you can do quick search, toggle styles or categories you want to see and just click the icon you want to pick it.

it will be automatically selected in the properties and added to your page.

Adding New Icon

Many of the existing Bootstrap 4 elements now have ability to be extended with Font Awesome icons.
So choose any title, paragraph, button, links, list items, navigation items etc and just scroll down in its property panel till the end to see:

Default position of new icons is as suffix:

But you can easily change that to put the icon in front:

or change any of the other properties like size, rotation and the icon of course.

So that is about it! The great Font Awesome integration as you requested it!

Let us know what do you think of it.

11 Likes

This is certainly great news! Will there be provisions for those of us that have FA5 Pro licenses?

Amazing!! Love the Icon picker!!

That s very nice and love this Wappler style!!

1 Like

Again an incredible elegant implementation! Great to have Font Awesome! @George thank you so much for these cool features!

image

1 Like

Initially we will be supporting only the font awesome free out of the box as we can’t distribute the pro version.

But will definitely investigate the best integration if you already have the files.

3 Likes

Quick review looks great :+1:

Magic! Like the convertor, size slider and picker!

I knew there was a good reason why i spent most of yesterday integrating font-awesome manually - :grin:

Can the icon name be dynamically selected from a database record? I have a list with FA icon names linked to text descriptions i use, retrieved via server connect query.

1 Like

This is simply wonderful. :+1:

1 Like

Awesome addition with FA @George I have to say initially I was worried about swapping to Wappler, but I its the best thing I’ve ever done. Although we are not experts in the field I do look after our own companies websites. Wappler is now a dream, my work flow has improved and my stress has gone down and I don’t have to harass @Teodor as much any more.
Wappler has given me abilities to do things that I never thought I would be able to do
Thanks to you and your team, as you will know we have been with DMX for many years now and we will continue to support you still for years to come. Also I’ve not opened DW in months, I think it may be time to kill my subscription with Adobe :wink:

5 Likes

And thats why Adobe called it DREAMweaver but was overtaken through wappler ! :ok_hand:t5::laughing:

5 Likes

This sounds wonderful. As an owner of the Font Awesome Pro set I look forward to how you handle that feature as well.

2 Likes

2 posts were split to a new topic: Add Font Awesome stacked icons creation