Customize your blog

Ecrire generated a vanilla template for your blog. Everything you see in the folder is for you to modify. As you'll see below, there's already a lot that Ecrire comes with to help you make your blog yours.

Many of the features that are displayed here come directly from Ruby on Rails. This is because Ecrire is built on top of it. That means that if you are already a user of Rails, you know almost everything there is to know about customizing your blog.

Views

Views are where the HTML is built. It is built arount the concept of layout, views and partials. The three elements are nested together to create the HTML that will be sent to the browser — like this page.

The layout

The layout is where you put everything that is reused on every page. The layout is where you set the document type, the <head> element and everything else that you want to have on every page.

<%= Rails.root %>/views/layouts/application.html.erb

<%= render('static/customize/layout').to_str %>

One thing you must have in your layout is the <%= yield %> call. This call will inject the view into the layout. If you want to learn more about the layout, Ruby on rails has a great guide that explains the layout more thoroughly.

Views

The post views is where you can customize your HTML dependant of the URL access. Initially, there's two views configured: posts/index.html.erb and posts/show.html.erb

This view is the home page of your blog. If you want to list your post entries, you can do it by adding this code snippet to your view:

<%= Rails.root %>/views/posts/index.html.erb

<%= render('static/customize/index').to_str %>

And then add more HTML through a the partial.

<%= Rails.root %>/views/posts/_post.html.erb

<%= render('static/customize/post').to_str %>

Helpers

Helpers are modules you can create to define methods that can be used for different purposes.

<%= Rails.root %>/helpers/your_helper.rb

<%= render('static/customize/helper').to_str %>

It is automatically available in your views.

<%= Rails.root %>/helpers/your_helper.rb

<%= render('static/customize/helper_used').to_str %>

Assets

The assets are the CSS, JS and any images you would like to show on your blog that aren't a part of a blog post. Ecrire — via Rails — provides a few mechanism to help you build customize your theme.

Everything that is described here can be found in use within your default theme. Just browse the code to see an example of what is documented here.

Stylesheets

Stylesheets can either be pure CSS or SASS. Rails will use the SASS preprocessor if the file ends with .scss.

You will notice a file name base.css.scss with a few @import rules. These rules are necessary if you want to include other files besides the required base.css. Since it supports wildcard, you don't need to specify every file in your folder.

You can also add libraries that are available as gem. By default, Ecrire comes with Bourbon, which is imported by default. That means you can have access to all the bourbon mixins from any stylesheet.

Javascripts

Javascripts can either be pure Javascript or Coffeescript.

If you choose to use Coffeescript, you only need to append .coffee to your file to enable the pre-compiler. Similar to your stylesheets, javascript has an import rule. While the @import rule is specified within the CSS Standard, ECMAScript doesn't have such a thing.

Sprockets uses a directive through commenting the top of the file. It uses a similar syntax it shouldn't be too hard to make modification. Also, there's an example from within this theme.

<%= Rails.root %>/assets/javascripts/base.js.coffee

<%= render('static/customize/javascript').to_str %>

Note that if you want to use vanilla javascript, you will need to use the commenting syntax for javascript (//=).

Images

Images can be any format that are supported by the browser. However, you need to use a helper when you use images that you put in the assets/images folder.

<%= Rails.root %>/assets/images/header.png

<%= render('static/customize/image').to_str %>