Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/stve/tophat

TopHat is a set of view helpers to keep your Rails layouts and views DRY.
https://github.com/stve/tophat

Last synced: 23 days ago
JSON representation

TopHat is a set of view helpers to keep your Rails layouts and views DRY.

Awesome Lists containing this project

README

        

# TopHat

[![Gem Version](http://img.shields.io/gem/v/tophat.svg)][gem]
[![Build Status](http://img.shields.io/travis/stve/tophat.svg)][travis]
[![Dependency Status](http://img.shields.io/gemnasium/stve/tophat.svg)][gemnasium]
[![Code Climate](http://img.shields.io/codeclimate/github/stve/tophat.svg)][codeclimate]

[gem]: https://rubygems.org/gems/tophat
[travis]: https://travis-ci.org/stve/tophat
[gemnasium]: https://gemnasium.com/stve/tophat
[codeclimate]: https://codeclimate.com/github/stve/tophat

TopHat is a set of view helpers to keep your layouts and views DRY. Easily include meta tags like keywords and descriptions, Open Graph and Twitter Cards in your Rails views.

## Installation

Just add it to your Gemfile:

gem 'tophat'

Note: TopHat is compatible with Rails 3.0+.

## Changes in 2.1

TopHat version < 2.1 aliased the `title` as `t` and conflicted with an existing Rails helper used for i18n translation. Version 2.1 removes this alias. If you were using `t` as part of TopHat previously, you will need to change your code to use TopHat's `title` helper instead.

## Layout Usage

You'll want to add the relevant TopHat helpers to your layouts:


<%= title :site => "My website", :separator => '|' %>
<%= keywords :default => "Some default, keywords, that can be overridden" %>
<%= description :default => "A description" %>

## View Usage

To set the page title, use the title method to each of your views:

<% title "My page title" %>

When rendered, the page title will be included in your view.


My website | My page title

## Usage Options

Use these options to customize the title format:

* `:prefix` (text between site name and separator) [default: '']
* `:separator` (text used to separate website name from page title) [default: '']
* `:suffix` (text between separator and page title) [default: ' ']
* `:lowercase` (when true, the entire title will be lowercase)
* `:uppercase` (when true, the entire title will be uppercase)
* `:reverse` (when true, the page and site names will be reversed)
* `:reverse_on_default` (when true it will lead to a 'Default Title | Site' title when using a default title)
* `:default` (default title to use when title is blank)

And here are a few examples to give you ideas.

<%= title :separator => "|" %>
<%= title :prefix => false, :separator => ":" %>
<%= title :lowercase => true %>
<%= title :reverse => true, :prefix => false %>
<%= title :default => "The ultimate site for Rails" %>

These options can be set as defaults for your layout, or when setting the title in your views, you can override any of the default settings by passing an optional hash

<% title "My page title", :lowercase => true, :separator => "~" %>

## Meta Tags

TopHat also works with keywords and descriptions. In your view, simply declare the keywords and description.

<% description('You say goodbye, I say hello.') %>
<% keywords('John, Paul, George, Ringo') %>

Keywords can also be passed as an array:

<% keywords(%w{ John Paul George Ringo }) %>

Then in your layout, add the keyword and description helpers:

<%= keywords %>
<%= description %>

which will output the meta-tags:


Keywords and descriptions can also take a default in the layout:

<%= keywords :default => 'Yoko, Linda' %>
<%= description :default => 'default description if none is passed' %>

Want to merge your default tags with those in your view? just pass `merge_default => true`

<%= keywords :default => 'Yoko, Linda', :merge_default => true %>

There are also convenience methods for common meta tags:

<%= noindex() %> # outputs:
<%= noindex('googlebot') # outputs:
<%= nofollow() %> # outputs:
<%= nofollow('googlebot') # outputs:
<%= canonical('http://mysite.com/somepath/') %> # outputs:

## Browser Conditionals

TopHat can generate a lot of different browser conditional comments:

ie_5_conditional do
stylesheet_link_tag 'ie'
end

will render:

You can also pass in conditions via an argument to the conditional:

ie_5_5_conditional(:lt) =>