Neat Tricks with Content Types


Published on

Krystee Dryer's Neat Tricks with Conent Types presentation from the 2012 Drupal Capital Camp in Washington DC

We all know about content types and how to use them, but it is amazing how a different look at content types can transform your site and add many more possibilities.

In this session, you will learn fun tricks and tips to use content types to their full capacity. Here are some of the ideas that will be discussed:

• What making your home page its own content type can do for you
• How archiving, workflow, and revisioning can be done with whole pages (not just some elements on a page)
• How you can use one field to select elements like events or callouts to appear to quickly modify your pages
• How you can work with multiple dates on nodes and use them in a logical way (views sorting, displaying)
• What you can do with fields in the Display Suite module – even with fields not in your content types
• What you can do with to case studies to showcase your projects
• How you can add styling options to your slideshows to empower your clients/site admins to add new slides with custom text overlays and pagers.

Published in: Technology
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • My name is Krystee Dryer and I am the web development director at Balance Interactive. I have been involved in Drupal Development for over 5 years and over this time our development team has definitely learned and evolved and really embraced the power of using content types in some fun and interesting ways.
  • Krystee – Read slide.The reason that I have this slide up here is to build a framework around this presentation. We are very focused on content and the overall content process. Everything we do on the development and design side is put in place to support our content effort so when we plan out our content types, we are thinking about how this will affect the client’s content strategy and how will the site admin and editors will maintain everything. It is this mindset that really pointed us to look at our available tools differently.
  • So a couple of years ago we started noticing that a lot of our projects needed specialized pages that are both highly structured and styled, and the client had business practices that required archiving and workflow for the whole page - not just elements on the page.Talk about image on slide.
  • Our normal way we had been structuring our content types was to create a different content types for each definable piece of content – such as Callouts, Slideshow, and Images and put them into blocks and views and then use Context or Blocks admin to put them on the page. For a slideshow we might use a nodequeue to allow us to choose the Slideshow content and order as we like. This gave us a nice page, but didn’t answer the clients needs.That definitely had its advantages – it was easy to define and everything had its place. However, this method doesn’t allow you to put a page (such as the home page) through an approval process or archiving. You would only be able to send the basic page content through these processes, not the slideshows or callouts.
  • So we took another approach and defined very specialized content types. We put all elements of the content type as fields. This nicely simplified some of the other content types since we didn’t have to take a one content type to fit all needs approach. The interior page could be very simple. The Home Page or Landing Pages could be very complicated.
  • Slideshow images became fields (instead of their own content types) and we used the drag and drop functionality to order the images. We also used nodereference in the content type to pull into other types of content such as videos if it made sense to keep it separate. Now that we had this specialized type for say homepage, we could send the whole homepage through access, workflow and moderation. Once approved, it would simply replace the old home page. Another benefit was the client could also look back and see their home page from a year ago since we used revisioning to save old versions. It gave the client what they needed and made it easy for them to maintain.
  • Read problem.This is easily accomplished by making some blocks – some with views and some with just regular content and then allowing the client to go to the blocks admin or context admin and remove one block and then add another, but we open up the risky issue of the client really messing this up – choosing the wrong block, deleting the block altogether (this has actually happened to one of our clients).
  • So we stepped back and choose a different approach to make this so easy for our clients. Read the Solution.The Views Reference module gives you a field and lets you designate a relationship to a view.It gives the content editor a drop box right in the content type and let them select what they need to appear. This takes a little more effort development wise, but it makes is so easy for the client to change around their pages in minutes.
  • Read the problem.We needed to keep these different types of articles in one content type since that is how their editors were used to working. However, they wanted different things to happen depending on what type the article was designated. You can see in the Press Release, the posted date is placed here in normal text styling. If the article is any other type, it is placed at the bottom and is smaller and italicized.
  • Ask who has not heard or used the Display Suite Module (if a lot of hands describe what the module is).Display Suite is an amazing module that allow a site admin to choose different layouts and add special elements to a content type. We use this with every project because of extensive functionality. This basically has replaced panels in our projects in most cases.Display Suite isn’t just about layouts, it also exposed different node elements and allows you to move them around (just as posted dates, comment forms, and other items). You can also add fields and manipulate them and apply styling and classes.
  • In the case about the Posted/Revised dates, we added a Code Field and used PHP code to handle the testing if this article was type Press Release. If so, we used the tokens that Displays Suites provides us to print the Posted Date. If not, it prints nothing. We did the same thing for the Revised Date. If the Article was anything but Press Release, we printed the Revised date. We then just place these fields where they should go in the display settings and it worked great.
  • Read Problem.Many items like reports, documents, articles, and so on need more than just one date. Drupal comes with posted date and changed dates, but our clients wanted more control and more ways to dating a document. In this example, I am showing a created date, updated date, and revised date.
  • Read Solution.
  • Talk about example
  • Read Problem.In this case, this client was ourselves. We like our case studies and wanted nice ways of presenting them. In slideshows, sidebars, lists, and the full detail pages.
  • Read Solution.This approach made it easy to keep all of the related case study information together in one place and then it would be easy to use in different parts of the site. In the node detail page, we formatted all of these images in a rollover slideshow to showcase different pages on the site in a nice way. In other parts of the site, we had a featured side bar element or a rotating slideshow. Everything was kept in one place and made it easy for us to maintain.
  • As you can see from my examples so far, our clients love their photo slideshows and styled image elements. We wanted to build this to make it so easy to create these elements. The users that are entering this content on the site are not necessary graphic savvy so we needed to build all of this in. As you can see in this example, we created a background image with a text overlay. This is not hard to do, but we needed to account for different colors of the images – light colors and dark colors and the text that would be overlayed.
  • Read Solution.We added a field that the client used to choose the color of the text. We then just added that field to a view, excluded it from display and use the rewrite output function to add a div with a class of that field. Then the css took over changing the color of the text.
  • Neat Tricks with Content Types

    1. 1. Neat Tricks withContent TypesJuly 27, 2012Krystee Dryer@krysgeekCapital Camp
    2. 2. Why So Much Attention on Content Types? Our team at Balance Interactive has really focused on content and the content process. Every decision on the development and design side is put in place to support our content effort. Balance Interactive Inc.
    3. 3. Specialized Content TypesProblem: More and more of ourprojects have a big need forspecialized structured pages thatare easy to maintain and haverevisioning, archiving andworkflow processes attached tothem. Balance Interactive Inc.
    4. 4. Specialized Content TypesNormal Drupal Solution: Create special content typessuch as Slideshow and Callouts and use with normal Pagecontent type. Special items like slideshows can be selectedand ordered by nodequeues.Advantages:• Easy to define content type• Reduce your number of content types to manageDisadvantages:• Old data cannot be preserved• Page content go through moderation, revisioning and workflow, but other elements cannot Balance Interactive Inc.
    5. 5. Specialized Content TypesBetter Drupal Solution: Create a content type for thatspecial type of page, such as home page or top level page,and have all elements of the page as fields.Advantages:• Eliminate unnecessary fields from normal interior pages• Revisions and archives of content can be saved• Whole pages (with all elements) can go through required moderation and workflow processesDisadvantages:• Adds to your list of content types Balance Interactive Inc.
    6. 6. Specialized Content TypesCreate separate content types for each type of page and include allelements as fields (text, files, node references, etc). Order of elements displayed can be handled in a drag and drop fashion. Revisioning is handled through normal node revisioning. Balance Interactive Inc.
    7. 7. Selectable Views / CalloutsProblem: The client wants a flexible space on the home pageor other landing page to show event views, twitter feed,callouts or other items depending on what is going on at thetime in the company. Balance Interactive Inc.
    8. 8. Selectable Views / CalloutsSolution: Create all of your selectable options as views anduse View Reference Module to create a dropdown box. Balance Interactive Inc.
    9. 9. Dynamic DisplaysProblem: The client had a content type called “Articles” andwanted Posted Date to display above the body for Articles oftype Press Release, but wanted the Node Revised Date (withspecial styling) to display below the body for any other Articletypes. Balance Interactive Inc.
    10. 10. Dynamic DisplaysSolution: Created a Content Type for an Article and had aselectable field to denote type (Press Release, News,Document, etc). Then used the Display Suite module to add adynamic field with PHP code to make the correct date toappear on type of Article. Balance Interactive Inc.
    11. 11. Dynamic DisplaysAdd a fieldthat allows youto use tokenswith PHPconditionals. Balance Interactive Inc.
    12. 12. DatesProblem: Multiple dates need to be attached one document. Balance Interactive Inc.
    13. 13. DatesSolution: Have fields for each date type and use the ComputedField module to make all of the inputted dates into one date thatcan be used for display and sorting.• Use client’s business logic to determine what date takes precedence• Translate this logic into PHP conditionals• Recalculate date every time item is revised• Use the calculated date in the template and views with appropriate label Balance Interactive Inc.
    14. 14. DatesExampleusingComputedField Balance Interactive Inc.
    15. 15. Case Studies / PortfoliosProblem: Clienthas lots of casestudies/portfolioswith images thatneed to appear invarious ways onthe site – in detail,in a rotatingslideshow,callouts in sidebarsand more. Balance Interactive Inc.
    16. 16. Case Studies / Portfolios Solution: Create a content type called Casestudy and store all elements in the one content type – different size images, all content Balance Interactive Inc.
    17. 17. Styling OptionsProblem: The client needs automatic styling on slide show textor callouts to account for image differences. Balance Interactive Inc.
    18. 18. Styling OptionsSolution: Create a field with radio buttons to list styling optionsand use that to output as necessary. Use this field to add the selected color into the class of the slideshow view and let the stylesheet define the styling associated with each selection. Balance Interactive Inc.
    19. 19. QUESTIONS?Contact us:krystee.dryer@balanceinteractive.comFollow: @krysgeekDrupal username: krysgeekMore Info:Balance Blog: Interactive Inc.