Documentation for developing "widgets"

[saurabhnanda]

Hi, we're evaluating Locomotive CMS to give our customers the ability to build template-driven websites on our SaaS platform. Our SaaS platform is managing some data for our customers and can probably push the data to Mongo so that it's available to Locomotive CMS as custom-objects.

Now, my question is that we need to show a lot of "widgets" on the template-driven websites. A customer should have the ability to drag/drop widgets into designated areas (pretty much like how it's done in Wordpress). A customer should have the ability to tweak/customize some widget-specific settings.A few examples of widgets:

• Image slider on home page
• Twitter feed widget
• Weather widget
• Upcoming events (our SaaS platform is for event ticketing)
• Recently booked events

What's the recommended way to build this out on top of Locomotive CMS? Is there any doc / guide which describes the process?

[jaredklewis]

Hi @saurabhnanda

Thanks for considering LocomotiveCMS. Widgets are feature we've given a lot of thought to adding, but they won't be ready for some time.

In regards to adding it yourself, unfortunately, we don't have any documentation regarding how to extend LocomotiveCMS in this way.

One way you could handle this would be to add the widgets dashboard to the Rails app which hosts the Engine using standard Ruby/Rails practices. Using the routes file you could configure something like /admin/dashboard to lead to your dashboards page. Rails gives you the ability to use and override engine views and assets, so you would be able to match the standard admin UI.

Hope this helps. Let me know if you need any clarification.

[saurabhnanda]

Actually these arent widgets for the backoffice, but for the consumer
facing website. Each template will have some areas where widgets can be
dropped in, eg twitter feed, weather widget, contact form, etc.

So, the question is how to extend the backoffice AND the liquid templating
system to be able to handle this.
On 15 Apr 2014 08:22, "Jared" notifications@github.com wrote:

Hi @saurabhnanda https://github.com/saurabhnanda

Thanks for considering LocomotiveCMS. Widgets are feature we've given a
lot of thought to adding, but they won't be ready for some time.

In regards to adding it yourself, unfortunately, we don't have any
documentation regarding how to extend LocomotiveCMS in this way.

One way you could handle this would be to add the widgets dashboard to the
Rails app which hosts the Engine using standard Ruby/Rails practices. Using
the routes file you could configure something like /admin/dashboard to lead
to your dashboards page. Rails gives you the ability to use and override
engine views and assets, so you would be able to match the standard admin
UI.

Hope this helps. Let me know if you need any clarification.

Reply to this email directly or view it on GitHubhttps://github.com//issues/119#issuecomment-40440765
.

[jaredklewis]

Ok, I see. Hmm...adding widgets to the front end is easy enough. All the widgets you listed could be implemented with regular JS using JSON APIs, so yea, on the front inside of things, we just need to pull the widget code from somewhere and insert it.

So the widget code would need to be stored in the database. You could do this through a LocomotiveCMS widgets content type (with a code field to store the implementation) or using traditional rails models.

The problem is the interface to add widgets to pages. If you want to be able to add widgets from the current admin interface for Pages, you would have to heavily edit the LocomotiveCMS admin page controllers and views to add that functionality, so you should probably fork the Engine gem and work from there.

If it doesn't need to be integrated (i.e. use the standard Page editors for most stuff, but have a separate area to manage page widgets), you could do this by extending rails with your own widget administration controllers and views.

If you had a PageWidgets model that managed the relationships of LocomotiveCMS Pages and your Code widgets, you could conceivably pull this into the LocomotiveCMS back-office under a new tab.

We only have one (unfortunately, slightly outdated) example of this kind of extension, here: https://github.com/locomotivecms/mini_app

[saurabhnanda]

All the widgets you listed could be implemented with regular JS using JSON APIs, so yea, on the front inside of things, we just need to pull the widget code from somewhere and insert it.

Actually that's not the complete list of widgets. There will be many widgets that may end up getting implemented as "mini Liquid templates", but where the template has a bunch of customizable options. eg. list view OR grid view, button color, open link in new window OR same window, etc.

What are your views around a "page builder"? Is that ever going to be part of core Locomotive CMS?

[jaredklewis]

I'm not sure what you mean by page builder. If you mean a GUI style editor for defining page layouts and content (similar to what is currently available in Weebly, for example), I think it is unlikely LocomotiveCMS will ever add a feature like that.

Currently, the LocomotiveCMS philosophy is something like this: site design and code are separate from content. Web designers do the design and structure the site, clients do the copy.

So, LocomotiveCMS let's designers and developers create sites and (with no extra work for the coder) adds in a big beautiful back-office where clients can edit all of the content entries and editable areas of pages, without messing up the design.

Allowing the clients (the end-users) to design and structure pages themselves is cool, but, at present, outside the scope of LocomotiveCMS. At least, if I understood you correctly. 😄

[jaredklewis]

Just closing this to clean things up. Feel free to comment if you would like to reopen it.