Rich-CMS

A Rails gem (and also plugin) for a pluggable CMS frontend

Introduction

Rich-CMS is a module of E9s (http://github.com/archan937/e9s) which provides a frontend for your CMS content. Please check out an online demo of Rich-CMS at the Rich-CMS or E9s page at http://codehero.es.

Installation

Using Rich-CMS as gem in Rails 3

Add Rich-CMS in Gemfile as a gem dependency:


  gem "rich_cms"

Run the following in your console to install with Bundler:


  bundle install

Using Rich-CMS as gem in Rails 2

Add Rich-CMS in environment.rb as a gem dependency:


  config.gem "rich_cms"

Run the following in your console:


  sudo rake gems:install

Use the provided Rails generators

Rich-CMS requires one entity:

  • An ActiveRecord model used for CMS content storage

For (optional) authentication, Rich-CMS requires one of the following:

  • A Devise authenticated admin model
  • A Authlogic authenticated admin model

Fortunately, Rich-CMS is provided with two Rails generators with which you can generate those entities.

CMS admin

In Rails 3

Run the following in your console:


  rails g rich:cms_admin -m

Note: At default, it will create a (Devise powered) User model, the CreateUsers migration and it will configure your routes.

You can alter the class name as follows:


  rails g rich:cms_admin CodeHeroes::User -m

Note: Both generators have the -m or --migrate option which runs rake db:migrate after creating the files.

Using Authlogic

You can use Authlogic by specifying the -a or --authlogic option:


  rails g rich:cms_admin CodeHeroes::User -a -m

Note: As mentioned earlier, Devise is the default authentication logic. Having that said, you can explicitly specify Devise with the -d or --devise option.

In Rails 2

Run the following in your console:


  script/generate rich_cms_admin -m

Attention: The Devise Rails generator code is (practically) a copy of the Devise 1.0.9 generator code. For there are problems calling the original Devise generators in Rails 2. See also this Stackoverflow issue.

CMS content

In Rails 3

Run the following in your console:


  rails g rich:cms_content -m

Note: At default, it will create the CmsContent model and CreateCmsContents migration. You can alter the class name with the following:


  rails g rich:cms_content CmsItem -m

In Rails 2

Run the following in your console:


  script/generate rich_cms_content -m

In case you have used the Rails generators, you can skip the Create required entities manually section and go straight to Render Rich-CMS in your views.

Create required entities manually

Specify the authentication mechanism

Rich-CMS can be used without an authentication mechanism (which is the default by the way), you just have to open “/cms” in your browser and you are ready to go. But it is common to have authentication and Rich-CMS support Devise and Authlogic.

Provide the authentication logic as a symbol (e.g. :devise) and the authenticated class like this:


  Rich::Cms::Auth.setup do |config|
    config.logic = :devise
    config.klass = "User"
  end

The following specifications are optional as Rich-Cms uses defaults:

  • :inputs (default: [:email, :password]) – The attributes used for the login panel of Rich-CMS
  • :identifier (default: based on inputs) – The method used for displaying the identity of the current Rich-CMS admin (this is the first entry of inputs, so usually :email)
  • :current_admin_method (default: based on klass) – The controller method used to retrieve the current Rich-CMS admin (e.g. current_user when configured User as authenticated class)

Register CMS content

Every type of content is identified with its correspending CSS selector (used by the jQuery based Javascript module of Rich-CMS). You will have to provide some specifications:

  • :class_name – The class of the CMS content model which contain the data

The following specifications are optional as Rich-Cms uses defaults:

  • :key (default: :key) – The key used for identification of content. You can also provide an array for a combined key (e.g. [:key, :locale])
  • :value (default: :value) – The attribute which stores the value of the content instance.
  • :tag (default: :div) – The HTML tag used for content items.
  • :add (default: []) – An array of the content item attributes included within the HTML attributes.
  • :before_edit (default: nil) – Javascript function called before showing the edit form of a content item.
  • :after_update (default: Rich.Cms.Editor.afterUpdate) – Javascript function called after update a content item.

  Rich::Cms::Engine.register(".cms_content", {:class_name => "Cms::StaticContent"})
  Rich::Cms::Engine.register(".i18n"       , {:class_name => "Translation", :key => [:key, :locale], :before_edit => "Rich.I18n.beforeEdit", :after_update => "Rich.I18n.afterUpdate"})

Render Rich-CMS in your views

Alter your layout

Add the following line at the beginning of the <body> tag:


  <body>
    <%= rich_cms %>
    ...
  </body>

Use the Rich-CMS helper method

Rich-CMS requires a rendered DOM element provided with meta data of the content instance. Fortunately, you can call a helper method to render Rich-CMS content tags. Just specify the identifier of the content type and the key of the CMS content instance in question:


  >> key = "test_content"
  => "test_content"
  >> rich_cms_tag(".cms_content", key)
  => "<div class='cms_content' data-key='test_content' data-value='Hello world!'>Hello world!</div>"

When using a combined key for content identification, just call it as follows:


  >> rich_cms_tag(".cms_content", {:key => key, :locale => I18n.locale})
  => "<div class='cms_content' data-key='test_content' data-locale='nl' data-value='Hallo wereld!'>Hallo wereld!</div>"

Note: In this case, the content was registered with Rich::Cms::Engine.register(".cms_content", {:class_name => "Cms::StaticContent", :key => [:key, :locale]})

The helper method is provided with the following options:

  • :as (default: auto-determine :string or :text) – Specify the input type shown in the edit form (:string for an input text, :text for a textarea and :html for a WYSIWYG HTML editor).
  • :tag (default: auto-determine :div or :span) – The HTML tag used for content items.
  • :html (default: {}) – HTML attributes added to the content tag (e.g. :id, :class)

  ...
  <%= rich_cms_tag ".cms_content", "test_content", :as => :html %>
  <%= rich_cms_tag ".cms_content", {:key => "test_content", :locale => I18n.locale} %>
  ...

Rich-CMS in your browser

Open http://localhost:3000/cms, log in and start managing CMS content.

Customizing the after update implementation

The update action response of Rich::CmsController is provided with JSON data regarding the updated content item. The response will be passed to the after_update Javascript function. Its default JSON data:


  {"__selector__": ".cms_content", "__identifier__": {"key": "test_paragraph"}, "value": "Hello world!"}

Note: __selector__ and __identifier__ are always provided in the JSON data.

When specifying a custom after update Javascript function, you probably want to acquire more information than provided in the default JSON data. You can customize this by defining the to_rich_cms_response method in the CMS content model class:


  class Translation < ActiveRecord::Base

    def to_rich_cms_response(params)
      {:value => value, :translations => Hash[*params[:derivative_keys].split(";").uniq.collect{|x| [x, x.t]}.flatten]}
    end

  end

The JSON data provided will look like:


  {"__selector__": ".i18n", "__identifier__": {"locale": "nl", "key": "word.user"}, "value": "gebruiker", "translations": {"users": "gebruikers"}}

Contact me

For support, remarks and requests please mail me at [email protected].

Credit

This Rails gem / plugin depends on:

jQuery
http://jquery.com

Devise (optional)
http://github.com/plataformatec/devise

AuthLogic (optional)
http://github.com/binarylogic/authlogic

SASS
http://sass-lang.com

Jzip
http://codehero.es/rails_gems_plugins/jzip
http://github.com/archan937/jzip

RaccoonTip
http://codehero.es/jquery_libraries/raccoon_tip
http://github.com/archan937/raccoon_tip

SeatHolder
http://codehero.es/jquery_libraries/seat_holder
http://github.com/archan937/seat_holder

CLEditor
http://premiumsoftware.net/cleditor/index.html

Contributors

Mark Mulder – @bitterzoethttp://ikbenbitterzoet.com Stephan Kaag – @stephankaaghttp://hollandonrails.nl Jeroen Bulters – @bultershttp://bulte.rs Chris Obdam – @chrisobdamhttp://holder.nl

ToDo’s

  • Support alternative ORM’s and key/value stores (with Toystore and Moneta probably)
  • Check out compatibility with Devise 1.2.0
  • Provide better conventions for content rendering
  • Provide tools to use Textile, MarkDown, image files upload and models (e.g. products)
  • Add cache feature which uses the standard Rails cache (rich_cms_tag “.cms_content”, “test_content”, :cache => true)

Enrichments

The all-in-one gem at – http://codehero.es/rails_gems_plugins/e9shttp://github.com/archan937/e9s

E9s modules

License

Copyright © 2010 Paul Engel, released under the MIT license

http://holder.nlhttp://codehero.eshttp://gettopup.comhttp://twitter.com/archan937[email protected]

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.