More on Variants for the node add/edit forms

So I have Forums, Blogs and Galleries. And I want to style each one differently. So my first thought is to put the form inside of a Panel Page so that I can add other content. And that is the right direction, but it isn’t enough.

The Node Add/Edit form is already in the Page Manager as a Panel Page. It is disabled by default. By enabling it, I will have the ability to customize the form’s display. I already explained the part about the contexts

method of determining what node type will be affected by the change. But here is something to keep in mind.

If you enable the page, and then create a variant for a content type to be used (when you add a node to that content type for example) you will find that the add form for ALL content types looks like the variant you created for example, for the Blog entry content type.

You will need to create a variant for each of the content types individually or they will all inherit the one variant’s customizations. and what I had to do to make THAT work properly was to use a selection rule for the variants that come at the beginning of the list. Since variant order determines in a large part, what is applied, you have to create selectors so that the “filtering” process works properly.

This is one of Drupal’s great strengths, but it is also kinda strange to me and took a while for me to get my head around. Look at the SS. Each of the three content types has a variant. and a context that applies to it. But, without a Selection Rule that also applies to it, the variant will simply inherit its appearance from a rule above it, the first one that happens to apply. There are other ways to do these same things with selection rules

Put the “Add Content” form into a Panel Page

I had this idea in the back of my mind for a while. Really, it was the idea that there was something that I was going to run up against. And I have and I figured out what to do about it too. The problem:

How do I put the add/edit forms into my panels pages so that they have the consistent look and feel as the rest of the site. And so that they have access to my nice Superfish menu that I have at the top of the page for all my navigation. And the answer is in the Variant of the Page via its Content type Context. Clear as mud, right?

Think about this first: don’t look at the editing process where the content comes first then the editor for that content. It’s the other way around. The Add/Edit form comes first, THEN the Context determines what Content is edited. To me, this seems a little backwards. But I am just an infrastructure guy historically. But the Add/Edit functionality is independent of the content type in a way. So you invoke the add/edit first, then tell it what it needs to edit as far as a content type goes.

Go to Pages and enable the Page for the Node Add/Edit System Page:

Create a Variant. See SS 2. Make sue to check the Context check box

Add the Context that you want. In the SS 3 you see that I have chosen Forum as the Content Type.

When you create a variant for the Forum Content Type in reagrds to the the Add/Edit form, you can place it in the nice Panel editor that we know and love. The trick seems to be, that you have to choose the General Form as seen here.

Once you add this, the rest will fall into place. I’ll add more to this later.

Add an easy to manage Footer

My site is coming along nicely but I needed a simple, but appealing footer section. I use Panels and have gotten pretty good with CSS so I put this together as shown:

Here is a summary of what I did to make this.

• I created a panel style for the footer element called footer1.
• I edited the css for footer1 in my custom css file in my subtheme and added a background image, a little 1k blue gradient sliver, that is repeated via css to cover the entire bottom of the page.
• I made sure to check the “make this style available to other..” as seen here. The name that you give the region/pane will then be easily assigned to other panel elements in the in-place editor
• Create a custom menu with whatever you want. Add that menu to a Superfish block. The superfish menu block doesn’t have to be handled by the Block Admin at all; it will be available via the in-place editor in Panels under Misc. as seen here.
• So once I have configured the Superfish settings for the Block the way I want (without enabling the block in Blocks Manager at all) it will be ready to go. In this case, I have used CSS for the superfish menu I created to center the menu, make the text color white. That is tested in Firebug and Inspector (the chrome tool) and then added to my custom css file.
• Since the background image and the menu are separate entities and handled by different css classes, they can sit on top of each well well.
• Now, On any Panel page that I have, any at all, all I have to do to add this footer is add the fotter1 style to the region in Panels Pages, and add the Superfish Menu from Misc as a piece of content, also in the Panel in-place editor.

This is a little complicated to get set up. But I now have a lot of flexibility on the footer. It is easy to maintain (the menu items are just menu links in the standard m

enu config) the footer image takes a few clicks to insert. and if I wanted to update the image itself, all i would have to do is place a new “sliver” image with the same name in the same folder where it currently resides. Quite nice once it si in place. If you want more detail, let me know and I’ll be more specific.

• 

Gallery Formatter Module

I have been struggling for days to get an image gallery solution that will work for me and I think that I am just about there. Gallery Formatter is the latest piece of the puzzle. This post is a WIP, so here are a few bare bones details:

http://drupal.org/project/galleryformatter – module

http://drupal.org/node/1086962 – documentation

http://drupal.org/node/1271064 – readme

Overview for my approach

• Custom Content Type for images – one for members of my site one for admins
• Gallery Formatter – for the format at the Content Type level
• ME Alias module for replacement patterns, like Token, uses Token, I believe
• Views/Panels (of course)
• Multiupload – module
• Colorbox – module
• Field Formatter Class mod – Module – Helps define CSS classes at the content level

That’s it for now. I hope to put this to bed today if I can.

Define Custom Content Type CSS classes

This is a really cool module. And surprisingly, it doesn’t seem to have gotten a lot of attention. But the Field Formatter Class Module is really pretty simple and straightforward. And with Drupal, I really like the KISS rule…

This module allows you to define a CSS class on a per field basis. You do this in the Display Settings for the field of the content type taht you are working with. So,

• I create a Content type called admin galleries for image galleries taht I, an admin, create.
• On the image field, I assign the class admin-gallery. this option is available because of the module
• now, i can add CSS as seen below to that specific class and only that content type will be affected. so I can style any
• gallery this way as long as I use that content type for the gallery. which makes sense anyway. 
• I can also create a content type for user-galleries and style all those in a consistent way. and that is the real point that i wanted to acheive anyway.

 

 

 

Very cool module. And this post is where I heard about it. It has some other useful ideas on this subject too.

http://drupal.stackexchange.com/questions/30561/add-a-css-class-to-field-in-content-type

 

 

CSS – Quicker with CSS injector

Here is a module that will allow you to make CSS tweaks without all the subtheming that I usually bring up.

http://drupal.org/project/css_injector

I heard about this module from FRJO (drupal handle), the main guy behind the colorbox module. I haven’t used it yet myself but FRJO is really good at Drupal and he uses it. Worth a look. 

Image Galleries in Drupal using Views

I have been back and forth with different options on how to approach building an image gallery in Drupal. And I am getting closer to really seeing what will work well and what won’t.

I use Views. For many things. Views and Panels are the backbone of my site. So I really want to use Views for my Galleries. I found this great tutorial from James Tombs on how to create galleries that will be displayed via colorbox from a custom content type AND, how to use Views to build some really cool flexibility into the galleries. Basically, his tutorial will show you how to create three (or more) galleries, then have the first image in each gallery serve as a link to the rest of the gallery from a View. So the View will give you a nice way to show a top level grouping of galleries based on content type and an image specific to that gallery.

Check this out. Follow it step by step. I learned some cool tricks about Views that I never would have figured out on my own.

http://jamestombs.co.uk/2011-05-26/create-album-based-image-gallery-drupal-7-using-fields-and-views

Colorbox and Galleries

I hate to have to go back to this. I really do. But I have tried all sorts of different ways to approach images galleries and I believe that Colorbox is the best way to go. And I have tried other ways. Lord, have I! All the modules have good points and bad points and all of them are well put together but I believe that this is the best.

I found this three part series on Colorbox on Vimeo from FRJO, (Drupal Handle) the guy who wrote Colorbox. This is a good series and he does a fine job explaining the rather cryptic subject of creating image galleries in Drupal. Check it out at:

http://vimeo.com/19122850

Also, make sure to check out part II of the series, which explains how to integrate the Insert module with Colorbox…

http://vimeo.com/19386122

Error from Link Module – line 1305 link.module

I have been getting this error when I save fields to a content type that I have created. Here is the error.

Notice: Undefined index: title_value in link_field_update_instance() (line 1305 of /var/www/foo/public/sites/all/modules/link/link.module) – note the path may not be the same for you.

Here is the issue summary:

http://drupal.org/node/1914286

There is a patch listed here. very easy to install manually. and fixed the issue.

Upload multiple files to multiple entities (nodes, tax. etc)

This is something that I am surprised that more people don’t seem to use.

I have modules like IMCE and Plupload to help me upload multiple files simultaneously. There is always a need for that. But I have had some trouble getting the multiple file aspect of the upload to work so I also downloaded the Multiupload Module. This is a really simple module that enables a widget in the image file or image field type of a content type. clear as mud, huh? 😉 look at the ss to see what I mean. This is the content type called Bulk Media Files that I created for this operation. And the widget that I am using is the Multiupload widget. This will allow me to upload multiple files to that content type at the same time. But, what I wind up with is one node with a bunch of images in it. I  need a way to upload multiple images to individual nodes at one time. And I found a great module called Bulk Media Upload.

 

 

 

 

 

 

 

 

 

All you have to do after you install the mod is to configure where you want the files to go. You have some good options too.  You can set it to Node, Tax. Term, OG group and more. Then you can choose where to put it within that Entity. A finally, you can choose the field to place the file in. It must be an image or file field or you will get an error. So here, I have the Node, then the Bulk Media Files (a custom content type that i created for this. And then Image, which is a field in the content type that I added.

 

 

 

 

 

 

 

 

 

 

 

 

Go to Content, Bulk Media Upload and you will get this screen. This is the main area, where you can choose replacement patterns for the about-to-be-created nodes. Choose your files, upload and….

 

 

 

 

 

 

 

 

 

You will see a summary of all the newly created nodes, each based off of an individual file. Quite helpful for me. The replacement patterns will be helpful in giving you flexibility in Views when presenting your images.