Upgrade to Pro — share decks privately, control downloads, hide ads and more …

“Advanced” 
Templating with ExpressionEngine

“Advanced” 
Templating with ExpressionEngine

Learn how to use Stash and creating simple plugins to advance your ExpressionEngine Templates

98e7524451cd8ec1bf8f644d2c2f01c9?s=128

Trevor Davis

July 28, 2012
Tweet

Transcript

  1. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. “ADVANCED” TEMPLATING by Trevor Davis at DCEERS on July , 
  2. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. @trevor_davis HI! I’M I work as a Front-End Developer at Viget. TREVOR DAVIS
  3. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. I. Stash II. Creating Simple Plugins WHAT WE WILL COVER
  4.   STASH

  5. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. ‎ Set text and snippets of code ‎ Get them later on ‎ Include a layout ‎ Fill in the gaps STASH
  6. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. _layouts/base
  7. <!DOCTYPE html> <head> <title> {if {exp:stash:not_empty name="title"}} {exp:stash:get name="title"} |

    {/i } Site Name </title> </head> <body> {exp:stash:get name="content"} </body> </html>
  8. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. site/index
  9. {embed="_layouts/base"} {exp:stash:set_value name="title" value="Homepage"} {exp:stash:set name="content"} Here is my content

    {/exp:stash:set}
  10. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. RENDERED PAGE
  11. <!DOCTYPE html> <head> <title> Homepage | Site Name </title> </head>

    <body> Here is my content </body> </html>
  12. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. REAL EXAMPLE
  13. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. ‎ Includes data from an entry in profile channel ‎ Includes entries from blog channel authored by that person VIGET.COM PROFILE PAGES
  14. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. THE OLD WAY
  15. {embed="structure/header"} {exp:channel:entries channel="profile" require_entry="yes" limit="1" } <h1>{title}</h1> <h2>{profile_job_title}</h2> {profile_bio} {embed="about/_blog_posts"}

    ... {/exp:channel:entries} {embed="structure/footer"}
  16. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. THE NEW WAY
  17. {embed="_layouts/base"} {exp:stash:set parse_tags="yes"} {stash:blog_posts} {exp:channel:entries channel="blog" dynamic="no" username="{segment_3}" } <li><a

    href="/blog/{url_title}">{title}</a></li> {stash:num_posts}{absolute_results}{/stash:num_posts} {/exp:channel:entries} {/stash:blog_posts} {/exp:stash:set}
  18. {exp:channel:entries channel="profile" require_entry="yes" limit="1" } {exp:stash:set name="content"} <h1>{title}</h1> <h2>{profile_job_title}</h2> {profile_bio}

    {if {exp:stash:not_empty name="blog_posts"}} <h1>{exp:stash:get name="num_posts"}</b> Posts</h1> <ul> {exp:stash:get name="blog_posts"} </ul> {/i } {/exp:stash:set} {/exp:channel:entries}
  19. arrestedstills.tumblr.com CREDITS HOW I FELT AFTER LEARNING HOW TO USE

    STASH
  20. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. SERIOUSLY, GIVE IT A TRY
  21.   CREATING SIMPLE PLUGINS

  22. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. ‎ Our rule: no PHP in templates ‎ Performance implications ‎ Just messy ‎ Solution: create a plugin CREATING SIMPLE PLUGINS
  23. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. SIMPLE EXAMPLE
  24. <?php echo urlencode('http://viget.com/blog/awesome- entry-title'); ?>

  25. {exp:vl_client:url_encode} http://viget.com/blog/awesome-entry-title {/exp:vl_client:url_encode}

  26. public function url_encode() { $tagdata = $this->EE->TMPL->tagdata; return urlencode(trim($tagdata)); }

  27. http%3A%2F%2Fviget.com%2Fblog%2Fawesome-entry-title

  28. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. A MORE COMPLEX EXAMPLE
  29. {exp:vl_client:entry_count channel_id="4"}

  30. public function entry_count() { $channel_id = $this->EE->TMPL->fetch_param('channel_id', NULL); if($channel_id) {

    $query = $this->EE->db->select('total_entries') ->from('channels') ->where('channel_id', $channel_id) ->get(); if ($query->num_rows() > 0) { $row = $query->row(); return $row->total_entries; } } }
  31. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. PKG.IO
  32. None
  33. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. ‎ Multiple methods ‎ Won’t necessarily need them on other projects ‎ viget.com: 18 methods ‎ carrworkplaces.com: 4 methods SITE SPECIFIC PLUGINS
  34. © Viget Labs, LLC • This presentation is CONFIDENTIAL and

    should not be shared without permission. Stash: devot-ee.com/add-ons/stash Pkg.io: pkg.io Sample Plugin: gist.github.com/3191839 web: trevordavis.net twitter: @trevor_davis Thanks! Let’s Connect Resources