WP Roads
WP Roads
  • 48
  • 144 742
Building a Dynamic Listing with WordPress FSE and Gutenberg using Dynamic Shortcodes
WordPress Dynamic website tutorial with FSE and Gutenberg + Dynamic Shortcodes plugin!
Get Dynamic Shortcodes here 👉 wproads.com/ds
The listing we will create in the tutorial 👉 gutenberg.wproads.com/wordpress-tools/
*Video timestamps*
00:00 Intro
01:06 Dynamic Shortcodes Presentation
05:01 The Listing We Will Build
09:03 Preparing the CPT
17:03 Creating the single template for the CPT
23:24 Insert a dynamic button link using Dynamic Shortcodes
26:08 Insert a dynamic video using a Power Shortcode
30:54 Adding a dynamic link to the image block
33:55 Show taxonomies dynamically on the front end
37:19 Let's build the listing cards
47:23 Add dynamic badges using Block Visibility plugin
55:51 Check out my Gutenberg and FSE academy
56:18 Align buttons and heights in the query loop cards
01:00:33 Build a dynamic top-bar with featured posts
01:08:19 Flexibility of the twenty twenty-five FSE design options
01:10:58 Comment, like, subscribe and give me your feedback!
มุมมอง: 452

วีดีโอ

WordPress 6.7 🤯 New Features Highlight 🔥
มุมมอง 2.1K2 หลายเดือนก่อน
Subscribe to my WordPress newsletter here 👉 wproads.com Discover the Goodmorning Gutenberg Academy 👉 gutenberg.wproads.com/ Timestamps 00:00 Upgrade to WordPress 6.7 00:21 The new Twenty Twenty-Five Default Theme 00:40 Mix and Match Color palettes and Typography settings 01:21 Global Font Size Presets with Fluid Typography 03:00 Style variations for groups and patterns 04:02 Disable the modal t...
CommandUI 🤯 The WordPress Productivity Booster 🚀
มุมมอง 3642 หลายเดือนก่อน
Get CommandUI here 👉 wproads.com/commandui Subscribe to my WordPress newsletter here 👉 wproads.com/ Thanks for *liking, commenting and sharing* this video! 🔥 CommandUI is a plugin that provides a powerful command bar for WordPress. You can use it to reach any part of your website and perform any action: add, delete, update content, change settings in a plugin, you name it.
SureForms Pro 🚨 LIFETIME DEAL DISCOUNT 🚨 | Best WordPress Form Plugin 💌
มุมมอง 9863 หลายเดือนก่อน
Get SureForms Pro here 👉 wproads.com/sureforms (affiliate link) SureForms free has great features to create forms in WordPress: - you can use AI to kick-start your form building process - you can craft your forms using an intuitive drag and drop interface inside the WordPress editor - you can easily show your forms in Gutenberg, Elementor, Bricks, and any other page builder you’re using - you c...
SureForms Review and Tutorial | BEST Free WordPress Form Plugin 🚀
มุมมอง 1.2K3 หลายเดือนก่อน
SureForms is still in beta, but you can already tell it is going to be the BEST free WordPress Form Plugin in 2024 and beyond! Get SureForms Pro 👉 wproads.com/sureforms Free version here 👉 wordpress.org/plugins/sureforms/ *Watch my SureForms Pro review here* th-cam.com/video/EFJUgG7ovf0/w-d-xo.html *SureForms Review and Tutorial* Best free WordPress form plugin 00:00 SureForms Review 01:09 Like...
5 Best Gutenberg Blocks Plugins 🔥
มุมมอง 9524 หลายเดือนก่อน
5 Best Gutenberg Blocks Plugins 🔥
I WANT THIS in WordPress right NOW 🙄
มุมมอง 3704 หลายเดือนก่อน
I WANT THIS in WordPress right NOW 🙄
Site Mailer Review 🤔 Elementor's New Email Plugin 📧
มุมมอง 1.7K4 หลายเดือนก่อน
Site Mailer Review 🤔 Elementor's New Email Plugin 📧
Divi 5 Public Alpha First Look 🔍 🧐
มุมมอง 1.2K4 หลายเดือนก่อน
Divi 5 Public Alpha First Look 🔍 🧐
WordPress Drama Unfolds - WP Engine Banned from WordPress.org 🔥
มุมมอง 7204 หลายเดือนก่อน
WordPress Drama Unfolds - WP Engine Banned from WordPress.org 🔥
Best Google Analytics Alternative for WordPress 📊 Independent Analytics Plugin Review 🤩
มุมมอง 7954 หลายเดือนก่อน
Best Google Analytics Alternative for WordPress 📊 Independent Analytics Plugin Review 🤩
Supercharge the WordPress Block Editor with this FREE Plugin 🚀 | Block Visibility Plugin Overview
มุมมอง 2174 หลายเดือนก่อน
Supercharge the WordPress Block Editor with this FREE Plugin 🚀 | Block Visibility Plugin Overview
Elementor Live Search Results Tutorial 🔎 NEW FEATURE 🤩
มุมมอง 6K4 หลายเดือนก่อน
Elementor Live Search Results Tutorial 🔎 NEW FEATURE 🤩
WordPress 6.6 New Features 🤩
มุมมอง 1.6K6 หลายเดือนก่อน
WordPress 6.6 New Features 🤩
ZipWP Review WordPress AI Website Builder 🤖 | Premium Features Walk-through 🚀
มุมมอง 3.7K7 หลายเดือนก่อน
ZipWP Review WordPress AI Website Builder | Premium Features Walk-through 🚀
ZipWP Review (FREE version) 🤔 - NEW AI WordPress Website Builder 🤖
มุมมอง 6K7 หลายเดือนก่อน
ZipWP Review (FREE version) 🤔 - NEW AI WordPress Website Builder 🤖
Customize the WordPress DASHBOARD & more 🚀 | ASE Plugin Tutorial and Review
มุมมอง 2.9K7 หลายเดือนก่อน
Customize the WordPress DASHBOARD & more 🚀 | ASE Plugin Tutorial and Review
Rank Math SEO Plugin Tutorial 2024 | WordPress SEO tutorial For Beginners
มุมมอง 7K8 หลายเดือนก่อน
Rank Math SEO Plugin Tutorial 2024 | WordPress SEO tutorial For Beginners
Divi 5 DEMO 🚀 first impressions 🤔
มุมมอง 1.1K9 หลายเดือนก่อน
Divi 5 DEMO 🚀 first impressions 🤔
Elementor Search Results Page Tutorial | Advanced Settings Included 🔎
มุมมอง 13K9 หลายเดือนก่อน
Elementor Search Results Page Tutorial | Advanced Settings Included 🔎
Elementor 404 Page Tutorial | + LottieFiles FREE Animations 🐹
มุมมอง 7259 หลายเดือนก่อน
Elementor 404 Page Tutorial | LottieFiles FREE Animations 🐹
Off-Canvas Mobile Menu Elementor Tutorial 📲 | Beautiful Slide-Out Menu | Elementor PRO Popup Menu
มุมมอง 3.2K9 หลายเดือนก่อน
Off-Canvas Mobile Menu Elementor Tutorial 📲 | Beautiful Slide-Out Menu | Elementor PRO Popup Menu
Elementor Mega Menu Tutorial | Without Plugin 👉 Just Elementor PRO
มุมมอง 8K9 หลายเดือนก่อน
Elementor Mega Menu Tutorial | Without Plugin 👉 Just Elementor PRO
Elementor Header Tutorial | Floating Header Design With Elementor Flexbox Container
มุมมอง 3.2K10 หลายเดือนก่อน
Elementor Header Tutorial | Floating Header Design With Elementor Flexbox Container
Elementor Tutorial 2024 | How To Create a Website with WordPress and Elementor PRO Tutorial (8H)
มุมมอง 34K10 หลายเดือนก่อน
Elementor Tutorial 2024 | How To Create a Website with WordPress and Elementor PRO Tutorial (8H)
WordPress 6.5 - New AWESOME Features 🤩
มุมมอง 4.1K11 หลายเดือนก่อน
WordPress 6.5 - New AWESOME Features 🤩
Dynamic Shortcodes - Review and Tutorial - Best Dynamic WordPress Plugin
มุมมอง 4.9Kปีที่แล้ว
Dynamic Shortcodes - Review and Tutorial - Best Dynamic WordPress Plugin
How To Make an Affiliate Marketing Website | Tutorial 2023 | Easy, Professional & Cheap
มุมมอง 1.4Kปีที่แล้ว
How To Make an Affiliate Marketing Website | Tutorial 2023 | Easy, Professional & Cheap
WordPress 6.2 NEW FEATURES and IMPROVEMENTS 🚀
มุมมอง 2.8Kปีที่แล้ว
WordPress 6.2 NEW FEATURES and IMPROVEMENTS 🚀
Hostinger Tutorial 2023 | Best WordPress Hosting | Step By Step Guide
มุมมอง 848ปีที่แล้ว
Hostinger Tutorial 2023 | Best WordPress Hosting | Step By Step Guide

ความคิดเห็น

  • @xinluo5792
    @xinluo5792 7 ชั่วโมงที่ผ่านมา

    where is the " global setting " that you applied in the '' 0:48'' in your video? i look for desperately the button to change the size of this widget

  • @zuss_stumbletiktok2099
    @zuss_stumbletiktok2099 3 วันที่ผ่านมา

    Good

  • @DavidBell-qq1sd
    @DavidBell-qq1sd 5 วันที่ผ่านมา

    FSE is the worst implementation of software that I have seen in my 29 years on the web. Pathetic. No attention to UI/UX. I will never use it. I mistrust anyone on TH-cam who says otherwise.

    • @wproads
      @wproads 5 วันที่ผ่านมา

      I partially agree with you, but I'm giving it a chance :) hope to see a good evolution of the UI / UX in the next releases.

  • @GodPleaseforgiveme
    @GodPleaseforgiveme 7 วันที่ผ่านมา

    Hi Pascal, I have a suggestion for you I recommend you create a WooCommerce and JetEngine training course and use Elementor to help you build its pages.

  • @wproads
    @wproads 7 วันที่ผ่านมา

    Get Dynamic Shortcodes here 👉 wproads.com/ds

  • @RaiAdiSanjaya
    @RaiAdiSanjaya 7 วันที่ผ่านมา

    Nice list! I’ve also found Gutenverse to be a solid option for Gutenberg blocks. Worth a try for anyone building with WordPress. 👌

  • @Little3-l7y
    @Little3-l7y 13 วันที่ผ่านมา

    How to create recently viewed product list in elementor pro

  • @ShlomiAsaf
    @ShlomiAsaf 14 วันที่ผ่านมา

    but elementor is a plugin

  • @happy9955
    @happy9955 15 วันที่ผ่านมา

    the best wordpress video i ever seen

  • @jonoanym7349
    @jonoanym7349 21 วันที่ผ่านมา

    if (!is_admin()) { function mv_search_filter($query) { if ($query->is_search) { $query->set('post_type', array('post', 'product')); } return $query; } add_filter('pre_get_posts', 'mv_search_filter'); }

  • @florius22
    @florius22 21 วันที่ผ่านมา

    Great Video, but do you mind explaining a bit more on how you did the styling of the widget? I cannot reduce the height for example. There is no styling option for this and it looks really huge and wacky compared to the old search bar. You kind of completely skipped over this part.

    • @wproads
      @wproads 20 วันที่ผ่านมา

      Hi, you need to set the padding of the input and the submit button in the style tab

    • @florius22
      @florius22 18 วันที่ผ่านมา

      @@wproads Thanks! I made it look just the way I wanted!

  • @asimchgrw
    @asimchgrw 24 วันที่ผ่านมา

    Suggestions for your good work: Maintain clarity & simplicity and a logical sequence that you already have and avoid clutter. Only after watching this video I fully understand FSE ... keep up great work

  • @Mendax-in4eh
    @Mendax-in4eh 25 วันที่ผ่านมา

    ciao,ho seguito alla lettera le impostazioni di elementor: elementi annidati attvi,flexbox attivo e menu attivo,ma quando inserisco il megamenu e seleziono dropdown a me non esce il riquadro in basso per aggiungere i contenitori ( quello che spieghi al miniuo 5:50) sto impazzendo aiuto XD ps: stavo leggendo i commenti , io ho elementor pro 3.14.1 come versione però l'opzione cè come ho detto ho fatto tutti i passaggi quindi dovrebbe funzionare..ma il riquadro dropdown non esce, grazie

  • @svetlanagertsenkennelhouse9985
    @svetlanagertsenkennelhouse9985 26 วันที่ผ่านมา

    Thank you for your usefull tutorial. 🎉in this video you have mentioned, that you Will make a video/ tutorial about “ Content AI” ( Rank Math ). Any news about it ? thank you from Denmark 😊

  • @jeneneduncan7026
    @jeneneduncan7026 27 วันที่ผ่านมา

    This is perfect. I am making my own website for my business, and I love the step by step! Thank you for this!!!!!

  • @jenniwilloughby8802
    @jenniwilloughby8802 28 วันที่ผ่านมา

    This is great! Thanks :-)

  • @solotunis
    @solotunis 29 วันที่ผ่านมา

    Thank you so much !

  • @igotslickshoes
    @igotslickshoes 29 วันที่ผ่านมา

    To what degree does it make website content accessible? Does it follow accessibility guidelines (headings, aria labels, etc) ?

  • @serusok
    @serusok หลายเดือนก่อน

    Nicolas Cage changed his hairstyle

  • @trold8424
    @trold8424 หลายเดือนก่อน

    For some reason my submit button doesn't submit the form :/

  • @anuruddhakulatunga
    @anuruddhakulatunga หลายเดือนก่อน

    Awesome tutorial. Thanks so much Pascal!

  • @BanksterRap
    @BanksterRap หลายเดือนก่อน

    Thank you. I've tried some other content providers, and they all have their plus points, but yours is by far and away the most useful. Bon chances!

  • @ElevationStationTv
    @ElevationStationTv หลายเดือนก่อน

    Thanks for such an amazing comprehensive tutorial. What tool do you use to see the pixels? 5:12:10

  • @WajhuAllahArifHussain
    @WajhuAllahArifHussain หลายเดือนก่อน

    Great video.

  • @NelsLindahl
    @NelsLindahl หลายเดือนก่อน

    I'm 100% digging into this video tonight. Thank you for streaming this walkthrough.

  • @DrCamposArce
    @DrCamposArce หลายเดือนก่อน

    Hey thanks a lot, thats awesome!! Im having just 1 problem. When I look for some post on the search bar, the title doesnt appear, just the image and the info. Any idea on what can cause that? I changed the font, the size, the color...everything.

  • @PinkKoala-k4s
    @PinkKoala-k4s หลายเดือนก่อน

    Would be nice to see same approach of video but with Kadence Blocks and Generate Blocks aswell. Maybe even Supablox (new under development, but can be used for free atm), not much content of it online. Would be nice to see you test it, if you find that interesting :D What is your main builder plugin and theme? Thanks

  • @AsifPlugins
    @AsifPlugins หลายเดือนก่อน

    amazing

  • @marionking9851
    @marionking9851 หลายเดือนก่อน

    I am having a little nightmare with Rank Math on my Wordpress site. I am showing that I have the latest version 1.0.234 but that it is not connected. I have tried to download Rank Math but it does not recognise my password or user name and despite requests is not sending an update list. Without this I cannot access help either. Bit of an odd one but very frustrating

  • @SynaChan-c1g
    @SynaChan-c1g หลายเดือนก่อน

    Thanks for your perfect teaching for your subscribers.

  • @UfkAytas
    @UfkAytas หลายเดือนก่อน

    I installed the Highlight Search Terms plugin but it didn't work. There is a warning that it has not been tested in the new wordpress version. There are no configuration settings in the plugin. Someone who is not an expert in CSS cannot use it.

  • @jhmnieuwenhuis
    @jhmnieuwenhuis หลายเดือนก่อน

    Great tutorial, learned a lot !. One question : if I rebuild my website ( so all pages etc. changed ) Do I have to reset google search ? Or will it be done automatically ?

  • @AmberDigi
    @AmberDigi หลายเดือนก่อน

    thank you for your content:)

  • @gbaabu
    @gbaabu หลายเดือนก่อน

    good number of settings for desktop, laptup, ipad, mobile. in which video i am going to learn the design of sample website.

    • @wproads
      @wproads หลายเดือนก่อน

      Hi, I have got one here th-cam.com/video/_G7e6dL8OZ4/w-d-xo.html

  • @pichhalperi
    @pichhalperi หลายเดือนก่อน

    Very Good 👍

  • @pelegtabib
    @pelegtabib หลายเดือนก่อน

    Very good overview, thanks!

  • @userunknozn
    @userunknozn หลายเดือนก่อน

    Really nice! But how does it score for SEO? Does Google still recognise this as a navigation?

  • @yoyo12314
    @yoyo12314 หลายเดือนก่อน

    ok but it doesn't show on samsung 23

  • @DavidBell-qq1sd
    @DavidBell-qq1sd หลายเดือนก่อน

    Very very good! Thank you.

  • @VickiBoliard
    @VickiBoliard 2 หลายเดือนก่อน

    I had been so frustrated by all of the videos for the Twenty Twenty Four Theme because none of the creators were that familiar with full site editing and were always talking negatively about the changes. I came back to wordpress today and found your video. Excellent timing! You obviously love full site editing and you are a positive voice for the future of Wordpress. I'm thrilled to have found you!

    • @wproads
      @wproads หลายเดือนก่อน

      Thank you very much for this feedback :) I’ll definitely post more videos on FSE soon!

  • @webnologia
    @webnologia 2 หลายเดือนก่อน

    I was looking for a Stackable Pro review/tutorial, and you have it! Thanks. I'm buying Pro today using your link.

    • @wproads
      @wproads 2 หลายเดือนก่อน

      Thank you! :D

  • @Whatreally123
    @Whatreally123 2 หลายเดือนก่อน

    not a developer but i am trying to understand how I can make the behaviour of the default Search block behave differently. If I use Button Only mode, it shows just the button and when the user clicks it, the search field appears to the left of the button. THis breaks the UI/UX. ANy idea how I can modify the behaviour of the default Search block so that when user clicks it, the search box appears below the button? Can some css do it or does it require more complex solution?

  • @Biancorp
    @Biancorp 2 หลายเดือนก่อน

  • @AmirSalehipour
    @AmirSalehipour 2 หลายเดือนก่อน

    Hello there, The website functions as advertised, and I wanted to share a suggestion for you to consider in the future. If you could integrate AI into your platform, it could assist with building SEO, content, and design after the website is created. Cheers!