@pdureau Yes I think that would be helpful to indicate for newcomers or non-backend folks how they meant to use for Using your component through a render array → , if that isn't meant to be done in a theme. AFAIK everything that was supposed to go with an SDC is supposed to go in the theme in the same folder as the component, or at least done in the theme. But I don't think it's best practice to do any of that in a theme?
While continuing my quest to slowly implement SDCs, I think it would also be beneficial in the docs to include actual real-world examples of using SDCs as @pdureau has done above. On Using your new single-directory component → , all but one ( the embed example → ) use hard-coded values in the props and slots. I think most of us are going to be wanting examples of how to get data from fields into those, and folks that are more frontend (🙋🏻♂️) are going to be struggling to figure out how to do that. Nowhere on the page does it mention how to do that (the only ways I know of are to install Devel/Kint, and just recently learned of Xdebug and have been trying to get it working in VScode).
So far, the only ways I know of to get data out of Drupal and into these SDCs are:
- code the variable in an .html.twig file (e.g.,
content['#block_content'].field_name.0.valuein a block.html.twig to get a prop value w/o the render bits) - some kind of render array magic, I guess through preprocess functions in your .theme? How else would you use this method → ?
- utilize a contrib module that handles displaying the SDCS, such as SDC Display → , UI Patterns → , and the upcoming Experience Builder →
Are there other ways I'm not aware of? If so, they should be documented. If someone can help me answer these questions, I will try my first time at editing docs on here over the Christmas break. :)
I just saw this issue and wanted to mention: please don't rely that people will only be using Twig to render variant types. There are some of us who will be using Web components (done in e.g., Lit, FAST) for our SDCs and so will be making use of a variant prop to select the variant, and that is expecting a string value of the variant name (e.g., primary, secondary, etc.). The JS and constructed styles of the Web component will be the thing that determines how the variant will look, what slots each variant has, etc., the my-component.twig will only be to print stuff out into appropriate props/slots of the Web component. Similar to how I see in XB they're using the Shoelace components.
Introducing something like this:
{% embed 'my_theme:cool-component' with {
'#variant': 'my-variant-name',
prop1: 'foo',
prop2: 'bar',
} %}
With the #variant prop seems to be introducing a Drupalism into a Web component that may be used elsewhere outside Drupal (that is, no other props will start with #).
As long as I can do this instead:
{% embed 'my_theme:cool-component' with {
variant: 'my-variant-name',
prop1: 'foo',
prop2: 'bar',
} %}
By pulling the string value from #variant or any other method proposed I will be good though!
Thanks @pdureau! Very helpful info. Hopefully we can get some more eyes on this issue to get some more feedback from others who have been/are interested in starting to use SDCs.
Excellent, thank you @pdureau! I know you have extensive experience working on components, SDC, and design systems. Thanks for sharing your insights on here, hopefully we can get these into the docs so others like me won't be confused and we can move towards some best practices.
I'll remove the attributes prop from my components. Also, do you have examples of how you're using SDCs? I downloaded UI Patterns, but there are no SDCs in there as examples. Or if you can direct me toward how you mean with using include rather than embed? I don't get how I can do slots with include and again, the docs only say use embed with slots.
I'm very much in favor of these updates! Your help on Drupal Slack a while back related to using node/user/paragraph rather than content for props was super helpful but that isn't anywhere in the docs IIRC.
Would you also say that doing this:
attributes:
type: Drupal\Core\Template\Attribute
title: 'Attributes'
description: 'HTML attributes to apply to the component.'in the component.yml is incorrect? Because I see that being done in Umami components, and in Experience Builder components. In my own components, I am noticing some bleeding in from the parent template when then doing adding the attributes prop and doing something like:
<msu-header{{ attributes }}>....</msu-header>
Where if I include that component in my region--header.html.twig, it inherits the attributes from the parent div. If I try to use the 'only' keyword, like this:
{% embed 'msuext:msu-header' only %}
... content here ...
{% endembed %}then I cannot include slots/blocks that aren't explicitly included in the Twig template.
dalemoore → created an issue.
Yeah, this isn't really 'fixed' per se, probably 'works as designed'. I'm running into this issue as well. I think the only alternative is to just not use this module and use |render|striptags|trim. :\ Unless the solution from SDC Display that was mentioned here can fix?: https://www.drupal.org/project/nomarkup/issues/3405446 ✨ Option to remove twig debug mark up Active
dalemoore → created an issue.
I can confirm the patch in this issue fixes the issue for me thus far.
Agreed, I can't figure out how to edit the title_attributes and content_attributes. I would think they'd be added to the YAML same as the attributes one, on the same level, but they don't appear in the block edit form.
Also, I noticed if you add "ID" to the attributes, save, and then edit the block's ID, then go back and remove the ID and save, it no longer has an ID at all. I'd think it would fall back to the ID it had before, but that may be a limitation of this YAML-based method.
I'm in favor of consistently including the leading slash, I just noticed that in this new site I am working on I've included it in some patterns and excluded it in others. As long as it silently adds it on save but continues to work for existing patterns without (or maybe updates existing ones on sav of the Patterns page, or in a module update hook) it sounds like a nice feature to improve consistency.
Like @mandclu, I've tested the MR!156 in Group 3 and it works! Though I only tested it on content that belongs to one group. Next up: to see if I can create a path based on a Group Content Menu...
I'm curious about the future of Admin Toolbar/Toolbar as well with work on Navigation in Core. There is also a submodule called "Navigation Top Bar" that isn't yet feature-complete that will offer the navigation at the top, not on the left. What Navigation can do is more advanced than what Toolbar can, allowing to add blocks into the nav area.
Ran into the same issue. composer require again variationcache and then run all updates (backing up first!), then uninstalling variationcache seems to work fine so far. But this is a new site and I haven't yet done anything with Group, so who knows if all is well.
Hi @smustgrave, that issue doesn't fully solve the issue that this issue brings up. While it will return something that isn't 200x113 if you set a maxwidth and maxheight, it only does so for the <video>. The enclosing iframe will create black bars around the video depending on the width of the viewport or width of the container the iframe is in. It's definitely better than before though!
Now that #2966656 ✨ Negotiate max width/height of oEmbed assets more intelligently Needs work is in, I think maybe the issue is the styling of the iframe's aspect ratio.
From what I can tell the only CSS that gets added by default to the iframe is:
.media-oembed-content {
max-width: 100%;
border: none;
background-color: transparent;
}
That max-width: 100% keeps the iframe from breaking out of its container, making it responsive, but does nothing for maintaining the aspect ratio. If you have a 16/9 video and shrink your browser down to a mobile width size, the video becomes a square. It will still play the video itself at 16/9, but there will be two huge black bars on top and bottom. Ideally, those won't be there.
Using CSS like in #3 won't work as that will affect ALL oEmbeds, such as podcast players, 3D models, etc. Anything that can be embedded via oEmbed by the oEmbed Providers module for example. I tried it and had a too tall Podbean player.
I tested a YouTube embed in WordPress, both a 16/9 one and a different video (https://www.youtube.com/watch?v=UDIQwGb-4YQ) that isn't 16/9, but it looks like WP always embeds at 16/9 and you're just stuck with black bars. So maybe that's the answer here, you'd just need to deal with it in your theme. But if we could manually choose what we want the video's aspect ratio to be, on a per-video basis, that would be great. I'm not sure how to do that though.
For the record, changing the above code to this:
.media-oembed-content {
max-width: 100%;
border: none;
background-color: transparent;
aspect-ratio: 16/9;
height: auto;
}
will get rid of the black bars, but then you're hard-coding the aspect-ratio for all oEmbeds. which isn't good. The only thing I can think of is a field on the media item that lets you select an aspect ratio, and then it will add CSS classes (or inline styles) to the media item somehow. 🤷🏻♂️
So is this issue considered closed and what's linked by @imclean is the solution (setting a maxwidth and maxheight manually in the field display)?
FYI, the solution in #62 should not be the solution, as this affects all oEmbed iframes. I tested it out and my Podbean oembed was sized to 16/9 so there was now a huge whitespace gap up under the podcast player. May work fine for YouTube videos that happen to be 16/9, but not all videos will always be 16/9.
For anyone who may wonder about this and why there is no "expert", @entropea is using the Display Suite contrib module here. Just FYI.
It seems like many websites use the idea of "pin" as mentioned previously, I'm +1 on renaming it "Pin to top of lists" or similar.
Just encountered the same error message when adding a new view mode to the Document media type; paired the allowed list in the field to "txt, rtf, doc, docx, ppt, pptx, xls, xlsx, pdf" and it bypasses for now.
I have written a tutorial that explains the steps to add Smart Date to an existing site's event system, which may be more what you need.
I just ran into this same issue, and the link goes to Schema.org Blueprints. A Google search isn't returning anything helpful. Can you link the tutorial here?
I wonder where this fits now that we have SDC, and Experience Builder is in early development?
Just tested—working for me! This just made my day for reals.
Screenshots below.
Very much in favor of this! It makes not only seeing the site hierarchy much easier and quicker, but you can also drag and drop the components in the view in a much more user-friendly manner. It doesn't work that way in Figma though unless you have auto-layout turned on.
Here's WordPress' implementation:
dalemoore → created an issue.
I don't see why we can't just stick with "Drupal" for the new product name, but refer to it as "Drupal CMS" under the hood/as developers, and "Drupal Core" for the framework/version with no extra modules/themes/recipes/whatever added. Basically what we already do?
WordPress refers to itself as "WordPress Core" for the version with no other themes and plugins installed. See here for WordPress Core. ("Never edit WordPress Core!") But generally, just "WordPress"...
If you mouseover "core" in the link, it says:
Core is the set of software required to run WordPress. The Core Development Team builds WordPress.
That sounds like the equivalent of Drupal Core.
If it works for WordPress, the most-used CMS in the world, don't see why not also for Drupal?
Either just "Drupal", or "Drupal CMS", are the only two options that make sense. The only other thing I can think of is "Drupal XP" for Experience Platform, so that we can abbreviate it "DXP", same as digital experience platform.
I am running into the same issue. I set up two DDEV instances, one as a "test" instance, and the other as my hopefully final site after testing Group. The first time I enabled the module via Drush and had no issues. This time I decided to install it via the UI and was immediately met with the 'The "group_relationship_type" entity type does not exist' error.
I'm running into this issue after just installing Group. Tried to go and create my first group following the docs and immediately get the error. And now I get it any time I go to /admin/group.
The website encountered an unexpected error. Try again later.
Error: Call to a member function getPluginId() on null in Drupal\group\Entity\Storage\GroupRelationshipStorage->getEntityClass() (line 93 of modules/contrib/group/src/Entity/Storage/GroupRelationshipStorage.php).
Drupal\Core\Entity\EntityFieldManager->buildBundleFieldDefinitions('group_relationship', 'microsite-group_membership', Array) (Line: 353)
Drupal\Core\Entity\EntityFieldManager->getFieldDefinitions('group_relationship', 'microsite-group_membership') (Line: 1219)
Drupal\Core\Entity\Sql\SqlContentEntityStorage->loadFromDedicatedTables(Array, ) (Line: 503)
Drupal\Core\Entity\Sql\SqlContentEntityStorage->mapFromStorageRecords(Array) (Line: 428)
Drupal\Core\Entity\Sql\SqlContentEntityStorage->getFromStorage(Array) (Line: 394)
Drupal\Core\Entity\Sql\SqlContentEntityStorage->doLoadMultiple(Array) (Line: 312)
Drupal\Core\Entity\EntityStorageBase->loadMultiple(Array) (Line: 84)
Drupal\group\Entity\GroupMembership::loadByUser(Object, NULL) (Line: 68)
Drupal\group\GroupMembershipLoader->loadByUser(Object) (Line: 58)
Drupal\group\Access\IndividualGroupPermissionCalculator->calculatePermissions(Object, 'individual') (Line: 138)
Drupal\flexible_permissions\ChainPermissionCalculator->calculatePermissions(Object, 'individual') (Line: 41)
Drupal\group\Access\GroupPermissionCalculator->calculateFullPermissions(Object) (Line: 40)
Drupal\group\QueryAccess\GroupQueryAlter->doAlter('view') (Line: 150)
Drupal\group\QueryAccess\QueryAlterBase->alter(Object, Object) (Line: 336)
group_query_entity_query_alter(Object, NULL, NULL) (Line: 545)
Drupal\Core\Extension\ModuleHandler->alter('query', Object) (Line: 495)
Drupal\Core\Database\Query\Select->preExecute() (Line: 503)
Drupal\Core\Database\Query\Select->preExecute() (Line: 520)
Drupal\Core\Database\Query\Select->execute() (Line: 266)
Drupal\Core\Entity\Query\Sql\Query->result() (Line: 84)
Drupal\Core\Entity\Query\Sql\Query->execute() (Line: 316)
Drupal\Core\Entity\Query\QueryBase->initializePager() (Line: 245)
Drupal\Core\Entity\Query\Sql\Query->finish() (Line: 83)
Drupal\Core\Entity\Query\Sql\Query->execute() (Line: 161)
Drupal\group\Entity\Controller\GroupListBuilder->getEntityIds() (Line: 88)
Drupal\Core\Entity\EntityListBuilder->load() (Line: 241)
Drupal\Core\Entity\EntityListBuilder->render() (Line: 141)
Drupal\group\Entity\Controller\GroupListBuilder->render() (Line: 23)
Drupal\Core\Entity\Controller\EntityListController->listing('group')
call_user_func_array(Array, Array) (Line: 123)
Drupal\Core\EventSubscriber\EarlyRenderingControllerWrapperSubscriber->Drupal\Core\EventSubscriber\{closure}() (Line: 627)
Drupal\Core\Render\Renderer->executeInRenderContext(Object, Object) (Line: 124)
Drupal\Core\EventSubscriber\EarlyRenderingControllerWrapperSubscriber->wrapControllerExecutionInRenderContext(Array, Array) (Line: 97)
Drupal\Core\EventSubscriber\EarlyRenderingControllerWrapperSubscriber->Drupal\Core\EventSubscriber\{closure}() (Line: 181)
Symfony\Component\HttpKernel\HttpKernel->handleRaw(Object, 1) (Line: 76)
Symfony\Component\HttpKernel\HttpKernel->handle(Object, 1, 1) (Line: 58)
Drupal\Core\StackMiddleware\Session->handle(Object, 1, 1) (Line: 48)
Drupal\Core\StackMiddleware\KernelPreHandle->handle(Object, 1, 1) (Line: 28)
Drupal\Core\StackMiddleware\ContentLength->handle(Object, 1, 1) (Line: 32)
Drupal\big_pipe\StackMiddleware\ContentLength->handle(Object, 1, 1) (Line: 106)
Drupal\page_cache\StackMiddleware\PageCache->pass(Object, 1, 1) (Line: 85)
Drupal\page_cache\StackMiddleware\PageCache->handle(Object, 1, 1) (Line: 53)
Asm89\Stack\Cors->handle(Object, 1, 1) (Line: 48)
Drupal\Core\StackMiddleware\ReverseProxyMiddleware->handle(Object, 1, 1) (Line: 38)
Drupal\tracer\StackMiddleware\TracesMiddleware->handle(Object, 1, 1) (Line: 51)
Drupal\Core\StackMiddleware\NegotiationMiddleware->handle(Object, 1, 1) (Line: 36)
Drupal\Core\StackMiddleware\AjaxPageState->handle(Object, 1, 1) (Line: 51)
Drupal\Core\StackMiddleware\StackedHttpKernel->handle(Object, 1, 1) (Line: 704)
Drupal\Core\DrupalKernel->handle(Object) (Line: 19)
Are these the same templates that will be offered in the CKEditor 5 Plugin Pack from CKSource → ? It's a premium feature in standalone CKEditor 5 but will be free via the Drupal module.
I was exploring this module and discovered it didn't support U.S. counties as well. This would be a great feature for using the module for local, regional, and state entities as well as some university units like where I work. A lot of our work is county-based at land-grant university Extension services. It would also be useful for sites related to voting, as people are restricted to only voting within their specific state, county, and city. County is missing in that scenario here.
Just tested, and working great with no error! Thanks for the fix.
dalemoore → created an issue.
I wonder if it would be possible to take a page from Layout Builder Component Attributes → and have a different setting in the contextual menu just for the block style settings? If you have that module enabled, for a block you get four options:
- Configure
- Manage attributes (this is the menu item the module adds)
- Move
- Remove block
Then you could continue to edit the block content through "Configure", which will open in a modal window, but control the Bootstrap Styles under a separate link within the contextual menu so that they're in the right-hand tray not the popup.
Thanks! Yes, that fixes it!
I guess I didn't think of that because I want the user to be able to select from options that are labeled meaningfully, so I wanted "Full content" or "Layout Builder" (really the full view mode, which is the only one Layout Builder overrides work with currently ✨ Consider supporting Layout Builder Overrides for other view modes Needs work ) to be an option they can select. Hence the making it required and wanting the "Full content" option to be selectable under "View modes allowed to switch to", so there would be no option "- No change -" which I felt was confusing. Could I perhaps configure what that "no change" option says on a per-field basis, even if in code? Maybe it could be added in the form display widget?
Thanks!
Here is a detailed description. This is on the standard profile 'page' content type.
Manage fields
- I've added a view mode switch field labeled "View mode" with machine name "field_view_mode".
- Under field storage, "view modes to switch", the only view mode selected is "Default". Full content is not checked because if I check it it removes it from "View modes allowed to switch to".
- The field is set to "required"
- Under "View modes allowed to switch to", I have selected:
- Full content
- Standard
- Teaser
- Under default value, I have it set to "Full content".
That's it for the field setup.
Manage form display
The field is just setup with the defaults here.
Manage display
- In custom display settings, I have enabled "Full content", "Standard", and "Teaser" view modes (Standard is a view mode I manually created).
- I have "Use Layout Builder" and "Allow each content item to have its layout customized" enabled on the Default view mode.
- On the Standard view mode, I don't have anything Layout Builder enabled, just the normal field/label/format view.
So I just did a little testing with Twig debugging enabled.
If I only use this module, and I inspect the source code, the Twig suggestions for the node.html.twig never change on the Layout Builder-enabled content type. No matter what I select in this module's field dropdown, I always get this:
<!-- FILE NAME SUGGESTIONS:
* node--281905--full.html.twig
* node--281905.html.twig
* node--page--full.html.twig
* node--page.html.twig
* node--full.html.twig
x node.html.twig
-->If I instead enable Display Suite's view mode switcher and change it to a different view mode, the Twig suggestions are updated to the new view mode's name.
<!-- FILE NAME SUGGESTIONS:
* node--281905--standard.html.twig
* node--281905.html.twig
* node--page--standard.html.twig
* node--page.html.twig
* node--standard.html.twig
x node.html.twig
-->dalemoore → created an issue.
I was banging my head against the wall trying to figure out why these weren't working on a new site I'm working on, having the same issue I was having last year in No other token format available or accepted besides the default one 🐛 No other token format available or accepted besides the default one Fixed , this fixes it for me for now. Trying to use the tokens in the URL for the same as before.
I co-sign this suggestion. Right now they're just floating there in the layout-builder--section div and it's not possible to contain them both to, for example, maybe give them an appearance of being within a tab or something.
I would be interested in where this is headed too. I'm about to embark on redesigning our "flagship" website and picking something, whether it's Layout Builder, Layout Paragraphs, or some new thing that we can be sure will be around for a while would be helpful. WordPress has mostly moved to the Block Editor/Gutenberg, if we could standardize on something (while still allowing others to go their own way) it would help a lot of us on small (or, er, mostly one person >_>) teams.
I would be interested in this, too! It was very helpful in D7 to be able to test the data without having to run the import and get errors.
Any update on this? Would like to upgrade a site from 9 to 10.
Any chance of getting this looked at? Both Drupal 8 and 9 are now EOL.
Thanks @larowlan. That gives me some sense of relief. I was afraid we were really just getting started with LB in my org only to have to change to something else.
I can say whatever gets us closer to what’s possible in Gutenberg/Block Editor in WordPress I’m 💯 in favor for!
Is the Decoupled Layout Builder intended to replace the current Layout Builder, or is it its own separate thing and there would be no upgrade path for it or anything like that (basically those of us creating sites with LB must start over)? Where does recently created things like SDC fit into it? Since SDC relies on Twig templates. Is this new DLB abandoning Twig in favor of React? I have questions 😅
Is this why I'm getting these errors when running ddev yarn storybook? (total n00b at Storybook, DDEV, Docker, etc.)
🚨 Unable to index files:
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.yml: Duplicate stories with id: cl-components-examples-banner--4-with-card
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.json: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--2-no-image
WARN - ./web/modules/contrib/sdc_examples/components/my-banner--tall/my-banner--tall.stories.json,./web/modules/contrib/sdc_examples/components/my-banner/my-banner.stories.yml: Duplicate stories with id: cl-components-examples-banner--3-with-body
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.json: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.json: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/components/my-button/my-button.stories.yml: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-card--light/my-card--light.stories.json,./web/modules/contrib/sdc_examples/components/my-card--light/my-card--light.stories.yml: Duplicate stories with id: cl-components-examples-card-light--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-card/my-card.stories.json,./web/modules/contrib/sdc_examples/components/my-card/my-card.stories.yml: Duplicate stories with id: cl-components-examples-card--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-cta/my-cta.stories.json,./web/modules/contrib/sdc_examples/components/my-cta/my-cta.stories.yml: Duplicate stories with id: cl-components-examples-call-to-action--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.json: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.json: Duplicate stories with id: cl-components-examples-button--2-like
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--1-default
WARN - ./web/modules/contrib/sdc_examples/components/my-button--primary/my-button--primary.stories.json,./web/modules/contrib/sdc_examples/sdc_examples_replacements/components/my-button--primary/my-button--primary.stories.yml: Duplicate stories with id: cl-components-examples-button--2-likeWhat does “Full” even mean? I know when you go to the screen you can tick the “Full content” box and give it its own view mode settings, but I’ve hardly ever done that. Not sure what “full content” means here. Is it all available fields? Doesn’t seem so. I’d love some context behind why it exists.
To me it makes sense to do the opposite, get rid of Full and keep Default. I have rarely ever enables the Full content view mode personally, instead using the Default and creating new view modes as needed for teaser, cards, whatever. Makes more sense to me to have a Default view mode, which is a fallback when no other mode applies and is the “standard view” for that content type.
Actually, sorry, I spoke too soon. While this fixes the ability to "place block" with Block Paragraphs installed/enabled, you can't actually place any paragraph blocks with Layout Builder Browser except "globally"... so while you can pick from some existing Paragraph Blocks at /admin/config/content/layout-builder-browser (see screenshot), it can't be done on a node-by-node basis where it will show whatever paragraphs have been created for that node in the browser. It doesn't use the admin title at all, either. This probably requires some extra code to integrate PB with LBB. Not sure if that's something the maintainers are interested in.
Gotta love those one-line fixes! 100% working now for me. Thanks @viren18febS!
dalemoore → created an issue.
I think maybe what this person is asking, or at least what I am, is being able to create inline custom blocks like you can within Layout Builder but within the Gutenberg block editor. It seems like you can only add reusable custom blocks right now (those that exist within the Custom Block Library), not one-off custom blocks. I could be wrong though!
Would someone mind putting together the steps needed to get all these patches working on D10.1+ so that the Bootstrap Styles/Bootstrap Layout Builder works in D10 if it's working for you? I haven't been able to get any of it to work.
Co-signed on this. We can't use this module without being able to provide alt text for the preview image for accessibility due to federal requirements. Looking into whether it can be added through custom code or whether to use a different module right now, but other than that, this module is great.
Yep, you're right as I just discovered. 😂 This happens to me so often... I'll try and try to figure something out, finally give up, find a post somewhere with a similar problem, post... then minutes later, figure out something. I wasn't going to use Views, but Views works, so Views it is.
I'd be interested in this as well. My use cases are for scholarships and awards. I want to be able to use a Paragraph of "Award" with a field of year (date) and a field for the award (a content type, Award). Then use CER to create a two-way relationship, so that on my Person content type I can add an Award paragraph with the year and award(s) that individual won, but also on the dedicated award's page list all recipients of the award and the year won. There may be a way to do this w/o CER + Paragraphs but using Paragraphs makes it much more easier to add it to the Person content only when needed.
I ran into the same problem trying to add multiple projects to test. Your method of adding that empty patch seems to work, but it isn't documented on the page or anything.
I'm currently doing a review of this module to determine if I want to use it for my own new website (I'm about to start on my Ph.D. dissertation and am building a place to document the process!), or try to roll my own custom built solution, and so far the only hangup I have is that dates don't use proper Drupal date fields. Other than that, it's an amazing body of work. Are there still issues with dates like this? I wish we could capture the day along with the month and year for publication date, for instance, if that info is available. I haven't tested how this module interacts with Views, but I am hoping that we can setup filters to filter them by date as well wherever needed, and choose per bundle what date format we want. I remember in the past having difficulty with that in Views when dates are text fields...
Hi @prauat, I'm on D10.0.9 and Bootstrap Styles 1.1.0 and Bootstrap Layout Builder 2.1.1. The issue is highly likely to be PEBKAC, but I can't figure out what the issue is. Having the "Fix not loading bootstrap_styles/aos.local or bootstrap_styles/aos.remote library" along with "[Drupal 10] Change of JS jquery/once to drupal core/once, migrate JS API." and "Fix Module does not work in D10" issues, at the least.
In my composer.json:
"patches": {
"drupal/bootstrap_styles": {
"3315218: Fix not loading bootstrap_styles/aos.local or bootstrap_styles/aos.remote library.": "https://www.drupal.org/files/issues/2023-01-25/3315218-17--1-0-x.patch",
"3330458: [Drupal 10] Change of JS jquery/once to drupal core/once, migrate JS API.": "https://www.drupal.org/files/issues/2023-03-07/bootstrap_styles-3330458-8.patch"
},
"drupal/bootstrap_layout_builder": {
"3335356: Fix Module does not work in D10": "https://www.drupal.org/files/issues/2023-01-25/issue_3335356_drupal10.patch"
}
},I can't get any of these patches for Bootstrap Styles and Bootstrap Layout Builder to apply in Drupal 10 and the module is just broken. Have they been tested with D10 10.0.9?
Maybe it works, I don't know, I can't install it because I can't composer require it in Drupal 10 to begin with. Wondering if this is maintained any more? There hasn't been a release since 2020.
Thanks. The updates were already performed so I don't know that I can test, but I applied the one-line fix and tried running updatedb and no errors.
dalemoore → created an issue.
I'm looking for this feature as well. I'd like to restrict the summary to a specific text format, e.g., allowing B, I, and a link maybe or something like that. No images or other things. Some content types might be fine plain text only while others would need a little more formatting. I could have sworn I had a way of doing this in Drupal 7 but can't remember how I did it/what contrib module or if I hallucinated it being possible. 😅
+1 on #17 fixing for me in D9.
+1 for this. Going to use https://www.drupal.org/project/textarea_widget_for_text → (well about to test to make sure it does what I want!) for now but being able to create headings for custom blocks and limit the buttons that can be used in CKEditor to
I was trying to find a solution for this, too. Too bad Microsoft doesn't seem to provide an easy way to go about it. It would be great if they could just paste a URL in a field and have it generate the embed like YouTube, etc... but it's not using OEmbed.
This is an example of a document for a test I uploaded to our university OneDrive (with my personal email/other info MASKED):
iframe:
<iframe src="https://OUR-DOMAIN.sharepoint.com/personal/USERID_UNIVERSITY_edu/_layouts/15/Doc.aspx?sourcedoc={834d233d-4a56-40fe-98e4-de62afe4bfcd}&action=embedview" width="476px" height="288px" frameborder="0">This is an embedded <a target="_blank" href="https://office.com">Microsoft Office</a> document, powered by <a target="_blank" href="https://office.com/webapps">Office</a>.</iframe>
link:
https://OUR-DOMAIN.sharepoint.com/:w:/r/personal/USERID_UNIVERSITY_edu/Documents/PhD/Do%20it%20now.docx?d=w834d233d4a5640fe98e4de62afe4bfcd&csf=1&web=1&e=J8JhTN
The sourcedoc value seems to match but has dashes in one and not the other, who knows what they're breaking it on.
Very similar to Chris' above, but different in subtle ways that would be impossible to use.
For anyone else looking for this in the future, you can install Devel and go to /devel/routes
Same question. I just now noticed that new button and was confused where it came from. I thought maybe it was somehow sneaking in what this issue does: https://www.drupal.org/project/drupal/issues/3338369 ✨ Layout Builder - Add a refresh layout defaults feature Needs review
Sounds great! I wasn’t worried since this (D7) site will be merged into our new D10 site but figured I’d pop in and advocate for those who do use it just in case. Thanks!
I’m not sure how this works, can’t see the code, and I’m on my phone, but just wanted to add that /admin/structure is not a guaranteed path since there are modules that can rename the admin path → . I maintain a site where the previous developer used it to rename it from /admin/ to /backend/ presumably because the previous non-Drupal site used that path.
I am looking for something like this as well. I recently built two sites with WordPress (not my call 🤷🏻♂️) after not touching the CMS in 5+ years and made use of their new Full Site Editor experience. It was a bit frustrating at first but worked. The idea of a "block theme" combined with template parts, which I would equate to theme regions in Drupal, but also template blocks seems like could be possibly done. It would probably require nesting of sections I guess? There are several other issues open related to section nesting/dynamic layout regions...
#53 looks amazing! You’re awesome Wim. That’s exactly what I was picturing it would work like in your demo. 😍
Re: the title attr, I don’t use it often either, but I have seen in the past it used by some sites to generate a clickable tooltip for different things using JS. I don’t think I’d ever do that personally, but that’s one use case for it.
Looking to get this working in a new Drupal 10 site moving from Drupal 7. Can one of the maintainers take a look?
Ergh, linked to the wrong thing above and it won't let me upload the image by editing... adding here :D
#35: I wasn't aware of CKEditor Entity Link tbh, I used CKEditor Link + User + File in D7 and (sadly) most of our sites are still on D7. When we started working to convert stuff to D8+ it seemed like Linkit was the way forward due to the sheer numbers of users it has so I've been trying to use it. (I work at a university with a small Drupal dev team... well, actually, the dev team is, uh, me... everyone else works on non-Drupal 😅).
Re: whether we're all saying the same thing in #27-29, I think so. My use of CKEditor Link File is also due to its ability to choose which method you want to present the link, either as a link to the entity (/media/id), as a path to the file (sites/[site]/files/file.pdf), or as a forced download link. My main complaint with CKEditor Link File though was that it was an all-or-nothing setting, you could choose from three link methods: File, URL, or Download and that applied universally to all files linked in CKEditor. You couldn't configure it per-link. 😢 I think that is the feature that we in #27-29 are requesting, and this may be possible already in Linkit.
#39: I think adding an additional "Download" toggle similar to the "Open in new window" toggle in this screenshot might work, but as you mention it also allows for the download of non-Media things. Not sure if that could "automagically" appear if they select Media only and go away if not.
#40: I think "Content links" works IMO, I'm not sure of any term more generic than that other than "internal link." I could go either way with content links or internal links. Thinking like a content editor, I'd say either one works, I'd assume that "internal link" means any type of link on my site (whether it be a node, media, paragraph, etc.). CKEditor Link uses the term "internal path" and I've had no confusion from editors about what that is.
in the screenshot above, internal path: any link to a file, user, node within Drupal. URL: external links (with the option to choose http:// or https:// protocol from select dropdown, but if you manually type it in there it selects it for you)
Trying to read through these issues and understanding what this is doing a little better. This is confusing:
Themes and modules can replace components provided by other themes and modules.
Themes can replace a component by using replaces: my-theme:my-component in the component metadata. Themes can replace components provided either by modules or by themes which they extend. Note that when Drupal encounters my-theme:my-component it my use a component defined in my-other-theme if it replaces the component.
Modules cannot replace components provided by themes or other modules.
Can modules replace components from other themes or modules, or not? The first and last sentences contradict each other. Thanks!
Just ran into this issue as well. Not deleting my page, so my unused block type will have to remain for now. Deleted the block from the page, deleted all the fields from the block type, ran cron, nothing will allow me to get rid of it. :\
@ultimike I'm referring to this part:
<li role="presentation" class="{% if loop.first %}active{% endif %}"><a href="#{{ paragraph_id }}-{{ key + 1 }}" aria-controls="{{ item['#paragraph'].bp_tab_section_title.value }}" role="tab" data-toggle="tab">{{ item['#paragraph'].bp_tab_section_title.value }}</a></li>
If that part is working, when the page loads the first tab should be active and its tab panel should be shown. If it's not working, then no tab panel will be visible until you first click one of the tabs. For me, using the code you have works to make the tabs work, but the first tab and its panel aren't shown on page load because the "active" class isn't being applied.
@ultimike does the loop.first not work for you too? I am using that same method, but the loop.first doesn't make the first tab active on page load. Wondering if it's something in my code or if not working for you as well?
It looks like it just uses the visually-hidden class to hide the pencil icon and removes that class on hover. Could we just always show the pencil icon instead, but set it to a low opacity (0.25-0.5) by default and on hover/focus it is opacity: 1? The little pencil icon doesn't take up much real estate and floats over everything as-is. I have more of an issue with that all block configuration happens in the sidebar. To me, only the section configuration should happen in the sidebar, and the block should popup in a modal. There's usually not enough room in that tray to edit fields.
The problem seems to be from the introduction of this filter:
{% for key, item in content.bp_tab_section|filter(key => key|first != '#') %}
combined with
#{{ paragraph_id }}-{{ key + 1 }}
I don't think that filter does what it's supposed to do in Drupal 10. Before it was written like this:
{% for key, item in content.bp_tab_section if key|first != '#' %}
But that won't work in Drupal 10, either.
And you can't just break up the for and if statements like this:
{% for key, item in content.bp_tab_section %}
{% if key|first != '#' %}Because loop.first isn't working either. There are tons of other things in that array that start with #.
Thanks, that's helpful to see how it worked.
I couldn't get signing up for Drupal Slack to work before (though I'm a new Slack user). It required either a Google or Apple account or an @association.drupal.org email. The "Continue with Google" method wouldn't work. But I found the link under "Joining" here → and was able to create an account on there. Thanks.
Hi @larowlan, the video you've linked to twice on here isn't viewable. It looks like you have to be part of the Drupal Association Slack? Can you repost the video so we can see how your dynamic tabs works?
I would echo what the two above have said. If we can replicate what CKEditor Link → and CKEditor Link File → did in Drupal 7 in core, it would be freakin' amazing. Right now the CKEditor 5 dialog just presents a popup for the editor to enter a URL, but expecting them to go and hunt down a URL and paste it in there is expecting way too much. Additionally, if the title is updated or some other change is made to the alias, they'd have to go in and update it manually everywhere! A nightmare for sure. This is a great initiative to get Linkit functionality in core!
After thinking this through some more, there actually isn't really a "default Layout Builder region". There is usually one created when you create a content type, but you can just delete that and create your own. So there would be no way to assign automatically-created blocks to one because the module wouldn't know what to assign it to, unless it just assigned them to the first section within Layout Builder regardless of what is in it. There are default regions within sections, though. But I'm not sure even that would be worthwhile behavior, because then you'd have to go in and drag and drop the blocks where you actually want them to go—unless a layout could have a "draft" state where they get added to that.
If someone knows a way to solve this, great! If not, I guess can close as works as designed...
Seeing this too.
If you add a paragraph, then view the node, the paragraph will be there. However, if you go into the Layout Builder, it won't be until you save and then reload Layout Builder.
However, if instead you add a paragraph, go into Layout Builder, and revert to default WITHOUT saving, it will actually remove the paragraph you added to the node! So it actually causes data loss if you don't go to the Layout Builder and save immediately after adding a paragraph and decide later to revert to defaults.
I hope to experiment with this soon. Definitely interested! I have yet to make a component/design system but it's on my radar to start on it for my organization. I think this would work better to start in contrib first to make sure there's enough interest in it. I don't have enough experience or knowledge yet (I haven't used Storybook but it looks awesome!) but tying a core system to something like Storybook that may go away could be tricky. Then again you have CMS like WP going all-in on React.
I like that this system allows you to make the components through modules though. I wouldn't want them to only be possible in the theme. I'd rather be able to activate components one-by-one and have them re-usable across themes. But, still allow "the Drupal way" to have the theme override the module's component. From what I've read this does that?
Darren is right, I messed up applying the patch. It does work now! Awesome, thanks Martin. :) (BTW, love your MotW portion on Talking Drupal!)
Hi Martin,
I ran composer update and updated this site so all modules/core is up-to-date. I'm now on Drupal 9.5.4 running Token 8.x-1.11, Smart Date 3.7.x-dev
Applied the patch and it doesn't seem to have affected anything. Tried these tokens/aliases and none work:
events/[node:field_when:0:value]/[node:title]
events/[node:field_when:1:value]/[node:title]
events/[node:field_when:0:end_value]/[node:title]
events/[node:field_when:0:duration]/[node:title]
events/[node:field_when:0:format:year_only]/[node:title]
events/[node:field_when:0:value-custom:Y]/[node:title]
Could you provide what URL format you're using on recurring events that works for you? (I am, of course, going back and re-saving the node to check if the alias updates each time I change it. :))
Same here. Switched in cPanel and back and working, only discovered the error after trying to use drush updatedb in Terminal...
Also as the error mentions, you may can also fix this issue by going into cPanel (if your hosting uses it) and switching from pdo_mysql to nd_pdo_mysql under PHP settings (only enable one or the other). Just ran into this issue myself, no installation of this module required (though nice to know it exists thanks to Google search of the issue!)
This is so awesome, and puts Layout Builder on closer parity with what WordPress can do with locking different parts of the Full Site Editor. I haven't tested this yet but will soon...
dalemoore → created an issue.
dalemoore → created an issue.
Well I just tried it on a completely different (non-live) site, running Drupal 8.9.19, Smart Date/Recurring 3.4.2, and Token 8.x-1.9 and it worked, so it's possibly a problem with this site. Will tinker some more to figure it out...
I just installed the lastest dev (was on stable) and it doesn't appear to have done anything.
I'm attaching some screenshots of my configuration. Maybe I have something configured wrong? When you get a chance if you can confirm if this looks right. Otherwise, maybe something else is conflicting with it. But I'm getting zero errors in the logs now so not sure. But maybe both I and the original poster don't have something configured right.