#332 Refinery CMS Basics

Mar 14, 2012 | 11 minutes | Views, Plugins

If you need to quickly create an informational site that can be easily edited, consider using a content management system. Here I show how to build a site using Refinery CMS.

Click to Play Video ▶

Download:
source codeProject Files in Zip (534 KB)
mp4Full Size H.264 Video (37.2 MB)
m4vSmaller H.264 Video (16.3 MB)
webmFull Size VP8 Video (17.9 MB)
ogvFull Size Theora Video (38.1 MB)

shaman-sh over 12 years ago

please, cast-pro about refinery!!! awesome and dynamic project, but it has no any guides or structural documentation.

Joe Sak over 12 years ago

We're working on that ; )

Andy L over 12 years ago

Is Refinery compatible with Twitter Bootstrap?

shaman-sh over 12 years ago

yes, but not out of the box. there are no CLI args to generate bootstrap layout or use it as core's stylesheet. it's clear how to override your own views using bootstrap, but not the whole cms. for me as newbie it takes a lot of time to understand how it works.. also, you can not extrac refinery gem sources to vendor/ for convinience.

Enrico Carlesso over 12 years ago

Yes. To be complete, Refinery is compatible with anything you may want. As @shaman-sh sayd, it may take some time to understand how.

I found out that browsing the source of refinery-core was explanatory.
Working with these views I've been able to restyle everything I need:

          
        
./refinery/_content_page.html.erb
./refinery/_footer.html.erb
./refinery/_head.html.erb
./refinery/_header.html.erb
./refinery/_menu.html.erb
./refinery/_menu_branch.html.erb

But most important (and I had to copy by hand) layouts/application.html.erb can make your life easier. Anyway is pretty simple (this is my version with already container-fluid class for the page_container):

          html
        
<!DOCTYPE html>
<%= render '/refinery/html_tag' %>
  <% site_bar = render('/refinery/site_bar', :head => true) -%>
  <%= render '/refinery/head' %>
  <body>
    <%= site_bar -%>
    <%= render '/refinery/ie6check' if request.env['HTTP_USER_AGENT'] =~ /MSIE/ -%>
    <div id="page_container" class="container-fluid">
      <header id="header">
        <%= render '/refinery/header' -%>
      </header>
      <section id="page">
        <%= yield %>
      </section>
      <footer class="footer">
        <%= render '/refinery/footer' -%>
      </footer>
    </div>
    <%= render '/refinery/javascripts' %>
  </body>
</html>

Tony over 12 years ago

Enrico,

How did you set twitter's column classes (like .span8) to refinery's page sections (body and side_body)?

I've gotten to the same point in your layouts/application file, but am hitting a roadblock when trying to style the inner page section.

thanks for the help

Ben about 12 years ago

Hi Enrico,

first of all thanks for your hints on how to get Bootstrap up and running.

I noticed that in the meantime

rake refinery:override view=layouts/application

works for generating app/views/layouts/application.html.erb

Best,
Ben.

Radha over 12 years ago

I tried Refinary a long time ago but there is no good documentation, it must have taken you quite some time digging through the source code to figure all this out ryan

Chris Irish over 12 years ago

You must not have looked very hard

Refinery Guides

shaman-sh over 12 years ago

it's fair and superficially. just for getting started.

Radha over 12 years ago

i was looking into several rails cms a about a year or so ago and none had good documentation. I just checked the new Refinary docs and they are much better than what i remember.

Joe Sak over 12 years ago

There is also an active IRC channel #refinerycms at irc.freenode.net but yes the guides need work. They are outdated and could use some organization to be sure. The core team and friends are gearing up to dedicate some time to it, especially in light of being featured on Railscasts

gajeev over 12 years ago

the github readmes are also a good source

Phillip Miller over 12 years ago

I guess this means we've finally hit the big time. Not that I'm apart of the team, but I've been following this project for quite some time now and its good to see it mentioned here by Ryan.

Juergen Helmers over 12 years ago

Thanks for the screencast. We have been using refinerycms extensively and really like it a lot. Now that the new version is out it seems time to check it out.

Robin Böning over 12 years ago

All these CMS (with a page model and a body column) out there are missing one big thing:
A flexible content storing architecture.

I would never give one big editor for managing the texts, formattings, images to my client. The client always breaks the layout, because of too many possibilities.
Take a look at http://alchemy-cms.com - its architecture is completly different and the usage is enduser-centric ;-)

Thomas von Deyen over 12 years ago

Right, Robin.

If anyone is interested in an extremely flexible rails cms, that completely separates content, markup and styling, then you really should try Alchemy CMS.

Do you really want to give your customers a TinyMCE editor, where he has to put images into markup? I doubt that! Refinery and all other "Page model, body column" cms are great if you need a small little cms addon for your own rails app and you, as a developer, manages the content for your customer.

But if you want to let your customer manage a whole webpage with several different page layouts and page elements you won't make him happy with such a cms.

Please try Alchemy :)

Joe Sak over 12 years ago

With the right combination of engines and development techniques, it's possible to give clients complicated and well-layed-out web sites. I think we've demonstrated that here http://www.neotericdesign.com/portfolio and our own site is in Refinery.

Thomas von Deyen over 12 years ago

Yes, you are right. You always can use any kind of technique to achieve the same goal.
You could do this even with wordpress, for sure.

But does your customer has a technical background? Does he know what a 'p' is and what this means? Ours have not, and they should not, IMHO. How do you prevent failures in markup? Especially in SEO concerns? Alchemy decouples the markup 100% from styling and content. So a heading is always a H1 tag (or what ever the webdev wants it to be). The user does not even has the chance to change that and is save from making errors. And they love Alchemy for that!

How do you ensure this with refinery? Do you wrote tinymce plugins, not really? And how do you manage repeatable, global content, like teaser boxes, footer parts, etc. And what does this mean for your developers? It is easy and intuitive to implement?

I think it is always a question of perspective.

You really should give Alchemy a try for your next project.

I am sure you will love it :)

Regards

Josef over 12 years ago

For repeatable content you can use refinerycms-copywriting. TinyMCE is garbage. It is better to provide few basic well styled styles like WYMEditor does in RefineryCMS. User can't destroy web with own content easily.

You can disable H1 in WYMEditor easily and force H1 into layout or page partial. You're free to do anything you want with HTML markup.

If basic pages are not enough for you, just generate own engine and customize. Everytime you're working with Refinery code, you're just using yours Rails skills. You don't need more knowledge. Everything is just a Rails engine.

Alchemy is pure CMS. Refinery is more framework than CMS. I'm customizing Refinery (backend and frontend) for each site I'm building. It is very easy to do with Refinery.

You can compare guides:
* plugin for Alchemy
* Refinery engine

The difference is significant. I'm not Alchemy hater. I'm just answering your questions. Feel free to join freenode#refinerycms, if you have another questions about Refinery.

Robin Böning over 12 years ago

The alchemy guide you mentioned is old. Bad that this one is still online, but you can find the actual guide here: http://guides.alchemy-cms.com/creating_modules.html

Since Rails3.1 and mountable engines, this is also implemented.
Alchemy is not only a CMS, its a framework for storing and rendering content.

You first have to understand the architecture behind it, but then its really flexible and comfortable for the user.

Have you ever tried Alchemy?

Joe Sak over 12 years ago

You can relabel the buttons to say anything you want but yes, regardless of our clients' technical skill level, we have trained every single one of them to use the CMS successfully with good, clear documentation and excellent 1-on-1 training sessions, followed by ongoing support if they still have questions. No one has ever, ever had a problem understanding H1, H2, P, etc.

if the client has specific SEO goals, we train them with a style guide of which buttons they should use for what kind of content and heading. It's not hard at all. They get it easily. We also make sure the auto generated markup around their content (this is especially easy with custom engines where they fill in fields more than rich text boxes) is semantic and optimized.

Radha over 12 years ago

*starts eating pop corn*

Philip Arndt over 12 years ago

Seems useful to declare that you guys actually write Alchemy CMS ( judging by that you're the two largest contributors to the project :-) )

Thomas von Deyen over 12 years ago

Yes, you are right. Great work on Refinery btw.

I wanted to show people some alternatives.

And to be very clear: I do not want to start a "A is better than B" discussion. I think it's great to have choice. Refinery is great in what it does, so it's Alchemy.

Joe Sak over 12 years ago

Yep, not trying to start a fight, just defending our work. Haven't tried Alchemy, never intended to say or imply anything about it.

Joe Sak over 12 years ago

I confirm the page parts bug is fixed in 2.0.2. Thanks!

Philip Arndt over 12 years ago

Great RailsCast, Ryan! Thank you so much for covering Refinery CMS. It makes all the effort that we put into it just that little bit more worthwhile :-)

Rutger Karlsson over 12 years ago

Great cast ryan. Any plans on BrowserCMS?

There is a nice (somewhat oudated) comparsion here

dkowalski over 12 years ago

Hi Ryan and rails cast groupies! One thing I ran into which I thought might be worth a mention:
if you develop on Linux system as I do be sure to include the gem 'therubyracer' in your Gemfile. By default refinery doesn't include it. The reason you need it is on linux there is no default JS engine. I was getting very strange behavior and lots of JS errors in my log.

Otherwise great cast!

Tim Guibord over 12 years ago

Is anyone else having issues viewing this episode?

It either won't start streaming or will stop streaming about a minute in. Wouldn't let me download the MP4 version either.

Do3SoNC over 12 years ago

I'm having an issue. I have everything installed properly, in fact I even have the website up in localhost with a little bit of style to it. My issue is my admin panel doesnt look like that of which is in this video. For instance: Under those tabs body and side body, im missing that "tool bar" per-say. Where it gives the options of including h1 h2 tags, inserting images, html, et. Why is that?

Also when I click advanced options, nothing happens, also; I cant slide the top tabs the way I like them. Which seems fluid in this video. I'm using windows.

enclosed an image to see the lack of tool bar:
http://i50.tinypic.com/2zptemp.png

David Ortiz Frau over 10 years ago

Where you able to fix this problem? If so, can you let me know what the bug is?

Andrey Koleshko about 12 years ago

Check out Locomotive CMS overview in my blog - http://railsguides.net/2012/09/24/the-best-content-management-system-cms . Locomotive CMS is the best system for today in my opinion

nswish over 11 years ago

Could you tell me how did you float image above the paragraphs.In my refinery WYMediator, image couldn't be placed the postion I want it.

saich over 10 years ago

hello guys i am niewbie so

i am get some confused during installation of refinerycms.some how i've installed refinerycms but when excute the code there is no authentication process and no files in my app directory it is running gems installed path.but companyname, home, about pages are displayed.

i am using Windows 8 os. how can i get the code run in my app dir.

please kindly help me to learn about refinery cms dudes.

Tom Connolly about 10 years ago

Saich, I hope you haven't been waiting all this time, but if others have the same issue: append "/refinery" (without the quotes) to your url to get to the backend, or dashboard.