Is this the END of WordPress HOSTING?
29:00
WP 6.1 NAV BLOCK Features in 5 mins
4:48
[UPDATE] Navigation Editor project
8:12
Пікірлер
@spitsparrow
@spitsparrow 9 күн бұрын
The default mobile experience is stuck in about 2001. How on earth anyone thinks its usable is beyond me. There are also very few plug ins that make it any better. Im trying to get something working for the 2024 theme and its too hard. Why cant it handle a drop down submenu? If there is a drop down sub menu in the actual navigation why would it completely disappear in the mobile menu? Makes absolutely no sense. have you found a way to make the sub menus work in the mobile view?
@lholhofox
@lholhofox 12 күн бұрын
thank youuuu!!!
@lholhofox
@lholhofox 12 күн бұрын
I
@lholhofox
@lholhofox 12 күн бұрын
LOVE
@lholhofox
@lholhofox 12 күн бұрын
YOU
@yudhipratama3178
@yudhipratama3178 Ай бұрын
very helpful!
@DaveOnWP
@DaveOnWP Ай бұрын
Much appreciated. Glad you found it useful.
@itsruqs
@itsruqs Ай бұрын
Very helpful thank you, I've used that block before and didn't remember this solution for this problem lol. Great and easy to follow video.
@DaveOnWP
@DaveOnWP Ай бұрын
Glad it helped!
@steveharmancambridge
@steveharmancambridge Ай бұрын
This feels like *exactly* how menus should be handled in WordPress, Dave. Great job! I'd love to see to you using your plugin to also expand the _styling_ options for menu items as well - basic things currently lacking on WordPress like background colour on hover, background when selected and so on. Thanks
@DaveOnWP
@DaveOnWP Ай бұрын
Great suggestion! I think you're right that extending to these might be a very useful addition to the Plugin.
@yannickmichel2566
@yannickmichel2566 Ай бұрын
awesomeness!!!
@DaveOnWP
@DaveOnWP Ай бұрын
Thank you! Cheers!
@OZTutoh
@OZTutoh Ай бұрын
1:00 I must be a complete idiot here. What is this "List View" topbar you have here? How do you get it?
@DaveOnWP
@DaveOnWP Ай бұрын
No you are not at all. It's my error for not explaining that carefully. To get that "top toolbar" you need to go to the "3 dots" menu which can be seen in the very top right hand corner of the editor interface. Then under the dropdown that appears select "Top toolbar". The "List View" is the sidebar on the left hand side which shows the "tree" of the blocks. That's always opened using the icon I clicked at 1:00, regardless of whether you are using "Top toolbar" or not. I hope that helps? Did the Plugin work for your use case?
@DecimusBurton
@DecimusBurton Ай бұрын
Hi Dave - We have transitions from a WP classic theme to using a FSE block theme on our hobby site BajanThings. Having made the change we are loving the FSE environment. The one NEGATIVE feedback we have had is that the mobile navigation menus are unwieldy. In Astra Pro which was our previous theme we had collapsible sub menus. Are you also looking to add collapsible sub-menus?
@DaveOnWP
@DaveOnWP Ай бұрын
Great to hear you made the jump over to Block based WordPress. > Are you also looking to add collapsible sub-menus? Do you mean where the submenus are "hidden" by default on mobile and then you click / tap to expand them? Personally I think that would be a great feature to add to Core. Especially given that we already have something similar in place for "desktop" menus.
@DecimusBurton
@DecimusBurton Ай бұрын
@DaveOnWP Yes absolutely. Submenus hidden with an arrow that allows you to expand. From what I can discern, it's not something that's on the road map... in my opinion it's the one real negative of using a a FSE theme. Next best thing would be a plugin to fix this short term deficiency...
@yvonneaurelie1343
@yvonneaurelie1343 2 ай бұрын
Unfortunately it doesn't work anymore !
@DaveOnWP
@DaveOnWP 2 ай бұрын
Oh that's not good. What did you see? Would you be open to reporting it as a Gutenberg Issue? github.com/WordPress/gutenberg/issues/new
@scottael
@scottael 2 ай бұрын
Thanks Dave for your work on this. I use another navigation plugin on my FSE sites, so that I can the old way of creating menus. However, all credit to you for addressing one of the main weaknesses of FSE. Excellent video too.
@DaveOnWP
@DaveOnWP 2 ай бұрын
Thank you - appreciate your comments. I'm curious - what makes you use Classic Menus screen in your sites? What critical features are stopping you making the switch? If you're curious here is where we are currently tracking Navigation Issues github.com/WordPress/gutenberg/issues/38275
@Black1991Star
@Black1991Star 2 ай бұрын
It's a bad decision to create another menu in the same section for mobile display. Any SEO specialist will tell you that. You are actually creating hidden links in the text
@DaveOnWP
@DaveOnWP 2 ай бұрын
I appreciate your input here. I'm genuinely curious - are you yourself an SEO specialist? Have you seen this harm sites recently? I took a look into your assertion and found this information for Spam Policies for Google Search: developers.google.com/search/docs/essentials/spam-policies#hidden-text-and-links It states: > There are many web design elements today that utilize showing and hiding content in a dynamic way to improve user experience; these elements don't violate our policies: My reading would be that Google bot is sophisticated enough to distinguish between spam links and those used to provide context specific navigational aids on smaller vs larger viewports. Both elements are marked using the HTML nav element and are labelled accordingly so my thinking is that Google would put them under it's "dynamic" clause. It seems entirely valid to have a navigation overlay which contains elements that we might want to present in the same fashion on larger screens. Is there another way you would propose to implement such a requirement? I'd value any input you would like to provide. Many thanks
@MuhammadAssegaf-yf5sw
@MuhammadAssegaf-yf5sw Ай бұрын
@Black1991Star a hidden mobile menu, if well-implemented and user-friendly, should not negatively impact your SEO. Google prioritize user experience, and a hidden menu can enhance mobile usability without affecting your search rankings.
@zonegraphique
@zonegraphique 2 ай бұрын
Amazing solution Dave thanks a lot, i will give it a try
@DaveOnWP
@DaveOnWP 2 ай бұрын
You are very welcome! Please let me know of feedback here or on Github github.com/getdave/responsive-navigation-block/issues/new
@DaveOnWP
@DaveOnWP 2 ай бұрын
*🔗RESOURCE LINKS 🔗* *Download the Plugin:* ⬇wordpress.org/plugins/getdave-responsive-navigation-block/ *Contribute on Github:* github.com/getdave/responsive-navigation-block *Original video inspiration:* kzbin.info/www/bejne/moqWl2upfch0hqM *Other coverage of this Plugin:* - Jamie Marsland - kzbin.info/www/bejne/moqWl2upfch0hqM
@DaveOnWP
@DaveOnWP 2 ай бұрын
🔔🔔🔔🔔 NEW RESPONSIVE NAVIGATION MENU PLUGIN 🔔🔔🔔🔔 ⬇wordpress.org/plugins/getdave-responsive-navigation-block/ I released a Plugin that implements this technique without the need for custom CSS. Just install and activate.
@To25More
@To25More 3 ай бұрын
Thank you! Solved my issues perfectly!
@DaveOnWP
@DaveOnWP 2 ай бұрын
You are very welcome. Glad it helped!
@DaveOnWP
@DaveOnWP 2 ай бұрын
I have a Plugin which now implements this feature. You can check it out in my latest video: kzbin.info/www/bejne/iGbOq3SXeth3g8k
@Whatreally123
@Whatreally123 3 ай бұрын
I am now using 2024 theme, and making a cusotm header with the Site Logo on the left, Menu in the middle and a Search Bar at the right. The Menu and Search bar close together. Works fine on Desktop view but on Mobile view, the search (if put inside the Navigation block) becomes part of the hamburger icon. But I want it to be displayed all the time, I used 2 columns (1 for the site logo and nav bar) and the other for the Search block. But on Mobile view, the Search bar does come down below the Site Logo and Hamburger Menu but it is big and gap between them is big. I cant adjust the spacing just for mobile, as Core doesn't provide responsive controls. No offence to WP developers but lack of responsive settings is extremely frustrating and limiting. Next version of WP, I'd believe providing responsive controls should be key.
@DaveOnWP
@DaveOnWP 2 ай бұрын
Thanks for outlining the issue. I'd recommend taking a look at this video where I show how you can use different content on Desktop vs Mobile using the Navigation block: kzbin.info/www/bejne/moqWl2upfch0hqM&lc=Ugy0C3DPzeFnTqIeWJV4AaABAg I would also recommend subscribing to the channel because I'm about to drop a video with a link to a new Plugin which implements this exact technique with no code experience required.
@jeosbeavadra9270
@jeosbeavadra9270 3 ай бұрын
Thank so much. Exactly what I was looking for. It's perfect
@DaveOnWP
@DaveOnWP 2 ай бұрын
You're very welcome. I appreciate you letting me know.
@ReflectionRetreat
@ReflectionRetreat 3 ай бұрын
amazing man! thank you so much.
@DaveOnWP
@DaveOnWP 2 ай бұрын
You're very welcome. Glad it helped you out!
@RaphaelKavalan
@RaphaelKavalan 4 ай бұрын
why does this shit doesnt exist as a default feature ffs
@DaveOnWP
@DaveOnWP 4 ай бұрын
Thanks for your comment. WordPress is a big project with many competing priorities. Core contributors are aware this is a desired feature and have been working on possible solutions. However, they have yet to arrive at a consensus. They are always looking for folks to contribute, so if you have time/ability I'm sure they would appreciate your input on the ticket, or even a polite request for this feature to be given some additional priority. github.com/WordPress/gutenberg/issues/43852 Thanks again for taking the time to comment.
@WilliamsAguilar-y7h
@WilliamsAguilar-y7h 5 ай бұрын
Is it possible to work with default wrapper from core blocks. Example, <table> is wrapped around a <figure> tag. Is there a way to change the default's wrapper, change the <figure> for a <div> and change the default class from wp-block-table to something else
@DaveOnWP
@DaveOnWP 4 ай бұрын
I'm not certain but I think if you inspect `props` you'll find the `name` attribute for the block. You'd then be able to conditionally change the wrapper markup depending on the block. Would that work for your use case?
@acidboy2128
@acidboy2128 5 ай бұрын
Man! Thanks sooo much!... do you have any idea on how to get that hamberger menu bigger?
@DaveOnWP
@DaveOnWP 4 ай бұрын
You are very welcome. You would have to add custom CSS for that one as there isn't a way to do that via the interface yet. To do this: - click the "Styles" icon button in the top right hand corner of the editor/ - in the sidebar that pops up in the right hand side click "Additional CSS". - paste the following CSS into that box (adjusting the pixel values as required): .wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg { height: 64px; width: 64px; } I believe that should work in both the editor and the front of site. You could also just add the same CSS to a stylesheet enqueued by a Theme or Plugin rather than using the "Additional CSS" area. I hope that helps.
@jamescallander5773
@jamescallander5773 5 ай бұрын
mobile view doesnt work
@DaveOnWP
@DaveOnWP 4 ай бұрын
Thanks for your comment. Would you be able to elaborate on how it isn't work for you?
@Fran-ls5bu
@Fran-ls5bu 5 ай бұрын
HI! very interesting video. I have two questions: 1 - Do you recommend creating a child theme even if you make very few changes? 2 - If I want to change to another default WordPress theme the content would adapt better? Thank you!
@margacabrera9857
@margacabrera9857 4 ай бұрын
Hi! The answer to number 1 mostly depends on what the theme is for :D If it's a theme just for yourself, you can make your own changes and save them, no problem. They will stay saved on your database and the theme can still update without you losing your changes. If you plan on distributing the theme, you could make the changes to TT4 and rename it (using a plugin like Crate Block Theme makes the process really easy) or you can decide to do the child theme route. I think going for a child theme is useful for block themes when there's a lot to reuse from the main theme, that can be used as a design system. Otherwise the other two options are probably simpler. About your second question, I don't know what you mean by adapting better. Your content will stay, but your template changes won't
@Fran-ls5bu
@Fran-ls5bu 4 ай бұрын
@@margacabrera9857 Very clear! Thanks for the answers! :)
@DaveOnWP
@DaveOnWP 4 ай бұрын
Thank you for the detailed response 👍🏽
@Jsallette99
@Jsallette99 5 ай бұрын
excellent tutorial - love this theme... thanks
@DaveOnWP
@DaveOnWP 4 ай бұрын
Glad you found this useful. Maggie did a great job here and TT4 is a really useful default theme.
@Jsallette99
@Jsallette99 5 ай бұрын
amazing
@DaveOnWP
@DaveOnWP 4 ай бұрын
Thank you!
@codeAlongwith
@codeAlongwith 5 ай бұрын
It would be great if you could show how we might add javascript and css effects in both coding and with a plugin (if necessary).
@DaveOnWP
@DaveOnWP 4 ай бұрын
Yes this is a good idea for a follow up video as it can be extremely confusing. I'll add it to my list of possible videos.
@seosamhhome
@seosamhhome 6 ай бұрын
Hello Dave Please my mobile overlay menu does not open
@DaveOnWP
@DaveOnWP 4 ай бұрын
Hi there. Have you tried using a fresh install with no Plugins active? Does the Navigation block work for you there? Typically if the mobile menu is not working then the JavaScript isn't running which can be due to Plugin conflicts.
@lifeofdifferenceld7484
@lifeofdifferenceld7484 6 ай бұрын
Dave & Maggie I must say this was breathtaking more simplified though a steep learning curve working with Wp Block Theme
@DaveOnWP
@DaveOnWP 4 ай бұрын
I'm really pleased you found this helpful. I agree the new tooling around Block Themes can seem intimidating. The team behind this continues to iterate and hopefully it will continue to improve. Did you manage to build out a Theme or a website?
@moukachafat-al-koloub
@moukachafat-al-koloub 6 ай бұрын
After years of passing through different themes. I have decided to make my last chance with your theme. It looks great and i wish that you enhance it for woocommerce too. It is just awesome theme
@DaveOnWP
@DaveOnWP 4 ай бұрын
Glad to hear you are giving Block Themes a chance. TT4 is a default Theme bundled with WP so it was a community effort with many contributors. As Woo is a Plugin it's unlikely that Core themes will ever officially support it, but thankfully it's going to become ever simpler to adapt themes so hopefully we get some canonical Woo themes in the future. Thanks again for taking the time to comment.
@EyeKahnography
@EyeKahnography 6 ай бұрын
This was brilliant and super helpful! I started using WP this week and your videos have been amazingly helpful.
@DaveOnWP
@DaveOnWP 4 ай бұрын
You are very welcome! Are there any other videos you would have liked to have seen that would have helped during your current learning journey or that would help in the near future?
@CarstenBach
@CarstenBach 7 ай бұрын
Supercool. Thank you both for sharing! This is the type of content I’d like to see far more often. Such content could help engaging people to hop on with contribution, beginning with needed feedback. Please, go on!
@DaveOnWP
@DaveOnWP 7 ай бұрын
Thank you Carsten! It's great to hear this type of content was useful. I'll be looking to reprise it for the next cycle post WordPress 6.6 so look out for that video. Maybe @richtabor will join me again 🤞 As you say, the aim is precisely to encourage contributions and get feedback so I'm hopeful this will spur folks to engage and help shape the direction of WordPress. Thanks again for taking the time to comment I really appreciate it 🙇
@jabeztadesse
@jabeztadesse 7 ай бұрын
HOW DO YOU REMOVE A FONT?
@DaveOnWP
@DaveOnWP 7 ай бұрын
- Open the Font Library - Click the "Library" tab - Find the font you wish to remove (as you installed it, it should be under "Installed Fonts") - Click on the Font - Click on Delete button I hope that helps?
@benbaxter7816
@benbaxter7816 7 ай бұрын
overkill
@DaveOnWP
@DaveOnWP 7 ай бұрын
Thanks for your comment. Hopefully the power of the new features coming to WordPress will change your opinion in the future.
@steamboat9592
@steamboat9592 7 ай бұрын
Every one of these features are just so, so fantastic. Really excited for all of them, but I love that the overrides to synced patterns feature is up next. That's going to allow me to keep sites nice and organized across pages with minimal effort required (and less detaching patterns - I always hate when I have to detach patterns just to change a few words!)
@DaveOnWP
@DaveOnWP 7 ай бұрын
It's really great to hear you're excited about thee features. I agree that overrides to synced patterns is going to be super powerful. Users have been requesting this feature for some time but we needed to wait for the editors APIs to evolve in order to deliver a robust experience and we are finally there!
@steamboat9592
@steamboat9592 7 ай бұрын
@@DaveOnWP I just tested it out a bit and I'm wondering if the following functionality is possible. If you set up a pattern with, say, a heading block, paragraph block and a button block (enable overrides on all of them), is it possible to leave one of these blocks empty on an instance of that pattern and have it completely omit that block from rendering? So removing the text from the heading block in that instance would have it simply not render on the front end. Currently, it looks like it does output the block HTML on the front end, it's just an empty element that takes with it the margin, padding defined in the source pattern.
@DaveOnWP
@DaveOnWP 7 ай бұрын
@@steamboat9592 It's a good use case which I'm not sure is possible right now. We still have time to fix that though. To that end I've passed on your feedback to the contributors working on the Tracking Issue github.com/WordPress/gutenberg/issues/59819#issuecomment-2088165643
@steamboat9592
@steamboat9592 7 ай бұрын
@@DaveOnWP Cheers, Dave! That would allow you to have an "all the possibilities" pattern so the user can omit pieces that aren't needed in each instance.
@TheBeeOBee
@TheBeeOBee 7 ай бұрын
Someone interview Rich about his skincare routine.
@richtabor
@richtabor 7 ай бұрын
😆decent lighting is 90% of it.
@dotone1a
@dotone1a Ай бұрын
😊
@TheBeeOBee
@TheBeeOBee 7 ай бұрын
Section styles will be helpful. Just read rich's post about patterns on automattic dot design, and can't wait to apply styles to them like that.
@DaveOnWP
@DaveOnWP 7 ай бұрын
Agreed. Section styles + Compose Zoom Out mode will making assembling Pages so much better. I'm looking forward to seeing if this matures in time for 6.6!
@Immanual-mug
@Immanual-mug 7 ай бұрын
Wordpress is definitely an underrated web development environment, love that you are sharing upcoming upgrades to it. 🥂
@DaveOnWP
@DaveOnWP 7 ай бұрын
Absolutely. And more proof of that is available when you realise you can run WordPress in your browser: wordpress.org/playground/
@scottael
@scottael 7 ай бұрын
Thanks Dave. I don't use core blocks much but the grid would be useful feature for many.
@DaveOnWP
@DaveOnWP 7 ай бұрын
Grid is going to be HUGE. It's still got time to improve in terms of the UI and UX so let's see what's ready for WordPress 6.6.
@maxziebell4013
@maxziebell4013 7 ай бұрын
The black on the toolbar is so much better!
@DaveOnWP
@DaveOnWP 7 ай бұрын
Glad you like that. It's currently a stylistic treatment that's isolated to Compose / Zoom Out mode so that it's clear things are "different". Perhaps it could evolve elsewhere in future. Let's see where it takes us.
@maxziebell4013
@maxziebell4013 7 ай бұрын
Yes, I am not sure about it being different in just one spot. What I like about it is that it has much more contrast, as the regular version is really something one has to search for at times. Its tone-on-tone style is really not my thing, and Brizy has proven that the black version is pretty effective on layouts.
@Black1991Star
@Black1991Star 7 ай бұрын
I didn't understand how are you going to give posibilitisi to user change the some params for grid structure. Can you explain? Let's say in my design I have a .block {display:grid; grid-template-columns: 300px, 1fr, 1fr;} @media (max-width: 450px) { .block {grid-template-columns: 1fr, 1fr;} } and @media (max-width: 390px) { .block {grid-template-columns: 1fr;} } How can this be achieved?
@DaveOnWP
@DaveOnWP 7 ай бұрын
The editor is not currently optimising too allow users control over low level features such as media queries. Rather the aim is to allow for Intrinsic Design where things "just work". That does mean some more advanced layouts are going to continue to require CSS for a while longer. If you are looking to understand more about why the editor takes this approach then you might like to watch this Hallway Hangout on Intrinsic Design: make.wordpress.org/themes/2024/01/30/hallway-hangout-intrinsic-design/
@riprap007
@riprap007 7 ай бұрын
Thanks for this
@DaveOnWP
@DaveOnWP 7 ай бұрын
You are very welcome. I hope it brings some visibility to things that are already public but perhaps not obvious to those who don't work on the project full time.
@DaveOnWP
@DaveOnWP 7 ай бұрын
🔗RESOURCE LINKS 🔗 🔍Tracking Issues 1. Advancing the Site Editor - github.com/WordPress/gutenberg/issues/59659 2. Overrides to Synced Patterns - github.com/WordPress/gutenberg/issues/59819 3. Composing with Patterns via Zoomed Out View - github.com/WordPress/gutenberg/issues/50739 4. Section Specific Styles - github.com/WordPress/gutenberg/issues/57537 5. Grid Layout - github.com/WordPress/gutenberg/issues/57478 👨Rich Tabor - Website: rich.blog - Twitter / X: twitter.com/Richard_Tabor - Shaping WordPress Newsletter - blog.us6.list-manage.com/subscribe?u=e7267bfd563b8f29ef95ba846&id=3ad25ea4f0 📖Other Resources - Follow Dave on Twitter/X - twitter.com/get_dave - WordPress Admin redesign - github.com/WordPress/gutenberg/issues/53322 - Patterns as Sectioning Elements - github.com/WordPress/gutenberg/issues/39281 - WordPress Playground - wordpress.org/playground - WordPress 6.6 Development Cycle - make.wordpress.org/core/6-6/ - Hallway Hangout on what’s next in Gutenberg - kzbin.info/www/bejne/gJK9oIOOqppqY8U
@woodyham1
@woodyham1 7 ай бұрын
I've been looking to have different format on desktop and mobile. This is good. However, can I use it for alternative blocks? I have created two blocks - othersdesktop and othersmobile - but cannot work out what changes I need to make to your CSS code to make them work. Any other advice you can point me towards please?
@DaveOnWP
@DaveOnWP 7 ай бұрын
If you need more advanced functionality for other blocks I would be tempted to try out this Plugin: wordpress.org/plugins/block-visibility/ Nick is a great guy and very experienced contributor to WordPress.
@halimaakhtar1339
@halimaakhtar1339 7 ай бұрын
Great tutorial 😂
@DaveOnWP
@DaveOnWP 7 ай бұрын
Thanks 😅
@saikirolab
@saikirolab 8 ай бұрын
Thanks for this video. Is there any way to have a link for each section of the homepage ? In my case, I want a one page website and want the menu to point to each section of the homepage. Thank you.
@DaveOnWP
@DaveOnWP 8 ай бұрын
Hi there. Yes you can do this. - Make each "section" you want to link to a "Group" block (it might be this already). - Select the section Group block and open the block's right hand sidebar ("Block Settings"). - Look for "Advanced" -> "HTML Anchor" - Type in a unique slug for the section (e.g. `welcome-home`). Note the instructional text below the input for more information on what you can place here. - Repeat for each section you want to link to. - Save the Site. Now in your Navigation block: - Click + to add a new menu item - In the search box type "#" (no quotes) and then the slug of the section you want to link to (e.g. #welcome-home ). The "#" tells the browser that this is an internal link. - Repeat for each section. - Save - Go to front of your site and clicking should jump to the section. If you want smooth scroll you might need to look for a simple Plugin like this one which will smooth scroll when you are moving between internal anchor links (note I did not test or endorse this Plugin - I just found it): wordpress.org/plugins/page-scroll-to-id/ I hope that helps?
@saikirolab
@saikirolab 7 ай бұрын
@@DaveOnWP thanks, Dave !
@andreranulfo-dev8607
@andreranulfo-dev8607 8 ай бұрын
1:00 My "Install fonts" is not sowing up. Any ideas?
@DaveOnWP
@DaveOnWP 8 ай бұрын
Looking at the code it seems that tab will only display as "Install Fonts" if you only have a single Font Collection and that collection is "Google Fonts". So it may be that your site has deregistered the "Google Fonts" collection or you have registered more than a single collection.