[{"data":1,"prerenderedAt":433},["ShallowReactive",2],{"footer-primary":3,"footer-secondary":93,"footer-description":119,"short-hops-global-bookmarks":121,"short-hops-global-bookmarks-next":165,"sales-reps":181},{"items":4},[5,29,49,69],{"id":6,"title":7,"url":8,"page":8,"children":9},"522e608a-77b0-4333-820d-d4f44be2ade1","Solutions",null,[10,15,20,25],{"id":11,"title":12,"url":8,"page":13},"fcafe85a-a798-4710-9e7a-776fe413aae5","Headless CMS",{"permalink":14},"/solutions/headless-cms",{"id":16,"title":17,"url":8,"page":18},"79972923-93cf-4777-9e32-5c9b0315fc10","Backend-as-a-Service",{"permalink":19},"/solutions/backend-as-a-service",{"id":21,"title":22,"url":8,"page":23},"0fa8d0c1-7b64-4f6f-939d-d7fdb99fc407","Product Information",{"permalink":24},"/solutions/product-information-management",{"id":26,"title":27,"url":28,"page":8},"63946d54-6052-4780-8ff4-91f5a9931dcc","100+ Things to Build","https://directus.io/blog/100-tools-apps-and-platforms-you-can-build-with-directus",{"id":30,"title":31,"url":8,"page":8,"children":32},"8ab4f9b1-f3e2-44d6-919b-011d91fe072f","Resources",[33,37,41,45],{"id":34,"title":35,"url":36,"page":8},"f951fb84-8777-4b84-9e91-996fe9d25483","Documentation","https://docs.directus.io",{"id":38,"title":39,"url":40,"page":8},"366febc7-a538-4c08-a326-e6204957f1e3","Guides","https://docs.directus.io/guides/",{"id":42,"title":43,"url":44,"page":8},"aeb9128e-1c5f-417f-863c-2449416433cd","Community","https://directus.chat",{"id":46,"title":47,"url":48,"page":8},"da1c2ed8-0a77-49b0-a903-49c56cb07de5","Release Notes","https://github.com/directus/directus/releases",{"id":50,"title":51,"url":8,"page":8,"children":52},"d61fae8c-7502-494a-822f-19ecff3d0256","Support",[53,57,61,65],{"id":54,"title":55,"url":56,"page":8},"8c43c781-7ebd-475f-a931-747e293c0a88","Issue Tracker","https://github.com/directus/directus/issues",{"id":58,"title":59,"url":60,"page":8},"d77bb78e-cf7b-4e01-932a-514414ba49d3","Feature Requests","https://github.com/directus/directus/discussions?discussions_q=is:open+sort:top",{"id":62,"title":63,"url":64,"page":8},"4346be2b-2c53-476e-b53b-becacec626a6","Community Chat","https://discord.com/channels/725371605378924594/741317677397704757",{"id":66,"title":67,"url":68,"page":8},"26c115d2-49f7-4edc-935e-d37d427fb89d","Cloud Dashboard","https://directus.cloud",{"id":70,"title":71,"url":8,"page":8,"children":72},"49141403-4f20-44ac-8453-25ace1265812","Organization",[73,78,84,88],{"id":74,"title":75,"url":76,"page":77},"1f36ea92-8a5e-47c8-914c-9822a8b9538a","About","/about",{"permalink":76},{"id":79,"title":80,"url":81,"page":82},"b84bf525-5471-4b14-a93c-225f6c386005","Careers","#",{"permalink":83},"/careers",{"id":85,"title":86,"url":87,"page":8},"86aabc3a-433d-434b-9efa-ad1d34be0a34","Brand Assets","https://drive.google.com/drive/folders/1lBOTba4RaA5ikqOn8Ewo4RYzD0XcymG9?usp=sharing",{"id":89,"title":90,"url":8,"page":91},"8d2fa1e3-198e-4405-81e1-2ceb858bc237","Contact",{"permalink":92},"/contact",{"items":94},[95,101,107,113],{"id":96,"title":97,"url":8,"page":98,"children":100},"8a1b7bfa-429d-4ffc-a650-2a5fdcf356da","Cloud Policies",{"permalink":99},"/cloud-policies",[],{"id":102,"title":103,"url":81,"page":104,"children":106},"bea848ef-828f-4306-8017-6b00ec5d4a0c","License",{"permalink":105},"/bsl",[],{"id":108,"title":109,"url":81,"page":110,"children":112},"4e914f47-4bee-42b7-b445-3119ee4196ef","Terms",{"permalink":111},"/terms",[],{"id":114,"title":115,"url":81,"page":116,"children":118},"ea69eda6-d317-4981-8421-fcabb1826bfd","Privacy",{"permalink":117},"/privacy",[],{"description":120},"\u003Cp>A composable backend to build your Headless CMS, BaaS, and more. \u003C/p>",{"id":122,"slug":123,"vimeo_id":124,"description":125,"tile":126,"length":127,"resources":8,"people":128,"episode_number":132,"published":133,"title":134,"video_transcript_html":135,"video_transcript_text":136,"content":8,"status":137,"episode_people":138,"recommendations":152,"season":153,"seo":8},"2766c70a-1fc0-46b1-ac5e-b464ca245334","global-bookmarks","903063261","Learn how to create preset layouts, including filters and sorts, inside of Directus Explore.","50c8ecc4-7a85-4779-9d1c-c5d02bb5d56e",4,[129],{"name":130,"url":131},"Bryant Gillespie","https://directus.io/team/bryant-gillespie",2,"2024-03-22","Global Bookmarks","\u003Cp>Speaker 0: Hi. Welcome back to another episode of Short Hops. I'm your host, Brian Gillespie. And today I wanna talk to you about Global Bookmarks inside Directus. This is one of my favorite features.\u003C/p>\u003Cp>I say that a lot, but I I love this feature just because it is really great to preset some nice defaults for your nontechnical users when you onboard them into a Directus project. Your content editors, your marketers, anybody else that you're working with that has access to the Directus app will thank you, when you set up really nice global bookmarks for them. So right now you can see inside, this particular project, this is my Agency OS project, I have these bookmarks that are set up and these are set up as global bookmarks. So out of the gate, Directus allows you to customize any of these specific views to your liking. So I can go in and adjust the layout to be Kanban, table, calendar view.\u003C/p>\u003Cp>Within the table view, I can adjust the different widths. I can set up different filters, control the fields that I want to display. And for users who are new to Directus, it is a a really beautiful UI, but when they first log in, they may not have all their different views set up. Well, they're they're definitely not going to have that. So as a developer, as the technical person, as the lead on this project, do yourself a favor as well.\u003C/p>\u003Cp>Set up global bookmarks. So how do we do that? You know, if I click edit on this, I could see that it's a global bookmark. But if I go in and let's just say I bookmark a view, new bookmark. Great.\u003C/p>\u003Cp>We can see that is not the default. It is a personal bookmark. So to make these bookmarks global, what can I do? I go into my settings, I go to our bookmarks tab, and then I can look for the bookmark name that I've got set up. So that one that I just created called bookmark, but it could be a challenge.\u003C/p>\u003Cp>Right? Maybe I sort by ascending order. This is new bookmark. If I wanted to make this global, all I have to do is go into that specific one and change the scope. So I could change it to all users here and hit save and now that becomes a global bookmark that is available for any user that logs into Directus.\u003C/p>\u003Cp>And if I click edit, I can see that as well. But let's say I want to edit that in the future, I can also just go back to it and there are you have the ability to preset layouts. And here in this layout preview, you can even control, what fields are displayed and things like the column widths. So a lot of this power is available to you and not necessarily right in front of your face, so it's easy to overlook. So that's one of my favorite tips.\u003C/p>\u003Cp>I'll catch you on the next episode.\u003C/p>","Hi. Welcome back to another episode of Short Hops. I'm your host, Brian Gillespie. And today I wanna talk to you about Global Bookmarks inside Directus. This is one of my favorite features. I say that a lot, but I I love this feature just because it is really great to preset some nice defaults for your nontechnical users when you onboard them into a Directus project. Your content editors, your marketers, anybody else that you're working with that has access to the Directus app will thank you, when you set up really nice global bookmarks for them. So right now you can see inside, this particular project, this is my Agency OS project, I have these bookmarks that are set up and these are set up as global bookmarks. So out of the gate, Directus allows you to customize any of these specific views to your liking. So I can go in and adjust the layout to be Kanban, table, calendar view. Within the table view, I can adjust the different widths. I can set up different filters, control the fields that I want to display. And for users who are new to Directus, it is a a really beautiful UI, but when they first log in, they may not have all their different views set up. Well, they're they're definitely not going to have that. So as a developer, as the technical person, as the lead on this project, do yourself a favor as well. Set up global bookmarks. So how do we do that? You know, if I click edit on this, I could see that it's a global bookmark. But if I go in and let's just say I bookmark a view, new bookmark. Great. We can see that is not the default. It is a personal bookmark. So to make these bookmarks global, what can I do? I go into my settings, I go to our bookmarks tab, and then I can look for the bookmark name that I've got set up. So that one that I just created called bookmark, but it could be a challenge. Right? Maybe I sort by ascending order. This is new bookmark. If I wanted to make this global, all I have to do is go into that specific one and change the scope. So I could change it to all users here and hit save and now that becomes a global bookmark that is available for any user that logs into Directus. And if I click edit, I can see that as well. But let's say I want to edit that in the future, I can also just go back to it and there are you have the ability to preset layouts. And here in this layout preview, you can even control, what fields are displayed and things like the column widths. So a lot of this power is available to you and not necessarily right in front of your face, so it's easy to overlook. So that's one of my favorite tips. I'll catch you on the next episode.","published",[139],{"people_id":140},{"id":141,"first_name":142,"last_name":143,"avatar":144,"bio":145,"links":146},"791e1503-1d88-463d-9347-0b9192933576","Bryant","Gillespie","9013afc8-e8d7-4182-9b18-44db08117bb9","Developer Advocate at Directus",[147,149],{"url":131,"service":148},"website",{"service":150,"url":151},"github","https://github.com/bryantgillespie",[],{"id":154,"number":155,"year":156,"episodes":157,"show":162},"e708d08e-2aea-44fa-a335-9e2af2d40d7e",1,"2024",[158,122,159,160,161],"a0f37f8b-c789-4421-b6c4-e4f681028d66","9627b3fd-7a5b-4748-9c18-4ce318ac2cab","511b1967-c04f-42db-b515-911de7981d33","74a53f16-9a2b-42de-bca2-5de319565462",{"title":163,"tile":164},"Short Hops","2166990a-8dbf-4956-8b25-11b72ad203d5",{"id":166,"slug":167,"season":168,"vimeo_id":169,"description":170,"tile":171,"length":127,"resources":8,"people":8,"episode_number":155,"published":172,"title":173,"video_transcript_html":174,"video_transcript_text":175,"content":176,"seo":177,"status":137,"episode_people":178,"recommendations":180},"e82ffa88-91c1-4605-aefa-67bb8e20a9ed","transformation-presets","a1886f5f-e5c4-4dd2-ac8a-d2e7c176f813","983673160","Discover the power of transformation presets in Directus to streamline your image handling processes. Learn how to create and use these presets to standardize image formats, sizes, and even apply custom transformations across your entire website or application","9ceeec94-7ef3-455a-bb85-ca8c0cad2827","2024-07-26","Transformation Presets","\u003Cp>Speaker 0: Welcome back to another episode of Short Hops. I'm your host Brian Gillespie. And today, we are covering transformation presets. What are transformation presets, you ask? So one of the more powerful features inside Directus is the ability to transform your images.\u003C/p>\u003Cp>We could do things like cropping. We can adjust the color, change it to gray scale. We can use more compressed formats like webp and avif to make our site load faster. Transformation presets are just shortcuts for those. So you can standardize images and formats, sizes across your entire website or application quickly and easily.\u003C/p>\u003Cp>So let's take a look. I'm inside a sample project. I've got, some assets here. And if I just open up this, bunny, this is actually probably a hare. You know, we could do things like this where we have our transformations.\u003C/p>\u003Cp>Right? So I can adjust the width of this image. I can adjust the height of this image. But imagine I've got a blog page where I have cards that are all, roughly a same size. That's a good use case for transformation presets.\u003C/p>\u003Cp>So what can I do? We're gonna go into the Directus settings, to our project settings. We're gonna scroll down to files and storage. And I'll zoom in even further for you here. So there's a couple of settings when it comes to transformations.\u003C/p>\u003Cp>I can allow all transformations, which is basically, hey, I can whatever transformation I wanna do as long as it is valid sharp, which is the underlying library that we use, we can do that. I can also disable all transformations, so you get what you get as far as images. And last but not least, I can limit the transformations to presets below. So if you're concerned about people absolutely killing your server with transformations or kind of standardizing, you probably wanna do this limiting option. But as far as our presets, again, these are just shortcuts that you set up to, you know, standardize the format.\u003C/p>\u003Cp>So you could see this one called 800 width, or 800 w, is basically just a preset width of 800. We use the webp format. And instead of having to pass all these parameters when I actually get the image, I could just do something like this where in my URL for that specific image, you know, slash assets, slash the UUID for that file, I add a key param and I do 800w. Right? So that saves me a lot of time.\u003C/p>\u003Cp>And again, helps me standardize across my website. Creating these presets is super simple. I just go in. If I wanted to create a new preset, let's call it purple. Right?\u003C/p>\u003Cp>We'll do 800 wide. Let's do a webp format. And I've just got a additional transform that I wanna do here. We're gonna tint the image and we're gonna apply our directus purple, hence the name purple. So we'll do fit inside, that's great.\u003C/p>\u003Cp>Save this. And now if I go back to this specific image, all I have to do is change that key. And I now get a purple tinted hair in a field image. Looks amazing. So that is it for transformation presets.\u003C/p>\u003Cp>Try this out. Leverage it in your projects. It's super helpful. We'll catch you on the next one.\u003C/p>","Welcome back to another episode of Short Hops. I'm your host Brian Gillespie. And today, we are covering transformation presets. What are transformation presets, you ask? So one of the more powerful features inside Directus is the ability to transform your images. We could do things like cropping. We can adjust the color, change it to gray scale. We can use more compressed formats like webp and avif to make our site load faster. Transformation presets are just shortcuts for those. So you can standardize images and formats, sizes across your entire website or application quickly and easily. So let's take a look. I'm inside a sample project. I've got, some assets here. And if I just open up this, bunny, this is actually probably a hare. You know, we could do things like this where we have our transformations. Right? So I can adjust the width of this image. I can adjust the height of this image. But imagine I've got a blog page where I have cards that are all, roughly a same size. That's a good use case for transformation presets. So what can I do? We're gonna go into the Directus settings, to our project settings. We're gonna scroll down to files and storage. And I'll zoom in even further for you here. So there's a couple of settings when it comes to transformations. I can allow all transformations, which is basically, hey, I can whatever transformation I wanna do as long as it is valid sharp, which is the underlying library that we use, we can do that. I can also disable all transformations, so you get what you get as far as images. And last but not least, I can limit the transformations to presets below. So if you're concerned about people absolutely killing your server with transformations or kind of standardizing, you probably wanna do this limiting option. But as far as our presets, again, these are just shortcuts that you set up to, you know, standardize the format. So you could see this one called 800 width, or 800 w, is basically just a preset width of 800. We use the webp format. And instead of having to pass all these parameters when I actually get the image, I could just do something like this where in my URL for that specific image, you know, slash assets, slash the UUID for that file, I add a key param and I do 800w. Right? So that saves me a lot of time. And again, helps me standardize across my website. Creating these presets is super simple. I just go in. If I wanted to create a new preset, let's call it purple. Right? We'll do 800 wide. Let's do a webp format. And I've just got a additional transform that I wanna do here. We're gonna tint the image and we're gonna apply our directus purple, hence the name purple. So we'll do fit inside, that's great. Save this. And now if I go back to this specific image, all I have to do is change that key. And I now get a purple tinted hair in a field image. Looks amazing. So that is it for transformation presets. Try this out. Leverage it in your projects. It's super helpful. We'll catch you on the next one.","\u003Cp>In this episode of Short Hops, dive into the world of transformation presets in Directus. Host Bryant Gillespie guides you through this powerful feature that allows you to standardize and optimize images across your projects with ease.\u003C/p>\n\u003Cp>What you'll learn:\u003C/p>\n\u003Cul>\n\u003Cli>Understanding transformation presets and their benefits\u003C/li>\n\u003Cli>How to access and configure transformation settings in Directus\u003C/li>\n\u003Cli>Creating custom presets for width, format, and special effects\u003C/li>\n\u003Cli>Applying presets to images using simple URL parameters\u003C/li>\n\u003Cli>Balancing flexibility and control with transformation options\u003C/li>\n\u003Cli>Real-world use cases for standardizing images in web applications\u003C/li>\n\u003C/ul>\n\u003Cp>Whether you're managing a blog, e-commerce site, or complex web application, this episode provides valuable insights into streamlining your image handling process. Learn how to create presets that ensure consistency, improve load times with modern formats like WebP, and even apply custom transformations like color tinting.\u003C/p>","a142eef1-b2ac-48e7-8b53-d4add5047669",[179],"4c955a81-4deb-4d16-940d-fe54a4f3307f",[],{"reps":182},[183,239],{"name":184,"sdr":8,"link":185,"countries":186,"states":188},"John Daniels","https://meet.directus.io/meetings/john2144/john-contact-form-meeting",[187],"United States",[189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206,207,208,209,210,211,212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229,230,231,232,233,234,235,236,237,238],"Michigan","Indiana","Ohio","West Virginia","Kentucky","Virginia","Tennessee","North Carolina","South Carolina","Georgia","Florida","Alabama","Mississippi","New York","MI","IN","OH","WV","KY","VA","TN","NC","SC","GA","FL","AL","MS","NY","Connecticut","CT","Delaware","DE","Maine","ME","Maryland","MD","Massachusetts","MA","New Hampshire","NH","New Jersey","NJ","Pennsylvania","PA","Rhode Island","RI","Vermont","VT","Washington DC","DC",{"name":240,"link":241,"countries":242},"Michelle Riber","https://meetings.hubspot.com/mriber",[243,244,245,246,247,248,249,250,251,252,253,254,255,256,257,258,259,260,261,262,263,264,265,266,267,268,269,270,271,272,273,274,275,276,277,278,279,280,281,282,283,284,285,286,287,288,289,290,291,292,293,294,295,296,297,298,299,300,301,302,303,304,305,306,307,308,309,310,311,312,313,314,315,316,317,318,319,320,321,322,323,324,325,326,327,328,329,330,331,332,333,334,335,336,337,338,339,340,341,342,343,344,345,346,347,348,349,350,351,352,353,354,355,356,357,358,359,360,361,362,363,364,365,366,367,368,369,370,371,372,373,374,375,376,377,378,379,380,381,382,383,384,385,386,387,388,389,390,391,392,393,394,395,396,397,398,399,400,401,402,403,404,405,406,407,408,409,410,411,412,413,414,415,416,417,418,419,420,421,422,423,424,425,426,427,428,429,430,220,431,432],"Albania","ALB","Algeria","DZA","Andorra","AND","Angola","AGO","Austria","AUT","Belgium","BEL","Benin","BEN","Bosnia and Herzegovina","BIH","Botswana","BWA","Bulgaria","BGR","Burkina Faso","BFA","Burundi","BDI","Cameroon","CMR","Cape Verde","CPV","Central African Republic","CAF","Chad","TCD","Comoros","COM","Côte d'Ivoire","CIV","Croatia","HRV","Czech Republic","CZE","Democratic Republic of Congo","COD","Denmark","DNK","Djibouti","DJI","Egypt","EGY","Equatorial Guinea","GNQ","Eritrea","ERI","Estonia","EST","Eswatini","SWZ","Ethiopia","ETH","Finland","FIN","France","FRA","Gabon","GAB","Gambia","GMB","Ghana","GHA","Greece","GRC","Guinea","GIN","Guinea-Bissau","GNB","Hungary","HUN","Iceland","ISL","Ireland","IRL","Italy","ITA","Kenya","KEN","Latvia","LVA","Lesotho","LSO","Liberia","LBR","Libya","LBY","Liechtenstein","LIE","Lithuania","LTU","Luxembourg","LUX","Madagascar","MDG","Malawi","MWI","Mali","MLI","Malta","MLT","Mauritania","MRT","Mauritius","MUS","Moldova","MDA","Monaco","MCO","Montenegro","MNE","Morocco","MAR","Mozambique","MOZ","Namibia","NAM","Niger","NER","Nigeria","NGA","North Macedonia","MKD","Norway","NOR","Poland","POL","Portugal","PRT","Republic of Congo","COG","Romania","ROU","Rwanda","RWA","San Marino","SMR","São Tomé and Príncipe","STP","Senegal","SEN","Serbia","SRB","Seychelles","SYC","Sierra Leone","SLE","Slovakia","SVK","Slovenia","SVN","Somalia","SOM","South Africa","ZAF","South Sudan","SSD","Spain","ESP","Sudan","SDN","Sweden","SWE","Tanzania","TZA","Togo","TGO","Tunisia","TUN","Uganda","UGA","United Kingdom","GBR","Vatican City","VAT","Zambia","ZMB","Zimbabwe","ZWE","UK","Germany","Netherlands","Switzerland","CH","NL",1773850426715]