Jump to content


Photo
- - - - -

Carousels on Dynamic Category Pages


  • Please log in to reply
6 replies to this topic

#1 zcademy

zcademy

    Member

  • Members
  • 18 posts
  • LocationNortheast North America, Earth

Posted 24 July 2012 - 09:38 PM

I tried looking for something like this, but there's nothing exactly the same. I'm building a product showcase site for a client. The products will be organized in categories: Kitchen, Office, Bedroom, etc. We'll use the dynamically generated Category pages to let shoppers find their way around. My client wants a carousel on each Category page, featuring images of the products in that category only: the Kitchen Category Page will show Kitchen items, Office will show Office items, etc. I can't figure out if there's a way I can set the Category Page template's Carousel to pull images from the current category only, which is what I want. In another thread, I saw someone mention creating a static Category page ... my client will be adding products all the time, so I don't know if this would work. [I'm fairly new at WP, so I don't know if a static category page would be limited to existing posts or not.] I *think* the number of categories won't change, but it might. As usual with my questions, I'm open to any way of solving the big problem, not just a specific answer. In this case, I need a page that will show an ever-growing list of posts in a Category, PLUS a carousel of feature images in that category. Thanks Liz

#2 Stefan

Stefan

    Business Manager

  • Administrators
  • 156 posts
  • LocationTransylvania
  • Framework Version:trunk
  • Country: Country Flag

Posted 25 July 2012 - 07:34 AM

Hey Liz, If you're using the Carousel core section, it has a custom post category source that can be activated from the meta settings as shown here:

Please Login or Register to see this Hidden Content

Does this solve your issue?

#3 zcademy

zcademy

    Member

  • Members
  • 18 posts
  • LocationNortheast North America, Earth

Posted 25 July 2012 - 12:41 PM

Stefan -- I am using that setting ... which works very well on a static page. The issue is that the Category pages are dynamically generated. Using me example above, I have one category page for Kitchen, one for Office ... and if I add a new category, Bathroom, a new page will be created listing the Bathroom posts. I need the carousel (which I added on the "drag & drop" template) to show Kitchen images when the Kitchen category page is generated, Office images when the Office page is generated ... I can't use the meta setting on the category template because I'll get only one category's images on all the generated pages.

#4 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 25 July 2012 - 02:27 PM

Ah, I understand what you mean. Carousel doesn't have a setting for establishing a specific set of images that show on a category page. This is an in-depth customization that is better suited for a Pro who can help out: pagelines.com/pros

#5 zcademy

zcademy

    Member

  • Members
  • 18 posts
  • LocationNortheast North America, Earth

Posted 25 July 2012 - 07:00 PM

Aww, nuts! I was hoping this was something I could control myself. I've Accepted the answer, reluctantly.

#6 corpuscamera

corpuscamera

    Newbie

  • Members

  • 9 posts
  • LocationTexas
  • Framework Version:The Latest
  • Country: Country Flag

Posted 13 February 2013 - 04:10 PM

Zcademy - Hi there, I stumbled upon your question while searching for an answer for this myself. I am assuming you found an answer from another source but, if not, and if anyone else comes looking for the same answer, I thought I would share the solution I found to it. I have received much free advice via forums over the years, and am glad to give back a bit on my own. 

 

To make the carousel section dynamically display only the posts related to the current category page i.e. in your example above, only showing Kitchen posts for the kitchen category page, etc... you can accomplish this using a few lines of code that rely on a global Wordpress function, and changing out the variable that the carousel post id is tied to. 

 

1. First, make a copy of your section and re-name it something like Carousel Mod and load it into your Pagelines store as a different section. This is important, because we are about to change the functionality of this section, and it won't do the same things it did before, so to use the traditional Carousel section you'll need to preserve it and make this one a new section. 

 

2. Go to the folder for your copied section, open the 'section.php' file for the Carousel section you are about to mod, use Notepad ++, Textwrangler, Dreamweaver, or whatever you use to modify code. 

 

3. Go down to line 168, it should say: 

 

Please Login or Register to see this Hidden Content

That bracket on the far right is where you want to stay within for the first insertion of code here. Start after that bracket and insert the following: 

 

 

 

Please Login or Register to see this Hidden Content

So what this is doing is basically using a global Wordpress function to call the current category of your page and then give you the slug for it (which is important for the next step) which is then tied to the variable we made called '$slugcat' above. If you want to read more about WP functions,

Please Login or Register to see this Hidden Content

 on the WP codex, it is helpful background info.

  

 

4. Next, go to line 174 in the variables section. You are looking for: '$carousel_post_id' Once You find it, do the following: 

 

        a.    You will take the section of code below found on line 174:

 

Please Login or Register to see this Hidden Content

       b. And then either delete or, in case you want to backtrack on all of this later, insert a double forward slash like so to silence a part of the code we don't want for our purposes occurring after the '$carousel_post_id = ': 

 

 

 

Please Login or Register to see this Hidden Content

       c. And finally, insert our newly made variable '$slugcat' in its place like so, making sure you put a semicolon after it or your code won't work:

 

 

 

Please Login or Register to see this Hidden Content

5. Save it all, then load this modified section into your framework and put it on the category template to test it out. This is basically going to bypass the meta options on the section panel for selecting a fixed post category, and change that static variable dynamically based on whatever category page the section is appearing on. You will not be able to use the Posts Mode from the meta panel with this mod, you can delete that from the panel if you need to, but either way it won't have an effect on what posts are showing. 

 

6. This is what has worked for me, there are other and better ways to do it and retain full functionality if you have the time for more coding, I did not and, like you, needed this one added function for a certain project, and got it this way, it is working fine on my current project. Hope this helps you or someone else searching for this in some way. If anyone has a better way to do it, please post it to help the rest of us! 


  • blue522 likes this

#7 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 13 February 2013 - 05:13 PM

@corpuscamera Thank you for posting this.

@zcademy Please try corpuscamera's solution above and let us know if it worked for you.