Panels Ajax Tabs

This module is so cool. Ajax is an awesome way to display/update/refresh content without actual page refreshes. And this module gives you a very easy way to integrate Panels and Ajax

Panel Ajax Tabs – https://drupal.org/node/1796032

I’m really surprised that there aren’t more installs of this awesome module. Anyway, using this, I am able to integrate tabbed Panel Panes (which for me are different Views) using minipanels into an Ajax enabled Pane, of sorts.

This allows me to display several different Views on one screen without having to do page refreshes.

Advertisements

Use two URLs to choose a different version of one variant

Hey hey. I haven’t posted in a while. I have been really busy doing some of the Codecademy stuff. And I have been learning a lot about Rules and some of the more granular ways to choose content on my site.

That brings me to today’s topic. I have One content type called research. I need to be able to use this content type on more than one node add/edit form for that one content type. So, I have one variant on the Node Add/Edit page in Page Manager. I thought that it might best to setup two variants at first then use some selection rules to choose based on the URL. Image

I looked at a few different ways to do this and the one that I have settled on is this. I have  one variant. I need to have one Panel on the page that is different from the other. So, I use a visibility rule for one panel and a different one for the other. Then, I placed both of those Panels on the page. Since it is a Node ADD/Edit variant, I have to work in the URL, node/add/research. so the rule for one panel is node/add/research/news and the other is node/add/research/courts. I created a menu that reflects these URLs and now I can get to the correct version of the one variant from URL selection rules on two different panel panes.

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

Image

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:

context for add edit form0

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

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

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.

context for add edit form3

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

Editing a Minipanel

This is sort of a weird one. If you create a Minipanel and want to go back and add/remove items in said MP later, you have to go someplace a little unintuitive. see the SS below. you go to the Minipanels listing, click edit but then you have to click on the Content breadcrumb to get to the MP itself. Not sure why…..

Image

Minipanels, Panels and the flexible, Responsive, layout that I have wanted

Well, I don’t really know why I didn’t make this work better quite a while ago. If you need flexibility in your page layouts and you use a lot of Views, then I believe that this is the way to go. Use Panels for the overall layout and then plug in smaller bits of content within the Panel locations using Minipanels. I tried using them before and I think that I simply made a couple of mistakes in implementing them. But now that I know a little more than I did before, I have used them successfully and their implementation is going to be a real Godsend to me.

learn drupal - minipanels

 

Here is a little image of what you can do. The layout here is a standard AT_Core layout that I have subthemed. I used Minipanels to add the smaller black boxes in the layout. Now I can have two elements at the very top of the page without having to use so much CSS that I run into other problems later, especially when I view the site on a mobile device. And the page is all Panels so there is a lot of consistency. The only issue is that I have to edit the Minipanel separately from the rest of the panel page.

 

Gpanels and a more flexible layout

I have been bumping up against some of the limitations that Drupal imposes on layouts. There are ways around just about any limitation Drupal may have, the trick is to find and use the right one. So, I flirted with the idea of using Blocks and Panels together. But, as seen in the earlier post, I have nixed that. CSS can provide many placement options but I believe that really big changes need to happen at the level of the theme, in the code. So, I started looking at AT’s Gpanels. These are code blocks that can be inserted into the page.tpl.php file that will give more layout options. I think this is going to be the way to go. This solution supports responsive design as well.

  • Need to use Panels
  • Need Responsiveness built in
  • Need more layout options
  • Don’t want to use Blocks at all
  • Need to use Views

OK, So I can’t use GPanels because it is Blocks. Dropping this. Going to try Panels Everywhere again. I failed at that once but I’m going to give it another shot. I know more now so I bet that the issues that I was having will be overcome.