diff --git a/app/assets/javascripts/locomotive/models/snippet.js.coffee b/app/assets/javascripts/locomotive/models/snippet.js.coffee
new file mode 100644
index 00000000..10a6467a
--- /dev/null
+++ b/app/assets/javascripts/locomotive/models/snippet.js.coffee
@@ -0,0 +1,7 @@
+class Locomotive.Models.Snippet extends Backbone.Model
+
+  paramRoot: 'snippet'
+
+  urlRoot: "#{Locomotive.mount_on}/snippets"
+
+class Locomotive.Models.SnippetsCollection extends Backbone.Collection
\ No newline at end of file
diff --git a/app/assets/javascripts/locomotive/views/snippets/_form_view.js.coffee b/app/assets/javascripts/locomotive/views/snippets/_form_view.js.coffee
new file mode 100644
index 00000000..f2cd2d5b
--- /dev/null
+++ b/app/assets/javascripts/locomotive/views/snippets/_form_view.js.coffee
@@ -0,0 +1,62 @@
+#= require ../shared/form_view
+
+Locomotive.Views.Snippets ||= {}
+
+class Locomotive.Views.Snippets.FormView extends Locomotive.Views.Shared.FormView
+
+  el: '#content'
+
+  events:
+    'click    a#image-picker-link': 'open_image_picker'
+    'submit':                       'save'
+
+  initialize: ->
+    _.bindAll(@, 'insert_image')
+
+    @model = new Locomotive.Models.Snippet(@options.snippet)
+
+    window.foo = @model
+
+    @image_picker_view = new Locomotive.Views.ThemeAssets.ImagePickerView
+      collection: new Locomotive.Models.ThemeAssetsCollection()
+      on_select:  @insert_image
+
+    Backbone.ModelBinding.bind @
+
+  render: ->
+    super()
+
+    # slugify the slug field from name
+    @slugify_name()
+
+    # liquid code textarea
+    @enable_liquid_editing()
+
+    return @
+
+  slugify_name: ->
+    @$('#snippet_name').slugify(target: @$('#snippet_slug'))
+
+  open_image_picker: (event) ->
+    event.stopPropagation() & event.preventDefault()
+    @image_picker_view.editor = @editor
+    @image_picker_view.render()
+
+  insert_image: (path) ->
+    text = "{{ '#{path}' | theme_image_url }}"
+    @editor.replaceSelection(text)
+    @image_picker_view.close()
+
+  enable_liquid_editing: ->
+    input = @$('#snippet_template')
+    @editor = CodeMirror.fromTextArea input.get()[0],
+      mode:             'liquid'
+      autoMatchParens:  false
+      lineNumbers:      false
+      passDelay:        50
+      tabMode:          'shift'
+      theme:            'default'
+      onChange: (editor) => @model.set(template: editor.getValue())
+
+  after_inputs_fold: ->
+    @editor.refresh()
\ No newline at end of file
diff --git a/app/assets/javascripts/locomotive/views/snippets/edit_view.js.coffee b/app/assets/javascripts/locomotive/views/snippets/edit_view.js.coffee
new file mode 100644
index 00000000..01952a19
--- /dev/null
+++ b/app/assets/javascripts/locomotive/views/snippets/edit_view.js.coffee
@@ -0,0 +1,6 @@
+Locomotive.Views.Snippets ||= {}
+
+class Locomotive.Views.Snippets.EditView extends Locomotive.Views.Snippets.FormView
+
+  save: (event) ->
+    @save_in_ajax event
\ No newline at end of file
diff --git a/app/assets/javascripts/locomotive/views/snippets/new_view.js.coffee b/app/assets/javascripts/locomotive/views/snippets/new_view.js.coffee
new file mode 100644
index 00000000..ba5e50d0
--- /dev/null
+++ b/app/assets/javascripts/locomotive/views/snippets/new_view.js.coffee
@@ -0,0 +1,8 @@
+Locomotive.Views.Snippets ||= {}
+
+class Locomotive.Views.Snippets.NewView extends Locomotive.Views.Snippets.FormView
+
+  save: (event) ->
+    @save_in_ajax event,
+      on_success: (response, xhr) ->
+        window.location.href = xhr.getResponseHeader('location')
\ No newline at end of file
diff --git a/app/controllers/locomotive/snippets_controller.rb b/app/controllers/locomotive/snippets_controller.rb
index 03a8a227..03c83b0b 100644
--- a/app/controllers/locomotive/snippets_controller.rb
+++ b/app/controllers/locomotive/snippets_controller.rb
@@ -3,7 +3,7 @@ module Locomotive
 
     sections 'settings', 'theme_assets'
 
-    respond_to :json, :only => :update
+    respond_to :json, :only => [:create, :update]
 
     def new
       @snippet = current_site.snippets.new
@@ -12,7 +12,7 @@ module Locomotive
 
     def create
       @snippet = current_site.snippets.create(params[:snippet])
-      respond_with @snippet, :location => edit_snippet_url(@snippet)
+      respond_with @snippet, :location => edit_snippet_url(@snippet._id)
     end
 
     def edit
@@ -22,8 +22,8 @@ module Locomotive
 
     def update
       @snippet = current_site.snippets.find(params[:id])
-      @snippet.update_attributes(params[:id])
-      respond_with @snippet, :location => edit_snippet_url(@snippet)
+      @snippet.update_attributes(params[:snippet])
+      respond_with @snippet, :location => edit_snippet_url(@snippet._id)
     end
 
     def destroy
diff --git a/app/inputs/locomotive/code_input.rb b/app/inputs/locomotive/code_input.rb
index 6fad2c2f..8c5b0729 100644
--- a/app/inputs/locomotive/code_input.rb
+++ b/app/inputs/locomotive/code_input.rb
@@ -22,7 +22,7 @@ module Locomotive
       return '' if options.delete(:picker) == false
       template.content_tag(:div,
         template.link_to(template.t('locomotive.image_picker.link'), template.theme_assets_path, :id => 'image-picker-link', :class => 'picture'),
-        :class => 'more')
+        :class => 'more error-anchor')
     end
 
   end
diff --git a/app/models/locomotive/snippet.rb b/app/models/locomotive/snippet.rb
index 75003f23..d5835721 100644
--- a/app/models/locomotive/snippet.rb
+++ b/app/models/locomotive/snippet.rb
@@ -20,8 +20,16 @@ module Locomotive
     validates_presence_of   :site, :name, :slug, :template
     validates_uniqueness_of :slug, :scope => :site_id
 
+    ## behaviours ##
+    attr_protected  :id
+    attr_accessible :name, :slug, :template
+
     ## methods ##
 
+    def as_json(options = {})
+      Locomotive::SnippetPresenter.new(self).as_json
+    end
+
     protected
 
     def normalize_slug
diff --git a/app/presenters/locomotive/snippet_presenter.rb b/app/presenters/locomotive/snippet_presenter.rb
new file mode 100644
index 00000000..16354772
--- /dev/null
+++ b/app/presenters/locomotive/snippet_presenter.rb
@@ -0,0 +1,11 @@
+module Locomotive
+  class SnippetPresenter < BasePresenter
+
+    delegate :name, :slug, :template, :to => :source
+
+    def included_methods
+      super + %w(name slug template)
+    end
+
+  end
+end
\ No newline at end of file
diff --git a/app/views/locomotive/sites/_form.html.haml b/app/views/locomotive/sites/_form.html.haml
index c130aabc..cbf691db 100644
--- a/app/views/locomotive/sites/_form.html.haml
+++ b/app/views/locomotive/sites/_form.html.haml
@@ -9,37 +9,4 @@
     = f.input :subdomain, :as => :'Locomotive::Subdomain', :domain => application_domain, :input_html => { :readonly => !manage_subdomain? }
 
     - if manage_domains?
-      = f.input :domains, :as => :'Locomotive::Empty'
-
-
-/ - if manage_subdomain_or_domains?
-/   = f.foldable_inputs :name => :access_points, :class => 'editable-list off' do
-/
-/     = f.custom_input :subdomain, :css => 'path' do
-/       %em
-/         http://
-/       = f.text_field :subdomain
-/       \.
-/       %em
-/         = application_domain
-/
-/     - if manage_domains?
-/       - @site.domains_without_subdomain.each_with_index do |name, index|
-/         %li{ :class => "item added #{'last' if index == @site.domains.size - 1}" }
-/           %em
-/             http://
-/           = text_field_tag 'site[domains][]', name, :class => 'string label void domain'
-/           &nbsp;
-/           = error_on_domain(@site, name)
-/           %span.actions
-/             = link_to image_tag('admin/form/icons/trash.png'), '#', :class => 'remove first', :confirm => t('locomotive.messages.confirm')
-/
-/       %li.item.template
-/         %em
-/           http://
-/         = text_field_tag 'label', t('formtastic.hints.site.domain_name'), :class => 'string label void domain'
-/         &nbsp;
-/         %span.actions
-/           = link_to image_tag('admin/form/icons/trash.png'), '#', :class => 'remove first', :confirm => t('locomotive.messages.confirm')
-/           %button{ :class => 'button light add', :type => 'button' }
-/             %span!= t('locomotive.buttons.new_item')
\ No newline at end of file
+      = f.input :domains, :as => :'Locomotive::Empty'
\ No newline at end of file
diff --git a/app/views/locomotive/snippets/_form.html.haml b/app/views/locomotive/snippets/_form.html.haml
index 91c44004..69890447 100644
--- a/app/views/locomotive/snippets/_form.html.haml
+++ b/app/views/locomotive/snippets/_form.html.haml
@@ -1,6 +1,9 @@
 - content_for :head do
-  / = include_javascripts :image_picker, :snippets
-  / = include_stylesheets :fancybox
+  = render '/locomotive/theme_assets/picker'
+
+- content_for :backbone_view_data do
+  :plain
+    { snippet: #{@snippet.persisted? ? @snippet.to_json : 'null'} }
 
 = f.inputs :name => :information do
   = f.input :name, :wrapper_html => { :class => 'highlighted' }
diff --git a/doc/TODO b/doc/TODO
index 9a6d797a..c0ba52ff 100644
--- a/doc/TODO
+++ b/doc/TODO
@@ -23,8 +23,9 @@ x edit my site
 - fix other sections
   x edit my account
   x create a new site
-  x create a new account
+  x create a new accounts
   - theme assets
+    x snippets
     - polish the page
     - upload many files at once
     - delete in ajax
diff --git a/vendor/assets/javascripts/slugify.js b/vendor/assets/javascripts/slugify.js
new file mode 100644
index 00000000..e175bca1
--- /dev/null
+++ b/vendor/assets/javascripts/slugify.js
@@ -0,0 +1,28 @@
+/**
+ * Version 0.0.1
+ * Fill in an input field from another one (source)
+ * and apply a filter on the string (slugify)
+ * Didier Lafforgue
+ */
+$.fn.slugify = function(settings) {
+
+  settings = $.extend({
+    sep: '-'
+  }, settings);
+
+  var target = $(settings.target);
+  target.data('touched', (target.val() != ''));
+
+  var makeSlug = function(event) {
+    var source = $(this);
+    var newVal = source.val().slugify(settings.sep);
+
+    if (!target.data('touched')) target.val(newVal);
+  }
+
+  target.bind('keyup', function(event) {
+    $(this).data('touched', ($(this).val() != ''));
+  });
+
+  return $(this).bind('keyup', makeSlug);
+};
\ No newline at end of file