The Admin Bar
The Admin Bar
  • 329
  • 952 695
Building Smarter WordPress Websites: Block Visibility is a total CHEAT-CODE!
Discover how the Block Visibility plugin can transform your WordPress websites into dynamic, user-specific experiences without extra templates or complicated setups. I’ll show you how I used it to build a single template that adapts to logged-in users, taxonomies, and event schedules for my Barfly Community.
Whether you're managing memberships, showcasing events, or just exploring ways to improve your site's flexibility, Block Visibility can do it all - and it’s completely free! Perfect for beginners and advanced users alike. Stick around to see step-by-step how I used this S-Tier plugin to simplify content management and improve user experiences.
🪰 Checkout the Barfly Dashboard website: barfly.theadminbar.com/
👉 wordpress.org/plugins/block-visibility/
Jonathan's video: ua-cam.com/video/00pSDcUvV80/v-deo.htmlsi=garKtyi1P5HXD-2K
- - - -
💻 Visit Our Website: theadmin.bar/yt-tab
🗨 Join Our Free Community: theadmin.bar/yt-community
📨 Get the Best of The Admin Bar Delivered: theadmin.bar/yt-tfc
🔁 Sell More Care Plans: theadmin.bar/yt-wom
🧮 Use My Website Price Calculator: theadmin.bar/yt-calculator
📜 Get My Proposal Template: theadmin.bar/yt-proposal
☑️ Get More Done with My Checklists: theadmin.bar/yt-checklists
🔴 Live Event Schedule: theadmin.bar/yt-events
🔧 The Tools I Use: theadmin.bar/yt-tools
⚡ My Agency, OGAL Web Design: theadmin.bar/yt-agency
Переглядів: 696

Відео

Making Layouts UNBREAKABLE! Using nth-of-type to solve this annoying problem!
Переглядів 4 тис.19 годин тому
One of my clients recently came back to me frustrated that their About page had become a total mess. Embarrassingly, I kinda set them up for failure 😬 So, in today's video, I'm going to show you how I used a nth-of-type selector to help make their layout UNBREAKABLE! 💻 Visit Our Website: theadmin.bar/yt-tab 🗨 Join Our Free Community: theadmin.bar/yt-community 📨 Get the Best of The Admin Bar Del...
Using CSS Grid in GenerateBlocks (A literal and practical approach)
Переглядів 68014 днів тому
In last week's video, I showed you how to design using a 12-column grid in Figma - but I got questions about how to actually implement that in GenerateBlocks. That, of course, opens up Pandora's Box on CSS grid 😅 So, in today's video, I'll show you how you can take that exact 12-column layout and literally replicate it in GenerateBlocks. Then, we'll take a look at a more practical approach for ...
The Truth About "The Grid" (it's less complicated than you think, & more powerful than you realize)
Переглядів 1,6 тис.21 день тому
You’ve probably heard designers talking about “the grid”. But, if you’re not a designer that term might sound a bit abstract or confusing. So when people ask me about it, my aim is to always simplify it. A grid is just a framework of evenly spaced lines that helps organize and align elements. Instead of having an infinite number of sizes, the grid helps you narrow it down to a reasonable amount...
The ALL NEW Query Block in GenerateBlocks 2.0 🤯 Repeaters, Options Pages, CSS Grid, and More!
Переглядів 1,5 тис.28 днів тому
In this video we explore the differences between the "old" and "new" query loop blocks in GenerateBlocks. The new 2.0 release has a ton of upgrades that not only make your query loops more powerful, but allow for better semantic HTML, and more styling control! Check out all the new goodies! 💻 Visit Our Website: theadmin.bar/yt-tab 🗨 Join Our Free Community: theadmin.bar/yt-community 📨 Get the B...
Creating Custom Breakpoints in GenerateBlocks - It's easy and solves a ton of frustration!
Переглядів 855Місяць тому
In this video, I quickly explain the role of media queries and how they work within CSS. Then we take a look at the media queries (or "breakpoints") built into GenerateBlocks and show you how you can easily set up custom breakpoints to solve some of the frustrating design challenges when things aren't breaking just the way you want! 💻 Visit Our Website: theadmin.bar/yt-tab 🗨 Join Our Free Commu...
Figma Components are crazy-powerful (it's so easy to do!)
Переглядів 661Місяць тому
Figma can be a bit overwhelming if you're not using it day-in and day-out - but their components are something anyone using Figma should give a shot. Not only does it speed up your workflow, but it can help keep your designs much more consistent and scalable. I'll show you just how easy it is to create components with multiple variants (and even nested components) in seconds! 💻 Visit Our Websit...
GenerateBlocks NEW Dynamic Data System - What you need to know to use 2.0
Переглядів 1,4 тис.Місяць тому
The 2.0 release of GenerateBlocks brings in a whole new system for working with Dynamic Data. In today's video, I'm going to walk you through a practical example of all the different ways you can work with dynamic data in GB 2.0 by building out an author bio box. User Meta Tags: {{author_meta key:display_name}} {{author_meta key:first_name}} {{author_meta key:last_name}} {{author_meta key:user_...
Create a horizontal scroller with CSS Grid - An instant UI improvement for any blog grid!
Переглядів 4,9 тис.2 місяці тому
In today's video, I'm going to show you how you can instantly improve the UI (especially on mobile) for any of your grids using just a few lines of CSS that create a simple horizontal scroller. This works in the new GenerateBlocks 2.0 (currently in Beta), thanks to the use of CSS grid. 💻 Visit Our Website: theadmin.bar/yt-tab 🗨 Join Our Free Community: theadmin.bar/yt-community 📨 Get the Best o...
I made a free plugin!
Переглядів 2,4 тис.2 місяці тому
Something that was actually on my goals list a couple years ago has finally happened - I created a WordPress plugin! In today's video, I'm going to show you how it works and talk about why it might help improve your workflow. You can download Noted! for free at wordpress.org/plugins/noted 💻 Visit Our Website: theadmin.bar/yt-tab 🗨 Join Our Free Community: theadmin.bar/yt-community 📨 Get the Bes...
These subtle tweaks took my logo from amateur to professional (anyone can do it!)
Переглядів 1,2 тис.2 місяці тому
In the process of doing all the branding work for my new plugin, I ended up using a few little tricks to create a simple logo, that's both polished and professional. None of these take an art degree or rocket science - they’re the little things you pick up with years of experience. But luckily for you, you don’t have to spend years learning these things the hard way, I’ll show you in just over ...
My Care Plans just got a MASSIVE upgrade! Never Miss a Lead - Automated Form Testing (w/ CheckView)
Переглядів 2,7 тис.2 місяці тому
If you’ve ever received that dreaded email from a client saying their form isn’t working, you know the awful pit-in-your-stomach feeling. And if this has happened to you, you’re probably hoping those missed leads were at least stored somewhere. But even then, it’s embarrassing to follow up with people who think you’ve ignored them for weeks-or worse, months. This kind of problem can cost your c...
Nested loops with repeaters? F*ck yeah! GB 2.0 is gonna BLOW YOUR MIND! 🤯
Переглядів 2,6 тис.2 місяці тому
GenerateBlocks just released the alpha version of 2.0 - which has been rebuilt from the ground up for performance and accessibility. With it comes the ability to not only query ACF Repeater fields - but access to nest repeaters inside of repeaters 🤯 There is a *lot* to see in this release (maybe their biggest ever), but today I'm going to start by diving into the deep-end head-first to put all ...
Website Launch Process - Testing Performance, Accessibility & SEO and going LIVE with @instawp
Переглядів 21 тис.3 місяці тому
Website Launch Process - Testing Performance, Accessibility & SEO and going LIVE with @instawp
Global styles, query loops, dynamic data, modals, and more! [full site build w/@instawp]
Переглядів 15 тис.3 місяці тому
Global styles, query loops, dynamic data, modals, and more! [full site build w/@instawp]
Website Theming, Custom Post Types, and Front-End Forms [full site build w/ @instawp]
Переглядів 3,9 тис.3 місяці тому
Website Theming, Custom Post Types, and Front-End Forms [full site build w/ @instawp]
Website Setup Process: Design, Specs, Child Theme Configuration & More! [full site build w/@instawp]
Переглядів 13 тис.3 місяці тому
Website Setup Process: Design, Specs, Child Theme Configuration & More! [full site build w/@instawp]
Building a form with conditional logic, calculations, multiple actions, & dynamic data using WS Form
Переглядів 1,4 тис.3 місяці тому
Building a form with conditional logic, calculations, multiple actions, & dynamic data using WS Form
Get paid to find issues with websites (accessibility, SEO, performance, compliance, and more!)
Переглядів 1,3 тис.4 місяці тому
Get paid to find issues with websites (accessibility, SEO, performance, compliance, and more!)
You've Never Used Taxonomies Like THIS! Create a remote control for your websites!
Переглядів 2,7 тис.4 місяці тому
You've Never Used Taxonomies Like THIS! Create a remote control for your websites!
Save your clients from THEMSELVES 😵 This surprising solution could transform WordPress security!
Переглядів 1 тис.4 місяці тому
Save your clients from THEMSELVES 😵 This surprising solution could transform WordPress security!
This plugin is freaking amazing!
Переглядів 1,1 тис.5 місяців тому
This plugin is freaking amazing!
There’s More to Taxonomies than Categories and Tags!
Переглядів 2,1 тис.5 місяців тому
There’s More to Taxonomies than Categories and Tags!
A Web Designer's Secret Weapon for Endless Inspiration!
Переглядів 8 тис.5 місяців тому
A Web Designer's Secret Weapon for Endless Inspiration!
The easiest way to sell websites (and get paid for discovery!)
Переглядів 7 тис.6 місяців тому
The easiest way to sell websites (and get paid for discovery!)
They said my design would be too difficult to build... 🤷 Even called it "abusive" to developers...
Переглядів 3,5 тис.6 місяців тому
They said my design would be too difficult to build... 🤷 Even called it "abusive" to developers...
You'll never UNSEE this amateur design mistake (how to avoid "stripey" layouts on websites)
Переглядів 25 тис.6 місяців тому
You'll never UNSEE this amateur design mistake (how to avoid "stripey" layouts on websites)
Is this $5 host a potential replacement for Cloudways?
Переглядів 3,2 тис.7 місяців тому
Is this $5 host a potential replacement for Cloudways?
Top Tips for Typography: Tools & strategies to improve responsiveness, balance, and accessibility!
Переглядів 3,2 тис.7 місяців тому
Top Tips for Typography: Tools & strategies to improve responsiveness, balance, and accessibility!
Download My Brand New GeneratePress + GenerateBlocks Template!
Переглядів 5 тис.7 місяців тому
Download My Brand New GeneratePress GenerateBlocks Template!

КОМЕНТАРІ

  • @Line49Design
    @Line49Design 3 години тому

    I'm curious: how much of this functionality does Generate Blocks have built in? We're using Kadence, which has visibility and basic conditions built into blocks, as well as a Header and Navigation builder based on blocks ... which in turn lets you build menus with these attributes. FYI

  • @AndrewDForbes1984
    @AndrewDForbes1984 11 годин тому

    Slick - Great use of the plugin! Gives me lots of ideas to try. Thanks Kyle!

  • @NathanAshe-xj7zv
    @NathanAshe-xj7zv 17 годин тому

    Ahhh yes, something to bury my head in. Already know I need this video, you should see the change in my work since I started watching in about 2023!

  • @t.rosche
    @t.rosche 20 годин тому

    I have not used CSS grid to anywhere near its potential. This video makes me want to rejigger a page or three on my website so I can play. Unfortunately, it also makes me feel like I have go back and update or maybe recreate a whole bunch of my saved block layouts. Thanks, I think!?!? 😆

    • @TheAdminBar
      @TheAdminBar 15 годин тому

      Well, you can always take what you learn and apply it going forward. That's what I do (for the most part). Anything new today is old tomorrow, so it's a losing battle trying to keep everything up to date 🤣

  • @darwinspradlin7806
    @darwinspradlin7806 День тому

    If you are using the back-to-top button, is this the best solution? @media (max-width: 767px) { .generate-back-to-top { bottom: 75px; }

  • @collegeofsocialsciencesuhm2259

    Mahalo from the University of Hawaiʻi :)

    • @TheAdminBar
      @TheAdminBar 15 годин тому

      Oh wow 👋 Great to have you!

  • @darwinspradlin7806
    @darwinspradlin7806 2 дні тому

    The 'Order' field is not available in my version when you click the selector and navigate to the alignment settings. GenerateBlocks Version 1.9.1 GenerateBlocks Pro Version 1.7.1 GP Premium Version 2.5.0

    • @TheAdminBar
      @TheAdminBar 2 дні тому

      Sorry about that, I failed to mention this is all the 2.0 beta. It was scheduled to be released long before this video came out, but it keeps being delayed.n

    • @darwinspradlin7806
      @darwinspradlin7806 2 дні тому

      @TheAdminBar no worries 👍

  • @zavgraphics1067
    @zavgraphics1067 2 дні тому

    how to update in generateblock 2.0 ?... in wordpress pluggin there is not availabe 2.0 version...!

    • @TheAdminBar
      @TheAdminBar 15 годин тому

      Log into your account and you can download it. It's currently a release candidate.

  • @MrOliver1444
    @MrOliver1444 2 дні тому

    It would be cool to see how grid works for tablet and mobile

  • @christinejanischewski
    @christinejanischewski 3 дні тому

    What is the offer for MyWebAudit? Your link just shows their regular pricing?

  • @nikolaqvar
    @nikolaqvar 3 дні тому

    Great video as always. Just a small suggestion, maybe you should have shown even numbers, and aligned the elements based on their number position.

  • @PaymanAhadi
    @PaymanAhadi 5 днів тому

    Hi Kyle, First of all, I want to sincerely thank you for the incredible educational videos you share on your channel about GeneratePress and GenerateBlocks. Your tutorials are not only practical but also game-changers for designers like me. I was wondering if you could create a comprehensive and highly practical video on customizing WooCommerce product pages using GeneratePress and GenerateBlocks alone, without relying on additional plugins. It would be immensely helpful to see a step-by-step guide from you on achieving a fully customized product page. Your expertise and clear explanations make complex tasks so much easier, and I believe such a tutorial would be highly valuable for many of your followers. I really hope you’ll consider this request! Thank you so much for everything you do, and looking forward to your next video! Best regards,

  • @agoogleuser2081
    @agoogleuser2081 6 днів тому

    So you used the AI to make a plugin. Anyone can do this now. This is nothing special.

    • @TheAdminBar
      @TheAdminBar 6 днів тому

      Sorry for the shitty life you must have. Hope trolling people on UA-cam gives you some glimmer of comfort in what must be a miserable existence

    • @agoogleuser2081
      @agoogleuser2081 6 днів тому

      @@TheAdminBar Yes. Mission achieved. I ruined the wankers day. This so called expert is a joke. Your a joke to me.

  • @Sastoritactic
    @Sastoritactic 7 днів тому

    I thought I am somewhat advanced CSS Wordpresser - but at the beginning of the video I only had a guess on what you're about to do, but not the actual code. Thanks for reminding me of that selector. Good job! 👏

  • @ashrafulalam1734
    @ashrafulalam1734 7 днів тому

    Genius ❤ 🇧🇩

  • @miguel213
    @miguel213 7 днів тому

    CSS Wizardry 🪄🤘

  • @ManuelDiaz-ee3wx
    @ManuelDiaz-ee3wx 7 днів тому

    So, what's the plugin for the whole CSS integration to the block editor? Sorry, I'm new here

    • @TheAdminBar
      @TheAdminBar 7 днів тому

      That's just GenerateBlocks :) I am using the latest beta version in this video.

    • @Line49Design
      @Line49Design 7 днів тому

      ​@@TheAdminBar Yes, it's good that you have the GB logo in the thumbnail. It's tedious for you to have to repeat, but probably best if every video like this continues to state prominently that it's aimed at GB users, since everyone else might miss that and be confused.

    • @groovebird812
      @groovebird812 7 днів тому

      @@TheAdminBar could we do that without GenerateBlocks or is it necessary? Why do you add a class and set all the css via the user interface?

  • @leonardo_iann
    @leonardo_iann 7 днів тому

    Super <3

  • @tjsayers5428
    @tjsayers5428 7 днів тому

    This is great. A perfect example of “the computer” replacing manual work and saving time. Thank you for the code and demo.😊

    • @TheAdminBar
      @TheAdminBar 7 днів тому

      Glad you enjoyed it 🙌 Thanks for the support!

  • @indianbloggerco
    @indianbloggerco 7 днів тому

    Love From India, I learn many things from your videos. Please make video for mega menu using generatepress and sliding testimonials. Thanks & Regards Web Karo India

    • @TheAdminBar
      @TheAdminBar 7 днів тому

      Send me some examples of what you're looking for. Mega menu and sliding testimonials can take many forms!

  • @Wilkooo
    @Wilkooo 9 днів тому

    Which Beta version is this? Blocks Pro Version 2.0.0-beta.8 hasn't got it yet.

    • @TheAdminBar
      @TheAdminBar 8 днів тому

      This may have been Beta 7 or 8 - I don't recall exactly.

  • @keets97
    @keets97 10 днів тому

    Very helpful video! The first question I have is that I am noticing an issue where even my category pages are getting returned in the search results. Is there a way to ensure that only posts are returned on the search results page? Additionally, can you please provide the Post Meta Field for Yoast SEO, as that is the plugin I use and I'm not able to find it online myself.

  • @adamwrightdesign
    @adamwrightdesign 13 днів тому

    Epic demo, I'm continuing to learn more and more about CSS grid thanks to you! Love these simple and easy walkthroughs 🙌

  • @MrOliver1444
    @MrOliver1444 14 днів тому

    Great vid. Very useful

  • @keirwatson3570
    @keirwatson3570 14 днів тому

    Great stuff. One tip: I think using negative track numbers for the right hand edge of content that spans the centre of the design is better (e.g. for the featured image, span: 1/-1 rather than 1/12) because if you change the number of columns (say to eight or fourteen) it will still span the full width as desired, without causing overflow or …um.. ‘underflow’?

    • @TheAdminBar
      @TheAdminBar 14 днів тому

      Yes, I love doing that too! There were so many things I wanted to talk about, but tried to cut down for the sake of simplicity knowing that the people asking the questions that spurred this video really need an "intro" to Grid. Like I said - the interesting thing about grid is that it can be as simple or as complex as you want 🤣

  • @Wirelez
    @Wirelez 19 днів тому

    sigh.... "Purchase the Premium plan to activate CSS customization"

  • @CWS-lv6mg
    @CWS-lv6mg 20 днів тому

    any plans on an updated vid? The plugin has changed since ;-)

  • @CWS-lv6mg
    @CWS-lv6mg 20 днів тому

    Edge cache is also available with Free Cloudflare

  • @tylergebhard
    @tylergebhard 20 днів тому

    true, but like... bring it into GP/WP. am i missing an episode? i gotta figure out how to USE grids BETTER within GP

    • @TheAdminBar
      @TheAdminBar 20 днів тому

      I'd be happy to do a follow up :) Which of the 3 layouts that I showed at the end would you most like to see @tylergebhard ?

    • @DavePerth
      @DavePerth 18 днів тому

      @@TheAdminBar The first/main one would be good!

    • @TheAdminBar
      @TheAdminBar 16 днів тому

      Publishing a follow up where we take this concept into GP/GB on Wednesday @DavePerth!

  • @nahuellion
    @nahuellion 20 днів тому

    thank you, it did work perfectly on my computer, there is only 1 problem... when i look from a mac/ iphone otr Ipad.. the effect does'nt work anymore. do you know why?

  • @badcatdesign
    @badcatdesign 21 день тому

    I'm a fan of Piet Mondrian's "grids". No need for the lines to be evenly spaced 🧇 👍 🥳

  • @SparaCash
    @SparaCash 21 день тому

    Hey Kyle, just to let you know - last few videos have only had audio in the left ear. Maybe something you can check in your export settings. It's a bit annoying to listen to in headphones. FYI :) Keep it up!

    • @TheAdminBar
      @TheAdminBar 21 день тому

      Woah supe strange! Thanks for the heads up - I don't know what's gone wrong!

    • @TheAdminBar
      @TheAdminBar 21 день тому

      So, I just checked with my headphones on the computer and on my phone, and both channels seem to be working fine on my end 🤔

    • @SparaCash
      @SparaCash 21 день тому

      @@TheAdminBar That's odd! I have normal audio from your video "Create a horizontal scroller" then from "GenerateBlocks NEW Dynamic Data System" and the ones after, I only hear audio on left ear. 🤔it's not only left ear, but it's a lot louder than on right ear

    • @TheAdminBar
      @TheAdminBar 21 день тому

      Verrry strange. I'm gonna keep digging into it!

  • @rogerbruce2896
    @rogerbruce2896 22 дні тому

    where are some good places to sell websites? Any place better than godaddy or afternic?

  • @TheAdminBar
    @TheAdminBar 22 дні тому

    You probably don't share UA-cam videos often - but if you enjoy this video, I'd love if you considered sharing this with any of your developer friends or communities 🙏

  • @muzameltamas
    @muzameltamas 23 дні тому

    Fluent Forms URL redirect string, I wanted to display it on the Thank You page, like in the video. But it doesn't work.

  • @Andriansahj
    @Andriansahj 25 днів тому

    Thanks Kyle, this give me new idea for my new project.

  • @BuildBusinessOnline
    @BuildBusinessOnline 25 днів тому

    Very helpful, Kyle. Thank you.

  • @julr7413
    @julr7413 26 днів тому

    One question - Do you create new account for every client? Or rather add client's domains to your Cloudflare account?

  • @jessegoplen
    @jessegoplen 26 днів тому

    I'm waiting for GB 2.0 launch to begin working with it on my site and you are my favorite UA-camr right now.

  • @barsk76
    @barsk76 27 днів тому

    Thank you so much for the tutorial. I would love to see if this design can be done with Elementor Pro?

  • @RohanGillett
    @RohanGillett 27 днів тому

    This video was a real eye-opener for me. The container width was an "Ah huh" moment. I've had my website for a long time and I've left most of it on default. That meant my containers were full-screen. When I heard "make it smaller", a light in my head finally went on. I tested it with one post and noticed a huge difference. It changed the balance of the page layout in a positive way. It looked like a book! Now it is easier to read. Actually, much of what this video contained is now being included in my blog. I have 500 posts so it's going to take a long time. Still, I feel The Admin Bar has pushed me in the right direction. Many, many thanks :)

  • @Andriansahj
    @Andriansahj 27 днів тому

    I have question, how can I set the wrapper if the page is set to full width?, some of the container is set to full width

  • @geekiro
    @geekiro 27 днів тому

    Hello, with the help of a views plugin, can we order posts according to the number of views? Using Meta Key? If so, which plugin would be compatible? Could you make a video about this? I think a lot of website owners are looking for such a feature. Thanks!

  • @Badprop7
    @Badprop7 28 днів тому

    Seeing that you know Taylor Drayson can you ask him how to do this "Automatically calling custom functions in GenerateBlocks" and make a video about it?

  • @MrOliver1444
    @MrOliver1444 28 днів тому

    Container queries are so cool. Thanks for the vid. It is not so easy but I guess i have to practise it.

  • @MrOliver1444
    @MrOliver1444 28 днів тому

    Great video, thanks for that

  • @leonardo_iann
    @leonardo_iann 28 днів тому

    Thanks Kyle! Waiting for next videos, can't wait to see what beautiful stuff we can achieve now! Ah ps: happy new year :D