 Thanks, everybody, for coming. All of you. I hope everyone's DrupalCon is going awesome so far. I'm Jim Birch. I'm a strategist at Xenomedia. You can follow me at the Jim Birch. The slides are available at jimbir.ch slash bp, if you want to follow along. And we are here today to talk about bootstrap paragraphs. The bootstrap paragraph module provides a suite of content and layout paragraph bundles made from the bootstrap front-end framework. I have a demo site linked from the page which shows off some of the different bundles you get, gives an explanation of my thought process behind it, and we're going to work through most of this in this presentation. Is everybody here using paragraphs? Yes? No? If you are, how many times have you built the same thing on different sites? Three column paragraph, the text and image paragraph, a slideshow or carousel paragraph, and then how many times have you built it just a little bit differently? I keep going back to the first site I did and have to relearn how I did it, and then the next site, and then the next site. If you're not using paragraphs, I recommend installing this module and just checking out all the things that you can do for it. So it's a big range of modules or bundles that get installed. It can kind of show you the power of paragraphs, and then you can come away hopefully thinking about how you can implement your own paragraph bundles. So my strategy when making this module is that I wanted to create a module that would make the basic paragraphs needed for every site, kind of that 80-20 rule, like I wanted to make a suite of bundles that would cover 80% of the needs of a site. I wanted to create templates and CSS that would work on any theme that included Bootstrap. So we used the Bootstrap-based theme on some sites, and then we create completely custom sites that include the Bootstrap framework. So I wanted it to be just a good base to start from. I wanted to harness the power of the entity-reference-revision field. This is a field that comes with paragraphs from a submodule to nest paragraphs. So we can put paragraphs inside of other paragraphs. And lastly, I wanted to have global width and background color settings that would be on all of these different bundles. So Drupal paragraphs, for anybody that doesn't know, paragraphs is a contrib module for Drupal that allows creation, administration, and display of customizable content components. I first discovered paragraphs when I was presented with a design from a designer that had a typography column that was very narrow. It was about 60 to 70 characters wide. And they explained to me that this is one of the best readability ranges for a typography. But also, in that narrow column, we didn't want to restrict the images. So we wanted the images to go full screen in this article-style layout. So I started exploring options. Next I started realizing that we could use this to structure content. So I've been working on the web since 1997 when I was a webmaster and I had a custom CMS and I asked them to delete the CK editor, FCK editor at the time, whatever it was. And I learned HTML. It was terrible. When I started developing in Drupal, integrating media solutions with the WYSIWYG was really hard to do. There's a big suite of modules in Drupal 7 and 6 that had a hard time working together. And then having the ability to add semantic markup to your different content components, such as schema.org markup, or even just properly structured HTML, JSON-LD, is a bonus for SEO and accessibility. And then the last thing is that paragraphs allow the administrator to create layouts in addition to just adding content. So we can have them free to add multiple columns. They can quickly reorder rows of content and then they can get all the bonus awesome stuff like heroes, slideshows, accordions, tabs, and more. So Bootstrap Framework. The Bootstrap Framework is the most popular HTML, CSS, JavaScript framework for developing responsive mobile first projects on the web. We look at Drupal as 5% of the Internet and WordPress as 25%. Bootstrap is far greater than that. So it has a great backing. We started using it at Xenomedia because of its core functionality. The responsive grid markup and CSS, the base, themable content components and JavaScript components. And then it has a very readable typography base, a letter spacing, the different sizes between headings and paragraphs and lead paragraphs. Very readable and a lot of other smart people are working on that. It's well documented. And as we know, being Drupal developers, documentation is awesome. Standardization on a certain platform helps teams become more productive. And onboarding new developers is quicker, faster. And they can just read other people's documentation instead of your small agency creating it. It's completely customizable for large projects. You can use the mix-ins to add their styles to your HTML. And it's best practices for small low budget projects. And bonus, it's open source just like Drupal. You can contribute to it. They have a development team on GitHub. Part of the module is inspired by a great presentation that was done here at DrupalCon last year. I saw it at Twin Cities Drupal Camp by Les Lim and David Needham called Using Paragraphs to Weave a Beautiful Content Tapestry. And they presented the idea in that session about content paragraphs, layout paragraphs, and then ponies. So content paragraphs will go through and these are your actual content. Layout helps you place those content things elsewhere. And the ponies, those are the 20% the thing that you need to develop for your own project based on need or design, anything like that. Exactly what you expect a pony to be. So our content bundles in Bootstrap Paragraphs, they're semantically organized fields and reference fields to common entities. We'll go through them one by one in a minute, but an HTML, an image, a blank for forms and JavaScripts. And then contact forms, blocks, views, media, when that becomes in core, those all get referenced. Your layout bundles from Bootstrap, you have your column, your grid framework, carousel, accordion, modal, and tabs. So let's go through the types. The simple paragraph is a body field basically. It has the background and the width fields just like every other bundle does. And then it has a long text field that has a WYSIWYG on it. The image bundle has an image reference field, uses cores image field. So you also get the alt description with it and it's required for good accessibility. And then there's also a link field on it. So you can link the image to either itself or to another place. The blank paragraph is basically a long text field. But during installation, I recommend you set up a new text format that's unrestricted. And I use this to do things like the MailChimp signup form. Or if you're doing information collection using CRM like Pardot or HubSpot, Eloqua, Marketo. This is great to stick those forms in the page. And then you can let them render as you see it. There is a security concern about letting people use this text format. If you allow people to put JavaScript in your database, you allow people to put JavaScript in your database and they can do bad things with it. So you wanna just make sure in your editorial workflow, only the right people get to use the text format. The contact form, Drupal 8 contact form is in core and it's awesome. It's everything, a contact form should be. It's fieldable, they're reference entities that can be referenced. But in core, there's no field form matter for it, so you can reference it. But basically, you can do that reference in core only links to it. My awesome co-worker, Albert, developed a module for me called the contact form matter module that gets installed if you install Bootstrap paragraphs. And that provides a field form matter for it. So basically, in line with your rest of your paragraphs, you can reference a contact form. You can also add the module inline entity form. This is a great module that allows you to create another entity while you're working inside an entity or select an existing. So you could allow your administrator to select an existing contact form or create a new one while they're creating an article or a blog post. So it's a great tool for marketers if they just want to get contacted using the contact form. Drupal blocks, so Drupal comes with these awesome blocks. Blocks in Drupal 8 are now entities. So basically, this is just a reference field to those blocks. Like the contact form, not all blocks have field form matters yet or can be rendered in this way. What's working right now is menus. So your core footer menu, main navigation menu, tab status messages render, site branding, and then the awesome powered by Drupal block. Not working are a bunch of admin stuff. Most importantly, breadcrumbs and page title. Like these, I think would be really cool to have the ability in a paragraph bundle. It's got me thinking when I was doing this research about panels everywhere, where you just had a blank slate and you could use panels to put anything anywhere. It would be cool if we could use paragraphs to do it. I don't know how fun it would be for the administrators to have to lay that out on every single screen. But if you can place a menu in line with your content, so you could have a section on your site that just had a menu placed by paragraphs. Be cool if you could do page title and breadcrumbs and move that stuff around too, maybe someday. Views, I found an awesome module called Views Reference Field, where we can now have a reference to a view and you can pass it arguments if you want. So you could always create a view block and use a block reference field to reference a view. But this module allows you to pass an argument to it. So if we wanted to have one view that displayed all the widgets on a site, and we could put a block in here that says, display all the widgets of type B. So then you can have your content, you could have a simple and an image and a couple columns, and then you could have a view and then you could have a couple more things. So it's a really dynamic way that you can get your views into the fold. Okay, so now on the layout columns, sorry, layout bundles, we have columns. We have three types of columns. Each of them have one field for the content called column content field. My first paragraphs site, I made a three-column bundle and a two-column bundle and a four-column bundle and I had a field for every column. Column one, column two, column three, column four. And the first day, my content administrator started using it. She said to me, how do I move the stuff in column one to column two? And I said, so now I have one field, it's a multi-value field. And you can use the Drupal admin UI to just drag and drop them around. So the columns equal, I think sometimes it just referred to as columns, allows for up to six columns, six bundles can be put in there. And using some twig magic, they all just disperse evenly. So if there's two, it's 50-50. If there's three, it's 33, 33, 33, etc. I limited it to six because seven, nine, and 11 looked really squashed and weird. And eight, 10, and 12 you could accomplish by nesting columns in columns. If you so wanted to. I've never had the need to go more than six wide. The three and the two column uneven, we separated these out into their own bundles because we have an additional field on it called column style, where you can set the different widths. And we'll go through that now. So here's the equal columns. I'm showing the width options all the way down, but you have two, three, four, and six. There's no five in bootstrap. It's a grid of 12. If people do put in five, it assumes the six styling. Here's what the two uneven looks like. Basically broke it up into the most common layouts that I've found, based on 25%, 75%, and 66%, 33%, and vice versa. And the three uneven columns goes crazy. So you have the same idea of quarters and thirds, but they have a lot more possibilities. I think that's all of them right there. But you can get most of the layouts that you commonly use here. Okay, on with the fun stuff, the carousel, because everybody loves carousels. The carousel has a field called slide content. Just like the columns, we can put anything in a slide. It also has a slide interval field. So you can have it set to false, which doesn't rotate, but that's no fun. So we have the speed options from one second to ten seconds. And you can see inside I have columns with text in there. I have an image, and I have a multi-column with an image and text in there. Possibilities are endless. The accordion, the accordion uses the bootstrap collapse JavaScript. And this one's a little bit different that I needed to have two fields. I needed to have a title field, which causes you to click open and close the bundle, and then the content field that goes inside of it. No problem. It's so popular, we want to make sure it's recording. Thanks. So basically, inside of each accordion, we have an accordion section paragraph bundle type. It's kind of seamless to the user. You just add another, add another, add another. Looks just like a multi-value field or a field that has two things in it. So basically, the first field in that accordion section is just a text field. That opens the link, and then inside, you can put anything you want. And you see this example. I have a simple, I have an image in a contact form. So really cool to have a really long contact form and just only have it exposed if people actually want to fill it out. The modal, also awesomeness from Bootstrap. We have a button that launches the modal, and then inside the modal, we have a title and then two paragraph fields, and I'll show you that now. So the button text is just a text field. You can place that and then actually goes on your page. You can put it wherever you want. The title is just a title up top. And then here I have a simple and then a simple in a contact form. So you can do the same thing, hide your contact form, expose it only when needed. And last but not least, tabs. We have the same thing that we had with the accordion section, that we needed to have a title for the tab title, and then a body. So we have the tab section paragraph bundle, and we can have images, text, contact forms, multi-columns, all that good stuff. So those are the basic paragraph types, and that is a dancing cat. Really odd rabbit hole to go down on the internet. Dancing cat gifts. Okay, so let's talk about the global settings. Every paragraph, whether it's content or layout, has the option to set background colors and one of five widths. And I set that up using list fields with select options. So once you install this, you could add more if you wanted to. The widths are based on the bootstrap classes and offsets. So if you do have set them, they become centered using the offset. So the tiny is a column four. This is a third of the section, and we offset it four from the right. The narrow is a column six, and offset three. Mediums column eight, offset two, and the wide is column ten, offset one. And the full goes all the way across. So here's what that looks like using the same awesome image over and over again, all the way down the screen. The background colors, I found a suite of nice material design looking background colors that I applied. And then I also put in five extra classes using the bootstrap nomenclature. So you could style these in your own themes, like primary color, secondary color, success color. Here's what the color looks like. It's blue, heavy, blue light, blue slight. I'm not in love with this solution. There's a cool module called Color Field that's in beta. You might look at that in the future. If other people have suggestions, I'd love to hear it in the issue queue. I created an issue for myself to figure out what to do with this. I didn't want to limit people to just these, but I also wanted to have something that people could just use out of the box. So yeah, help me out if you have cool ideas. Template and markup strategy. So we're gonna get into the nuts and bolts a little about how I put this together. The markup, every paragraph has a div around it, div class equals paragraph. To this paragraph, I apply the bootstrap row class. I do this because a row stretches all the way to the edge in a bootstrap container or container fluid. But it also works if it's nested in other columns. So this is how we get away with putting paragraphs in paragraphs in paragraphs. So if I have a column paragraph, I can put a row in it. And if I just have a container blank in the template, I can put a row in it. We're using the block element modifier, BEM style markup for classes. I do this, I don't use the straight bootstrap markup because I was there when bootstrap two switched to bootstrap three. I use the mix-ins from bootstrap and apply them to the CSS of this BEM style markup. So bootstrap four, which has been coming any day now for a couple of years, they could decide to switch everything around and go full flex box or CSS grid or whatever, we'll be ready to handle that if they do. So the block of this all is the paragraph.paragraph. The modifiers that we have on the paragraph div are the type. So we have the paragraph type. So paragraph type accordion, paragraph type, simple carousel, whatever. The view mode, that comes with default paragraph template. I left that in there. So if you do have different view modes for your paragraph bundles, you can style them accordingly. The with name gets applied here. So paragraph with full, paragraph with tiny, and then the color, paragraph color, and then paragraph color, color name gets applied here. We apply the color because we add a little extra padding if you have a color in there, and then the color name actually adds the color. Inside of that div, we have paragraph underscore, underscore column. This is the element of it. Here we take the with class that was applied on the row, and we apply it here. So this is your call sm12 or call sm8 here. And then inside of all this, we have some twig magic where we print the contents of the paragraph bundle without the with and the background field. So we're going to take care of that in the template next. So only the paragraph column fields, only those content fields print. So we have three chunks here. The first chunk renders the with field. We take the value of what's in the with field, what's coming out of the database, and we turn it into a class on the right. So in this instance, paragraph with tiny is coming out of the database, and we turn it into exactly the same thing on the right. But seems like overkill right now. But here's where we could change something later in our template and not have to worry about what's in the database. Because with Drupal, what's in the database stays in the database. Like Vegas, I guess. If BEM style classes got replaced by some new awesomeness next year, and we decided to rewrite it all, we could do that using this first chunk. The second chunk merges the with field classes that we just made with the classes variable that comes with most of the entity bundles in Drupal. And then in the third chunk, this is actually where we're putting the classes on the div. So we made the classes, we merged the classes, and then div attributes add class classes, prints them out. So we're going to use this theory to do a couple other things later. In the module, I use the awesome power of Drupal asset libraries to load the CSS files only with those templates. So this is a cool feature of Drupal 8 where I don't have to add the CSS globally, I add them when the template is called. So if you're not using this on a certain content type, the CSS doesn't get loaded and your site's going to be faster. Bonus round, okay. One of the things I found that both container and container fluid in Bootstrap, especially container fluid, have some margin on the side. So when you apply full color to a container fluid in a row, there's still a little bit of white on the side. So to get around this, what I've been doing is I've been making a structured content div region in my page template and having this field print in there and then adding a few lines of CSS to get rid of it. So basically, the first line says with 100%, padding left and right is zero and then the div right there. There's some, usually the first row div. There's a little negative margin to offset that first padding. I reset it. And if you do this, the colors will go end to end in a nice modern web design theme. And then I add it as a region and don't do this to my main region because then only these fields go wall to wall. You know, maybe you don't want your header or your title or where your tabs are to go all the way to the edge. Because inside of this, we're putting more paragraphs that adds the padding that makes it not bump up against the wall. OK, so overriding. You've installed this module and now you're ready to dig in and start theming or just customizing it to what you need. Once it's installed, you own it. Bundles and fields from this module are put into your database and never referenced from the module again. So what you do to them in your database or configuration, any changes you make are yours. Just know that once you have content in them, it's tough to delete or change the existing stuff, but you can always add on. The CSS and templates. Your theme has a higher priority than this module. So any templates that you copy from the module into your own theme or any CSS that you overwrite is yours. In fact, you can uninstall this module. I'm going to say right now that I'm the only person here today speaking that says they can uninstall the module. And you can still keep all the functionality. So the fields in the bundles are in the database. If you move all the templates to your theme and remove the attached library call, because we're going to get rid of the library that comes from the module, you'd have the templates. You'd have the CSS files. You'd move the CSS files. You'd move the CSS into your theme. And that's it. You just spent an hour installing all this stuff, and your co-workers are going to be amazed, like, how did you do that so fast? OK. The last thing I wanted to talk about was extending Bootstrap paragraphs. So adding those last 20% the ponies that you need to do to finish your job. The first one's a pretty easy one. I'm referencing the Drupal blocks in the Drupal block module or bundle. But it doesn't reference custom blocks, because we don't know the custom blocks that you guys are creating. So what I do is I pop open the Drupal block paragraph in the managed fields. We have three fields. We have the background, the width, and then the block, which is the entity reference revision field. And then open up a new tab and start creating a new paragraph bundle. In this example, we're going to create an awesome block bundle to reference our awesome blocks. So name it. And then add some existing fields. The first field we're going to add is reusing an existing field. And we're going to scroll down to the BP underscore background and save and continue. Boom. You just added the background field. Next up, the width field. Same process. Add the BP underscore width field. And you're done. The third one, we want to use an entity reference revisions field. So you add a new field and scroll down to reference revisions. The only option by default there is paragraph because the paragraph people made the entity reference revisions module. But you can select other two. So other brings you to the next screen. And here you can select all the revisionable entities on your site. So nodes, content are revisionable entities. Paragraphs are revisionable entities. And custom blocks are revisionable entities. There may be more that you're adding with other things that would show up in this list. So select custom block. And then you can also change the value here if you want to keep it just to one or keep it unlimited. On the next screen, you get to configure it. So how are we going to reference that? Probably just an autocomplete. The bundles, you can select which of your blocks you want to include. Unlike some other things in Drupal, you can, some things you can just leave blank and it will reference all of them. This field type has you selected. So you see here I selected awesome block. I did not select basic block or not so awesome block. But you could select multiple if you wanted to. And then you can basically do your sorts if you wanted to at the bottom. Sort by time created or alphabetical if you're doing select list kind of things. And then we move on to the display. So just like the Drupal block display, we're displaying the background and the width as the key values. And then our twig template can turn it into the classes. And then the awesome block gets rendered as an entity. And here you can select the different view modes, the different display modes for it. Most of the time on blocks, it's just default. But if you had a teaser display or a sidebar display, you could do that here. So that is the custom block. The next one, we're going to do a hero. A big splash at the top of the page. And also a kitty in a tank. The hero is a bit more complex. I built this to solve a lot of different things. It has a paragraph reference field for content. It has a background image. And then it has four options. It has parallax option and a zoom slash and a ken burns effect where it just subtly fades in or fades out. And then it has an image overlay on that background. So the image overlay puts an opacity over the background image in case the image is just terrible to have a markup over or content over. And then it also has an image overlay invert option. So by default it's black and then opaque. We can also have a white and opaque. I also use some CSS to switch the text color. So here's what it looks like. Inside of it I just put a simple and just had some markup and an H2 and a paragraph and a button. Here's what the fields look like. We have the background image on the top. We use the image field. We have the content which is the reference revisions field. And then we have the four options. This is the display of it. Same thing using the key, the default and the image. You could actually use an image preset here too which I probably should be doing. And the template. So I'm creating this in a custom module which I'm going to just get to next called the Xeno Hero. We set the default classes and then we start adding our custom classes. So unlike the colors and the zoom effect the overlay we're using a data attribute, data-overlay to set it. So in this case we're using just numbers to come out of the database and we're setting it here. Same thing for the parallax speed. We're using data-parallax to set the data speed. So same premise as the width in the background colors before. The inverts. I set it up to be expandable in the future while I'm just setting one class right now. I could add like an invert purple or invert green in the future. And then the zoom. Same thing for the CSS. I needed a zoom class and then a zoom level class. So we add both of those here and then mix it in with the classes at the bottom. So this is a little hard to read. I apologize. But the only extension that we did here was that we have the classes being add, add class classes on the attributes tag on the outer div. And then here we get to set additional attributes. So we use the Drupal, Twig, set attribute, data overlay and then we take that Twig variable overlay underscore levels and we repeat the process for speed. Set attribute, data speed, parallax speed. And then we have our markup. We talk about the paragraph at the top and then the paragraph image. And then we have the background image that actually prints on the screen and our overlay gets added there. And then we print the content without the image, the invert, the overlay and the parallax. How did I do this? I used the same process that I used to do bootstrap paragraphs. I built this module using a Drupal UI. And then I export the config and that's a majority of the module. So we'll go through these steps but I wanted to present the idea that you could create your own paragraph bundles and make them reusable across projects. That's what I did with the bootstrap paragraphs in the first place and then I continued that theory using the Xenohiro. I didn't want to leave it just for this one project. I wanted to make it bigger than that. So the first thing you do is spin up a sandbox, a development environment. I used Pantheon for mine. I just start, you know, click a button and then a few minutes later I have a dev environment and I can install paragraphs and start building a bundle. You can do this on your local or whatever else you like. In a folder, start creating the module structure. This is what the module structure looks like. You have a config folder and then an install folder. That folder gets hit the first time you install the module. In this case, I needed JavaScript so I have JavaScript. A template. I copied the template from bootstrap paragraphs, put it in here and made some modifications. Then the rest is just like a theme. You have your info file, your libraries file and then the last thing you have your module file and this has one really small function in it that says look over here for the templates. That's it. So, I add your templates to that module. I start out working in a base theme and then I move it over once I'm happy but move your template over there, rename it what your paragraph bundle name is add the CSS, add the JavaScript and then configure them in the modules libraries folder. Then you can do the attached library in the template. Again, it's only loaded if you use the hero bundle. Here's what the function looks like. It's hook underscore theme which basically says if you have need a theme for the paragraph underscore underscore Xenohero use this template over here. The bootstrap paragraphs module does this to a lot of the paragraph bundles and then there's a couple field bundles I do it to if you want some examples. When you're all done, export the configuration and then you got to do a couple things. This is probably the most tedious part. The first line in your configuration is a UUID. This makes it unique to the Drupal site that you're using it. We don't want to make it unique, so just go in and delete that line altogether. The next thing I found is that you need to change the namespace. So, when you build things in Drupal's field UI, the user interface, it always gets namespaced field underscore thing, whatever you put in there. That's the way I had the 1.0 branch of bootstrap paragraphs until somebody commented in the issue queue that hey, I can't install this on the Aquial Lightning distribution because it has field underscore image already in it. So, there was a collision of field image. I couldn't make them create field image because field image already created. So, bootstrap paragraphs 2.0 was born. And I learned how to rename files. So, there's a few places you need to do it. You need to do it in the actual config file name. And then in the config dependency, this is the dependency on this bundle to those file names. And then in the content in some of them, they list the field down here like what the settings are for the field. So, it's also a really good exercise to see what the config files are doing. You can really dig in and see the yaml of what you're doing in the UI. It's cool to me because it's not in, you know, crazy PHP markup, you know, it's just in a very structured, neat organized package. So, very cool to do. And then once you're all done, install it on another sandbox. Test it like crazy. Because like I said earlier, once you have things installed in Drupal in the database, it's very hard to undo them. So, I recommend installing on test, testing, you know, doing all the combinations, and then sharing it with the world. I put this hero module up on GitHub for other people to play with. I thought it was too ultra specific to do just this one thing on drupal.org. But it's there and can be accessed and commented on. Okay, so let's finish up so you guys can get back to work. Using frameworks ultimately benefits our own productivity. I mean, that's why we use Drupal, that's why we use Bootstrap, that's why we use paragraphs, and that's what I was trying to achieve by making this module. Like, boom, let's get to the good stuff. We don't want to just keep doing the mundane over and over and over again stuff, trying to reinvent the wheel every time. Just because I took this approach with Bootstrap doesn't mean that you are locked into that. You can apply these techniques to any frameworks that exist out there. I was working on the mid-camp site and the organization uses a grid framework called Singularity. I was able to replicate the column idea there. I'm sure you could do most of this stuff with the foundation grid and JavaScripts or even just smaller things like the slick carousel. You don't need a module to install all this crazy functionality when you can just do it really simply inside a small paragraph bundle. I'm going to thank some people. My company, Xenomedia, we're a Chicago-based agency that does Drupal development and consulting to the world's best clients. My coworkers are awesome. So is Albert Jinkowski, Albert ski on Drupal.org. He helped me develop this module and he always helps me debug all the Drupal 8 things. Thank you, Albert. Thank you. Zoom data, my client, that is still on Drupal 7 but all of these ideas came from working on them. They make fastest visual analytics for big data. They have offices on both coasts and in the Ukraine hiring right now, especially a web designer. If you want to come work with me, I would love to have you. And all the people that make and maintain the Paragraphs module, lesson David for giving me good ideas. Morton, Danny, Greg Boggs, Mark Conroy, and everybody else in the Drupal twig slack. If you guys are themers or site builders, there's a slack called the Drupal twig slack and it's filled with super awesome helpful people. Go in there, ask a question, and chances are within 10 minutes somebody will help you or point you in the right direction or say, Jim, why are you doing it like this? How about you do it like this? Really awesome people. And so many people in Stack Overflow, especially Scott Reeves, Kotzer, who no matter what I Google, I end up on a question that he's answered. And then Drupalcon, Friday, the sprints. Everybody should come. There's a first-time sprinter workshop in the morning, mentored sprints in the morning, and then the general sprints go all day long. I'd love feedback about this presentation. There's a link in that last slide, good or bad. Tell me what you like, what you hated. There's a Drupalcon survey. Slides will be up forever. I am available for questions if you have any, or I'll be around all weekend. You want to go up to the mic? Thank you, everybody, for coming. I was just wondering what you're using for the modal in your modal paragraphs display. Because it exists in Bootstrap. Once I moved, once I got the slideshow accordion tabs going, the modal was the last one I added. I haven't used it yet. I know it's bad practice because it doesn't work on mobile. But it exists in the Bootstrap, and I figure somebody would want to use it. This is kind of a new question, but no one's really been able to understand why you would want to use paragraphs over creating multiple fields. What is the advantage to paragraphs over just making new fields in your content type? So reorderability. So if you have multiple types of fields, it's not reorderable. That would probably be your biggest thing. The second thing is semantic markup. So if I do know these things, I guess you could do that with fields, too. But yeah, probably the biggest thing is the reorderability. And then the fact that you could... You have this UI where paragraphs is working on making this easy to do rather than lots of different things. One other thing I'd add to that is you can create, like, rule sets with the type of paragraphs that can be included in things, which is pretty cool. So who can access one versus the other? Permission levels. And also... Anyone else? Awesome. Thanks again, everybody. Oh, thank you very much. Thank you very much. So don't hold it in a stretch. Have a second. Everything's recorded. Outlook, yes. I'm going around to see if the slides are there. Oh, there's a bunch of them. Okay. Okay. Okay. Yeah, so... Yeah, so... Well, G7, I was a group of promising students in D7, say, now, except, like, some of the other people actually have an R right on the back. It's nice to just go into a triple-spice class and be like, you know, it's not a lot of things. So everything's different, but... Yeah, I think it's, like, a lot of possible... Yeah, it's different. It's different, it's better for us. Right. Yeah, yeah. I have no similar thing. No, I don't think a lot of them. We've watched them, they're pretty static, typical. I mean, Harry's what some of the things we've worked on. Images are always on the top of the list. That's right. It works. Yeah, it was, yeah. It's a triple-7, and that's why I get here, like, I get some food in here. It's the sort of red bundle. Because I've done the same thing, like, three days a year, we'll find out what's in here in our bundle. Can you do a seven? Can you? I'm curious, how do you, my gosh, if you were here to not spend the whole night out, because if you have your container, you've gotten a sense of not containing fluid gas, and they want to have it here with it, it should seem like... Yeah, so, I mean, like, that's my, that was my coldest rush that, like, was very rustic in the field. Separate problems. The rest of it. Yeah, right. Because, yeah, I embedded it right in, and I got some crazy CSS to pop it out of the container and then maybe go full-width, but it wasn't pretty, you know, Yeah, I've also got the opposite of where... So, yeah, that's why I go to the separate field, and then each one of the tops is ready, and I get a little bit of, you know... Basically, I just have to, yeah, I get a structure, you know, so it's containers, and then row has, you know, to bring it back out. So, I'm glad to hear you're working on the same thing. Yeah, I'm glad to hear you're working on the same thing. Yeah, I'm glad to hear you're working on the same thing. Yeah, I'm glad to hear you're working on the same thing. Yeah, and that's because I created so far the Hero World paragraph bundle of the accordion, I actually made the accordion tabs one bundle because it's almost identical in fields. It's just like the title is something else you want in it, and I just have an option of doing this display, like, in an accordion or tabs or just walk mode of this display. But some of these other things, The views reference doesn't exist in 7 and it drives me nuts. And so this is the crazy part. Oh yeah? Because I used the block reference and then I created all the blocks and view blocks. But I can't pass an argument and I was trying to even put in my own argument field. And I haven't been able to get it to work properly so I got to create a field called argument in the bundle. And so they can pass an argument into it and I just can't get it to work. Because it drives me nuts and they can't pass an argument into it. So when I saw that I was like, what? I need that.