|
|
Customizing The Client-Side Look and Feel
CSS and Layouts
Substruct doesn't ship with templates because customizing the look and feel is very simple.
You should never edit anything in the vendor/plugins/substruct directory
Here are the steps you should take if you wish to customize the look and feel of Substruct
- COPY the css files from /vendor/plugins/substruct/assets/stylesheets into public/stylesheets
- COPY layouts from /vendor/plugins/substruct/app/views/layouts into app/views/layouts
- MODIFY the copied layouts to include your new stylesheets copied in step 1.
- (Make sure to point the CSS include tags to your new files using stylesheet_link_tag, not the engine one!)
- Edit your CSS files all day, and enjoy life.
Views
Copy anything out of the vendor/plugins/substruct/app/views folder with the same name and folder structure (/content_nodes, /store, etc) into your app/views folder.
For instance, if you wished to modify the store index file, you would do the following...
cd my_rails_app mkdir -p app/views/store cp vendor/plugins/substruct/app/views/store/index.rhtml app/views/store
This template will be used instead of the default one Substruct uses.
Customizing Code
Controllers
If you wish to add your own methods to the controllers inside Substruct, or perhaps modify the code that exists there for a custom modification, follow a similar process to customizing views.
In this example, let's assume we'd like to add something to the StoreController
cd my_rails_app touch app/controllers/store_controller.rb
The contents of your new file would look something along these lines...
class StoreController < ApplicationController # Any methods defined here overwrite the ones in the engines controller file. end
Working in this way allows you to update the base Substruct code at any given time without disrupting custom modifications you've made.
Any new controllers should be placed in your app/controllers directory as well.
Models
Models are a little bit different, in that they require some tweaking to the copied file - but it's still a simple process.
Let's assume we'd like to add some new methods to the Order model.
cd my_rails_app touch app/models/order.rb
The contents of this new order.rb file would look something like this...
require_dependency RAILS_ROOT + "/vendor/plugins/substruct/app/models/order" class Order < ActiveRecord::Base # Define your methods here end
Notice the first line...Rails Engines doesn't automatically know how to deal with extending model files, so we must require the proper model that we're extending.
You will of course, need to modify this based on whatever model you are extending.
Any new models should be placed in your app/models directory as well.
Sign in to add a comment

Yeah still not getting how to attach the style sheets im sorry, i took out the plugin parts but i dont understand how to point to the new style sheets? ../public/stylesheets.. or something of that nature? and where do i put that? Thanks for the patience!
Grahamcss... make sure you modify the layout as well... that might be why your not seeing your custom css.
Hrm...maybe I need to make a rake task that copies layouts and prepares them for customization?
Got it figured out ! Now I just need to figure out how to make my "add to cart" do what the demos does. I love css http://lightupgarters.hopto.org
To override things in on Modules like vendor/plugins/substruct/app/controllers/order_helper.rb, you need to use the same style 'require_dependency" as when overriding models.
I don't even know where to begin
When you mean a single function you are referring to say the window that pops up when someone has added something to there cart? and models would be a new procedure in ruby that i make? Sorry if i am frustrating.
(Make sure to point the CSS include tags to your new files using stylesheet_link_tag, not the engine one!)
--this means go to your layouts that you just copied over and get rid of anything that says :plugin => substruct (just delete that part).
To customize images substruct uses, you'll either need to edit the ones that were auto copied to public/plugin_assets/substruct... or copy them from that directory to a new location in your public folder and have your .css files point to those new ones that you just copied somewhere else.
With regard to models, in reality you can just copy the model to your app/models directory and edit it there and it will replace the substruct one.
If, however, you want to ADD a single function to your controller or helper [i.e. extend it--not replace it], you must use the 'require_dependency' thing mentioned.
Hi, I'm having a pain in the ass trying to customize substruct. I copied over the files as instructed. I modify the layouts so that ": Substruct" is ": Mydomain" and ... nothing. still says "SomePage? : Substruct" everywhere. I also wanted to change the logo.gif by copying a new one to public\images, but no dice. I had to force overwrite BOTH original logo.gif's in the asset and vendor subdirectories. Many wasted hours later, my blood pressure is starting to rise.
Oh and replacing the logo gums up the alignment of the top navigation--it adds extra vertical spacing. Is this alignment information hard coded somewhere? Searching for logo.gif returns no matching test.
Charles, obviously you're doing something wrong. Did you properly copy the layout files over with the exact structure? Should be /app/views/layouts
The files have to have the exact same names, then you must replace the CODE in the new file to point to /images/logo.gif, instead of the one inside the engine. You're overlooking something very simple, because it's not as difficult as you're making it out to be.
note that you can get some leverage by just creating filters for existing controller actions:
http://api.rubyonrails.com/classes/ActionController/Filters/ClassMethods.htmlto charles: the word 'substruct' is a preference in the admin interface, and if you want the right gifs you'll need to go in to where they're referenced and take out the :plugin => substruct that's there.
I suppose a rake task that takes out all :plugin references might be useful :) Also it might be good to note in the 'views' section that you may want to take out some references within the view to :plugin
I probably should have updated my rant. I got the names to replace by modifying the existing layout in place and then restarting mongrel (a restart is required). I haven't tried copying the layouts then modifying them since I don't want to screw up what's already working :) Also, it should be known that changing the substruct name in admin does NOT change the title of pages--all that information is hard coded into the layout.
I was able to update the logo.gif by replacing the originals. However, I'm still getting that weird spacing/alignment issue with logo.gif. It sits on the left, but puts a huge space between the navbar and the search box.