How to Build Really Fast Landing Pages With Gutenberg + Kadence Blocks

Поделиться
HTML-код
  • Опубликовано: 1 фев 2025

Комментарии • 74

  • @dynamicchecklists127
    @dynamicchecklists127 Год назад +2

    Great tutorial I needed to see to make a buying decision. Clicked your link to load your cookie. Tc. :)

    • @StartBlogging101
      @StartBlogging101  Год назад

      Hey thanks so much for taking the time to watch the video and leave a comment! I really appreciate the support :)

  • @bundaonduty650
    @bundaonduty650 2 года назад +3

    This is the era of no page builders needed content creator. Thank you.

    • @StartBlogging101
      @StartBlogging101  2 года назад

      Thanks for the comment - appreciate it!

    • @dshanw5187
      @dshanw5187 11 месяцев назад

      Hands down! the BEST content creator for this specific niche. Great tone, diction, and easy to understand.
      Thank you😅

    • @codingdragons
      @codingdragons 4 месяца назад

      This is technically a page builder dingbat

  • @flamissia4
    @flamissia4 2 месяца назад +1

    Thank you, this was very helpful. I'm rebuilding my website because it's too slow, and so I'm excited about getting off Elementor and creating fast pages. Kadence blocks seems no harder than Elementor, and your tutorial explains how to use Kadence blocks very clearly.

    • @StartBlogging101
      @StartBlogging101  2 месяца назад +1

      Switching from Elementor to Kadence Blocks was one of the best things I have ever done for my site. Thanks for watching and for the comment!

  • @amineunshakable1295
    @amineunshakable1295 2 года назад +2

    One of the best explanations ever I've come across on Gutenberg kadence in parallel with Elementor, absolutely fantastic.
    Hope to see more explanations with other them, plugins and tools too.
    Keep it up, great work

    • @StartBlogging101
      @StartBlogging101  2 года назад

      Definitely throwing a heart on that comment! Awesome to hear that it was helpful for you. I know it always helps me to see how one tool works versus another tool, so I included the Elementor piece in there as well. Thanks for watching :)

  • @utterabundance6374
    @utterabundance6374 3 года назад

    Homie, you're changing lives out here! Thank you!

    • @StartBlogging101
      @StartBlogging101  3 года назад

      Wow, quite the compliment. Truly appreciate it! 🙏

  • @gedboswell6304
    @gedboswell6304 5 месяцев назад

    Great tutorial

  • @rmcellig
    @rmcellig 2 года назад +1

    Excellent!!!

  • @alinaseri7951
    @alinaseri7951 3 года назад +1

    helpful and pleasing . thank you so much .

    • @StartBlogging101
      @StartBlogging101  2 года назад

      You are most welcome! Thanks for leaving a comment.

  • @PaulSteele
    @PaulSteele 3 года назад +1

    exactly what I needed! Thanks

  • @luisflorenzan9571
    @luisflorenzan9571 3 года назад

    Excellent info, great tutorial.

  • @joonchang-i8x
    @joonchang-i8x 2 года назад

    damn best tutorial ever

  • @msbarnwal1499
    @msbarnwal1499 3 года назад +1

    I am Going to copy all that,beginner to Expert level content

  • @ByronPhuket
    @ByronPhuket 3 года назад

    Thank you, have a super Sunday and F12 was a real #nugget

    • @StartBlogging101
      @StartBlogging101  3 года назад

      Hey Byron! Glad you enjoyed it. F12 and the device toolbar was a savior when I first learned about it :)

  • @tomfraser3086
    @tomfraser3086 7 месяцев назад

    Can you do a tutorial on on building a bento box layout with the Kadence theme ? thank you

  • @rmcellig
    @rmcellig 3 года назад +2

    What a fantastic video!!!! Is it possible to move or copy a block or blocks that are outside my columns into a column? Thanks!!!!😀

    • @StartBlogging101
      @StartBlogging101  3 года назад +2

      Hi there! Yeah, you can select multiple blocks by choosing one block, holding down the 'shift' key, and then choosing other blocks. Once you have all of the blocks highlights, you can use the 6 dots in the toolbar (3 vertical dots next to 3 vertical dots) to grab and drag those blocks to inside the column. Then, simply let go and all of those selected blocks will move to where you dropped them. Hope that helps!

    • @rmcellig
      @rmcellig 3 года назад

      @@StartBlogging101 thanks so much!! I am going to attempt to create a very minimalist home page. I want my site to be simple, lean, and fast. It's going to be a small site with a lot of archival mp3 files that are on the servers of the hosting company I use. Thanks again for your quick and helpful reply!!😀

  • @markuselias6017
    @markuselias6017 3 года назад +3

    Great tutorial! One thing I have always wondered about Gutenberg: why do things look different in the editor compared to when you look at the actual site, as shown at 15:50? It drives me nuts sometimes! I wish they could fix this. It causes a lot of confusion.

    • @StartBlogging101
      @StartBlogging101  3 года назад +2

      As I somewhat explained in the video, Gutenberg is many times "expecting" another block to be coming (and it puts that '+' button below certain blocks in order to add a new block) which can add extra spacing when there is none. I agree, it's certainly confusing at times. I have gotten in the habit of always previewing my pages as I'm building them, but I'm hoping that WordPress figures out a way to polish this up a bit so we can still have an intuitive editing experience while still having the editor (backend) match up perfectly with the frontend.

    • @markuselias6017
      @markuselias6017 3 года назад

      @@StartBlogging101 Thanks! I hope they will manage to polish this a bit more.

  • @lialarose8011
    @lialarose8011 3 года назад +2

    Very informative. I have learned many things from your tutorials. I'm facing an issue with the Kadence theme, tho. When I try to optimize my pages for mobile, the changes don't go through. I cleaned all cache, including browser, but didn't work. Do you have any idea what could be?

    • @StartBlogging101
      @StartBlogging101  3 года назад

      Thanks for the comment, Lia! Glad to hear my tutorials are helping :) I'm a little confused as to what is happening on your end. What do you mean when you say the changes don't go through when you optimize your pages for mobile?

    • @lialarose8011
      @lialarose8011 3 года назад

      @@StartBlogging101 Thank you for your response. I mean when I'm customizing my pages to be mobile responsive, nothing is changing anymore. Stays the same. Usually, the updates were instant. I also deactivated all plugins one by one, nothing seems to work. Any idea would be greatly appreciated.

    • @StartBlogging101
      @StartBlogging101  3 года назад

      @@lialarose8011 If I'm understanding correctly, you're customizing your pages to be more mobile responsive in the Gutenberg editor, but then when you go to preview your page and see it live, nothing has changed? If so, I haven't heard of that issue at all. I would contact the free Kadence support and they should be able to get your URL and figure out exactly what's going on.

    • @lialarose8011
      @lialarose8011 3 года назад

      @@StartBlogging101 Yes, you understood correctly. I did contact Kadence support last week, but from my understanding, they don't inspect URLs in the free plan. Anyway, I managed to solve the issues myself. It is working now. Thank you for taking the time to answer.

    • @romtekch4958
      @romtekch4958 2 года назад +1

      @@lialarose8011 What was the cause of your problem and how did you solve it? It may help others.

  • @KevsGuide
    @KevsGuide 2 года назад

    thanks for great info. is this style of landing page convering well?

  • @tsykin
    @tsykin 2 года назад +1

    Thank you so much for this tutorial! Just one question tho: Is there anything that Kadence can't do that Elementor Pro can?
    I am asking that because I am currently looking for a Gutenberg theme builder which would give me maximum flexibility while building a website.

    • @StartBlogging101
      @StartBlogging101  2 года назад +3

      Kadence would be what you're looking for, then :) Kadence has its own blocks plugin, supports dynamic data, theme builder (for building page templates), elements, has a cloud to host predesigned templates (aka patterns), header/footer builder, global color palette, and so much more. All the major elements you'd need to build any kind of website. Plus, it does all this in a super lightweight way, making your website really fast so you can more easily pass Core Web Vitals, unlike Elementor.

    • @tsykin
      @tsykin 2 года назад +1

      @@StartBlogging101 thank you so much for the reply. Very nice of you :)

    • @StartBlogging101
      @StartBlogging101  2 года назад

      @@tsykin Happy to help! :)

  • @enkiimuto1041
    @enkiimuto1041 2 года назад

    Very useful

  • @WWTRaceway
    @WWTRaceway Год назад

    How are you dealing with the DOM warning for all the classes in the body ?

    • @StartBlogging101
      @StartBlogging101  Год назад

      Hi there! Are you referring to the DOM size having too many elements? If so, I have never once worried about that. It's a really silly suggestion and nothing to worry about unless you're using a third-party page builder which produces significantly more DOM elements that using a tool like the WordPress block editor + Kadence Blocks.

  • @alyaabe8337
    @alyaabe8337 3 года назад +1

    can we make the landing page full canvas without the header and footer like the rest of the website?

    • @StartBlogging101
      @StartBlogging101  3 года назад

      Yes, you can easily disable the header and footer with a toggle in the page settings at the bottom where I'm showing how to make the page full width.

  • @steveharmancambridge
    @steveharmancambridge Год назад

    This would be a great tutorial, but so much has changed in the Kadence Blocks UI with the v3 update that it's really hard to follow along with. Any chance of updating it for the current version of Kadence Blocks? Thanks

    • @StartBlogging101
      @StartBlogging101  Год назад +1

      Hey Steve! I know that a lot has visually changed with the Kadence Blocks v3 update. About 95% of the stuff still holds true and is just separated into various tabs rather than being all listed in a single panel, but it does make it harder to follow along with. It's on my list to create a new version of this using the all new Kadence Blocks 3.0 UI!

    • @steveharmancambridge
      @steveharmancambridge Год назад

      Got it, many thanks@@StartBlogging101 I'm coming from Elementor and new to Gutenberg / native full site editing in WordPress - the one big thing I don't understand is why, Kadence Blocks recommends using their non-full-site-editing "classic" Kadence theme? In my initial speed tests, GTMetrix and Google Pagespeed both note issues coming from the underlying classic theme (even naming things like ".....classic.css" and so on). It seems strange that Kadence Blocks has been designed to be performant, yet sacrifices some of that by not having a Block / full site theme to go with it? I Appreciate that I could use a different Block theme, but presumably then I'd lose most of the customisation options available within the Kadence theme. Anyway, thanks again for the reply!

  • @presentalinkwalterbak2426
    @presentalinkwalterbak2426 2 года назад +1

    👍👍👍👍👍👍👍

  • @DBCVC
    @DBCVC Год назад

    Is this created with the Free Version of Kadence?

    • @StartBlogging101
      @StartBlogging101  Год назад

      This video shows how to build pages using the free Kadence Blocks plugin, yes

  • @mowbad1
    @mowbad1 3 года назад

    Great video! Quick question about page speed. I know page builders live Elementor will slow the website down. How do Kadence theme and it's plugins compare with respect to speed? In my mind I'm seeing both at page builders and can't see why Elementor is slower. Thank you!

    • @thegoat_8718
      @thegoat_8718 3 года назад +2

      As all page builders Elementor add an extra load and slower any wordpress websites, Kadence theme with Kadence blocks or any others blocks plugins with a base theme dont have this issue. A Gutenberg base site will always faster than a full page buidler like Divi, Elementor, Oxygen or whatever. Theres no bloat codes adding

    • @StartBlogging101
      @StartBlogging101  2 года назад +1

      Great question! I cover Elementor vs Gutenberg (Kadence) specifically in part of this video: ruclips.net/video/_zQMlp8JPn4/видео.html - 25 minutes in I go over an Elementor vs Kadence speed test and you show you how much faster Kadence is and explain why that is. Hope that helps!

  • @anthonyrude
    @anthonyrude 10 месяцев назад

    This is 2 years old. Do you have a update?

  • @Diamond0dust
    @Diamond0dust 2 года назад

    how to collect email? this button wont work

    • @StartBlogging101
      @StartBlogging101  2 года назад

      Hey Akshay! I'm assuming you're talking about the form button? In the Form block settings, you can hook it up to a number of email services. I personally use FluentCRM so that it adds contacts to my email list when they submit the form.

  • @izakniemann5734
    @izakniemann5734 2 года назад +1

    I would really appreciate if you say WHY you do things. I doesn't help to just say 'I will disable this', or 'I will unbox' that. WHY are you doing that? This video would have been so much more valuable if you could just motivate WHY you do certain things.

  • @romtekch4958
    @romtekch4958 2 года назад

    What a pity you used Kadence theme! I need to work with a website with existing theme.

  • @dinorossi6611
    @dinorossi6611 Год назад

    I wish I could email you. Also I wish you'd demo a full website build from A to Z