Real World Craft Tips & Tricks

Transcript

1. by Trevor Davis at Craft Summit on June 17, 2014 © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. REAL WORLD
 CRAFT TIPS & TRICKS
2. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. @trevor_davis HI! I’M I work as a Senior Front End Developer at Viget. TREVOR DAVIS 2
3. www.orbcomm.com URL
4. trevordavis.net URL
5. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {siteUrl} 5
6. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # craft/config/general.php ! <?php return array( '*' => array( 'environmentVariables' => array( 'siteUrl' => 'http://' . $_SERVER['SERVER_NAME'] ) ) ); 6
7. Settings > General
8. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. SWITCH 8
9. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% if craft.request.segments[1] == 'category' %} {% set title = 'Category' %} {% elseif craft.request.segments[1] == 'tag' %} {% set title = 'Tag' %} {% else %} {% set title = 'Index' %} {% endif %} 9
10. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% switch craft.request.segments[1] %} {% case 'category' %} {% set title = 'Category' %} ! {% case 'tag' %} {% set title = 'Tag' %} ! {% default %} {% set title = 'Index' %} ! {% endswitch %} 10
11. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. CYCLE 11
12. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for entry in craft.entries({ section: 'news' }) %} <article class="news--{{ cycle(['odd', 'even'], loop.index0) }}"> <h2>{{ entry.title }}</h2> {{ entry.summary }} </article> {% endfor %} 12
13. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. DUMP 13
14. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {{ dump(entry) }} 14
16. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. ELSE FOR LOOPS 16
17. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for entry in craft.entries({ section: 'news' }) %}! <article>! <h2>{{ entry.title }}</h2>! {{ entry.summary }}! </article>! {% else %}! <p>Sorry, there is no news for this category.</p>! {% endfor %} 17
18. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. LIMIT: 1,
 STILL NEED TO LOOP 18
19. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set announcement = craft.entries({ section: 'announcement', limit: 1}) %} ! {% for entry in announcement %} {{ entry.title }} {% endfor %} 19
20. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set announcement = craft.entries({ section: 'announcement', limit: 1}).first() %} ! {{ announcement.title }} 20
21. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. NO LIMIT 21
22. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set retailers = craft.entries({ section : 'retailer', limit: 1000 }) %} 22
23. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set retailers = craft.entries({ section : 'retailer', limit: null }) %} 23
24. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. DEFAULT FILTER 24
25. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set currentFilter = craft.request.segments[2] | default('All') %} 25
26. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. ACCESS CUSTOM FIELD SETTINGS 26
27. Media Filters
28. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. <ul> {% for option in craft.fields.getFieldbyHandle('activity').settings.options %} <li><a href="#{{ option.value }}">{{ option.label }}</li> {% endfor %} </ul> 28
29. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. MATRIX 29
30. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for entry in craft.entries({ section: 'news', limit: 5 }) %} {% for block in entry.bodyBuilder.type('image') %} ... {% endfor %} {% endfor %} 30
31. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for entry in craft.entries({ section: 'news', limit: 5 }) %} {% for block in entry.bodyBuilder.type('video, image').limit(1) %} ... {% endfor %} {% endfor %} 31
32. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for milestones in entry.companyTimeline.order('date desc') %} ... {% endfor %} 32
33. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. LOOP ALL THE THINGS 33
34. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% for i in 1..5 %} <article> <h2><a href="#">Here is the title {{ i }}</a></h2> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes. </p> </article> {% endfor %} 34
35. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. <select name="subject" id="subject"> <option value="general_inquiries">General Inquiries</option> <option value="order_status">Order Status</option> <option value=“press_media">Press & Media Inquiries</option> <option value="other_contact">Other</option> </select> 35
36. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set subjects = { 'General Inquiries' : 'general_inquiries', 'Order Status' : 'order_status', ‘Press & Media Inquiries' : 'press_media', 'Other' : 'other_contact', } %} ! <select name="subject" id="subject"> {% for label, value in subjects %} <option value="{{ value }}">{{ label }}</option> {% endfor %} </select> 36
37. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. <ul> <li{% if craft.request.firstSegment == '' %} class="active"{% endif %}> <a href="/">Home</a> </li> ! <li{% if craft.request.firstSegment == 'about' %} class="active"{% endif %}> <a href="/about">About</a> </li> ! <li{% if craft.request.firstSegment == 'blog' %} class="active"{% endif %}> <a href="/blog">Blog</a> </li> ! <li{% if craft.request.firstSegment == 'contact' %} class="active"{% endif %}> <a href="/contact">Contact</a> </li> </ul> 37
38. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set nav = { 'Home' : '/', 'About' : '/about', 'Blog' : '/blog', 'Contact' : '/contact' } %} ! <ul> {% for label, url in nav %} <li{% if url == '/' ~ craft.request.firstSegment %} class="active"{% endif %}> <a href="{{ url }}">{{ label }}</a> </li> {% endfor %} </ul> 38
39. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. RELATEDTO 39
40. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set tag = craft.tags({ name: tag, set: 'news' }).first() %} {% set entries = craft.entries({ section: 'news', limit: 5, relatedTo: tag }) %} 40
41. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set allMedia = craft.entries({ section: 'media', limit: null }) %} {% set products = craft.entries({ section: 'product', relatedTo: allMedia }) %} 41
42. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. MERGE 42
43. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set default = { section: 'media', limit: 12 } %} {% set options = { limit: 5, order: 'title asc' } %} {% set result = default | merge(options) %} ! { section: 'media', limit: 5, order: 'title asc'} 43
44. Media Filters
45. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set filters = ['type', 'product', 'activity', 'element'] %} {% set params = { section: 'media', limit: 12 } %} ! {#% Apply filter? %#} {% if craft.request.segments[2] is defined and craft.request.segments[1] in filters %} {% switch craft.request.segments[1] %} {% case 'product' %} {% set product = craft.entries({ slug: craft.request.segments[2], section: 'product' }).first() %} {% set params = params | merge({ relatedTo: product }) %} ! {% case 'type' %} {% set params = params | merge({ type: craft.request.segments[2] }) %} ! ... {% endswitch %} {% endif %} ! {% set entries = craft.entries(params) %} 45
46. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. CHANNEL VS. STRUCTURE 46
47. Media Section Settings
48. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set params = { section: 'media', limit: 12, order: 'lft desc' } %} ! {% set entries = craft.entries(params) %} 48
49. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. VARIABLES & INCLUDES 49
50. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set heading = 'Here is my heading' %} {% include 'shared/_sidebar' %} 50
51. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% include 'shared/_sidebar' with { 'heading' : 'Here is my heading' } %} 51
52. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% set otherVar = 'Oh hai' %} {% include 'shared/_sidebar' with { 'heading' : 'Here is my heading' } only %} 52
53. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% if entry.listingSection %} {% include '_shared/listing_' ~ entry.listingSection ignore missing %} {% endif %} 53
54. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. PARENT 54
55. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # _layout.html ! <!DOCTYPE html> <html> <head> <title></title> </head> <body> <div class="content"> {% block content %}{% endblock %} </div> ! <div class="sidebar"> {% block sidebar %} <ul class="nav"> <li><a href="/about">About</a></li> <li><a href="/blog">Blog</a></li> <li><a href="/contact">Contact</a></li> </ul> {% endblock %} </div> </body> </html> 55
56. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # page.html ! {% extends '_layout' %} ! {% block content %} Here is the content {% endblock %} ! {% block sidebar %} {{ parent() }} ! Here is some additional sidebar content {% endblock %} 56
57. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. LOOP GROUPING 57
58. companyTimeline field
59. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% if entry.companyTimeline | length %} <ol class="timeline__years" reversed> {% for year, milestones in entry.companyTimeline.order('date desc') | group('date.year') %} <li> <h1 class="timeline__year__title">{{ year }}</h1> <ol class="timeline__milestones" reversed> {% for milestone in milestones %} <li class="timeline__milestone"> <h2 class="timeline__milestone__title">{{ milestone.milestoneTitle }}</h2> <p>{{ milestone.description }}</p> </li> {% endfor %} </ol> </li> {% endfor %} </ol> {% endif %} 59
60. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. UPDATING IN MULTIPLE ENVIRONMENTS 60
61. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. ‎ Auto-update locally ‎ Commit and deploy the files ‎ Visit the CP on additional environments ‎ DB update process will run UPDATING IN MULTIPLE ENVIRONMENTS 61
62. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # craft/config/general.php ! <?php return array( '*' => array( 'allowAutoUpdates' => false ), ! '.dev' => array( 'allowAutoUpdates' => true, 'devMode' => true, ) ); 62
63. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. CACHING IN MULTIPLE ENVIRONMENTS 63
64. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # craft/config/general.php ! ! <?php return array( ... ! '.dev' => array( 'devMode' => true ) ); 64
65. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # _layout.html ! {%- cache unless craft.config.devMode -%} <!DOCTYPE html> <html> <head> <title></title> </head> <body> ... </body> </html> {%- endcache -%} 65
66. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. MACROS 66
67. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # _helpers/index.html ! {%- macro map_link(address) -%} http://maps.google.com/?q={{ address | url_encode }} {%- endmacro -%} 67
68. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% import "_helpers" as helpers %} ! <a href="{{ helpers.map_link('400 S. Maple Avenue, Falls Church, VA 22046') }}">Map</a> 68
69. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. <a href="http://maps.google.com/?q=400+S.+Maple+Avenue%2C +Falls+Church%2C+VA+22046">Map</a> 69
70. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # _helpers/index.html ! {%- macro input(options) -%} <input type="{{ options.type | default('text') }}" name="{{ options.name }}" class="{{ options.class | default('input') }}"> {%- endmacro -%} 70
71. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. # _helpers/index.html ! {%- macro input(options) -%} {% set defaults = { type: 'text', class: 'input' } %} {% set options = defaults | merge(options) %} ! <input type="{{ options.type }}" name="{{ options.name }}" class="{{ options.class }}"> {%- endmacro -%} 71
72. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. {% import "_helpers" as helpers %} ! {{ helpers.input({ name: 'somefield' }) }} 72
73. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. <input type="text" name="somefield" class="input"> 73
74. © Viget Labs, LLC • This presentation is CONFIDENTIAL and should not be shared without permission. web: viget.com web: trevordavis.net twitter: @trevor_davis Thanks! 74