Themeforest 到 Rails 应用程序 [英] Themeforest to Rails App

问题描述

这是我第一次为 rails 应用程序使用外部 HTML 主题.我已经从 Themeforest 下载了一个主题.当然，它带有大量的 JS、CSS 和图像.我想知道你们大多数人在将主题集成到 Rails 应用程序时使用什么工作流程.

• 您是否将所有下载的资产都放在公共文件夹中?还是将它们放在 app/assets 中的适当文件夹中，然后修复图像 url 等?

解决方案

我认为这个问题会根据意见得到答案，但是您可以尝试使用此 gem 为您的应用程序安装静态 html(未测试).

改为

<块引用>

<%= link_to "Home", root_path %>

表单标签你可以阅读这个

<块引用>

<%= form_tag("action", method: "post") do %><%= label_tag(:q, "Label for:") %><%= text_field_tag(:q) %><%= submit_tag("保存") %><%结束%>

编辑任何文件以符合 rails

你可以看看这个

• 资产管道
• Rails 中的布局和渲染
• 表单助手

更新资产管道

修复非常简单.打开位于 config/application.rb 的项目配置文件，并在 Application 类中添加以下行:

<块引用>

config.assets.paths <<Rails.root.join("app", "assets", "fonts")config.assets.precompile += %w( .svg .eot .woff .ttf )

This is my first time using an external HTML theme for a rails app. I have downloaded a theme from Themeforest. Of course it comes with tons of JS, CSS and images. I was wondering what workflow most of you guys use when integrating a theme into your rails app.

• Do you put all the downloaded assets in the public folder? Or do you put them in appropriate folders in app/assets and then fix the image urls etc.?

解决方案

I think this question will get answers based on opinion, but you can try this gem to install static html for your application (not tested) . install_theme gem. For reference to use this gem read this blog http://drnicwilliams.com/category/ruby/ruby-on-rails/page/2/ (If I put tuts in here my answer will full post)

For your question :

Do you put all the downloaded assets in the public folder? Or do you put them in appropriate folders in app/assets and then fix the image urls etc.?

My workflow looks like :

1. Put css, js, image, font files to assests directory

   -assets
      - fonts
      - images
      - javascripts
      - stylesheets
   

2. Editing url image, url font in css files and js files.

   If I use extention css.erb for css file, url image, url font should edit looks like :

   image :

   background-image:url(<%= asset_path 'bg.png' %>);  
   

   font :

   @font-face {
       font-family: namefonts;
       src: url('<%= asset_path('namefonts.eot') %>');
       src: url('<%= asset_path('namefontsd41d.eot') %>?#iefix') format('embedded-opentype'), 
          url('<%= asset_path('namefonts.woff') %>') format('woff'), 
          url('<%= asset_path('namefonts.ttf') %>') format('truetype'), 
          url('<%= asset_path('namefonts.svg') %>#icons') format('svg');
       font-weight: 400;
       font-style: normal;
   }
   

   If I use extention css.scss

   image :

   background : image-url("bg.png")
   

   font :

   @font-face {
   font-family:'namefonts';
   src:font-url('namefonts.eot');
   src:font-url('namefonts.eot?#iefix') format('embedded-opentype'),
   
    ...
   } 
   

3. Choose html structure to layout template (head tag, header, navbar, sidebar footer), partial template (contents, forms etc) - If I use html.erb

   -views
      - layouts
      - partials
        - form
        - index
   

   Coding Links to Assets

   <%= stylesheet_link_tag "application", media: "all" %>
   <%= javascript_include_tag "application" %>
   

4. Editing image tag, url tag, form tag etc to conform with rails template (erb file)

   image tag

   example in html

   <img src="images/rails.png" class="theclass"/>   
   

   change to

   <%= image_tag "rails.png", :class => 'theclass' %>
   

   link tag

   example in html

   <a href="index.html">Home</a>
   

   change to

   <%= link_to "Home", root_path %>
   

   form tag you can read this

   <%= form_tag("action", method: "post") do %>
    <%= label_tag(:q, "Label for:") %>
    <%= text_field_tag(:q) %>
    <%= submit_tag("Save") %>
   <% end %>
   

5. Editing any file to conform with rails

   You can read this

   • Assets Pipeline
   • Layouts and Rendering in Rails
   • Form Helpers

6. Updating the asset pipeline

   The fix is pretty simple. Open your project's config file, located at config/application.rb and add the following line within your Application class:

   config.assets.paths << Rails.root.join("app", "assets", "fonts")
   config.assets.precompile += %w( .svg .eot .woff .ttf )
   

这篇关于Themeforest 到 Rails 应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！