Design with Cracka
Design with Cracka
  • 172
  • 676 396
How to Setup - Sidebar Menu for Oxygen New features
How to setup the Multi-Level Sidebar Slide Navigation Template for Oxygen Builder
GET THIS TEMPALTE: designwithcracka.gumroad.com/l/ResponsiveSidebarSlideNavigationTemplateforOxygenBuilder
ALL ACCESS MEMBERSHIP (40% OFF for a limited time) :
designwithcracka.gumroad.com/l/DesignwithCrackaMembership/trust-40-off
Checkout more Templates at
designwithcracka.gumroad.com/
Bricks Builder | Oxygen Builder | Breakdance Builder | WordPress | Tutorial
#bricksbuilder #bricks #breakdancebuilder #oxygen #oxygenbuilder #wordpress
Join this channel to get access to perks:
ua-cam.com/channels/YdiyuV6R2_NhCae84yFhBw.htmljoin
CHECKOUT MY PREMIUM TEMPLATES/COMPONENTS
designwithcracka.gumroad.com/
GET MEMBERSHIP ACCESS TO ALL MY PREMIUM COMPONENTS/TEMPLATES
designwithcracka.gumroad.com/l/DesignwithCrackaMembership
FACEBOOK GROUP: groups/designwithcracka/
FOLLOW ON TWITTER: udoroessien
BOOK A 1-HOUR CONSULATION
calendly.com/designwithcracka/consultation-meeting
GOT A PROJECT? HIRE ME: udoroessien@gmail.com
--------------------------------------------------------------
Get Breakdance - A record breaking visual builder for WordPress
breakdance.com/ref/50/
--------------------------------------------------------------
GET ACCESS TO MY ADVANCED & INDEPTH TUTORIALS
geary.co/inner-circle/ref/1/
--------------------------------------------------------------
GET AUTOMATIC.CSS - A time saving utility class for WordPress websites
automaticcss.com/ref/37/
--------------------------------------------------------------
GET FRAMES - getframes.io/ref/1/
Frames is a real time wireframing tool, design-ready development system, and accessible component library
--------------------------------------------------------------
GET MOTION.PAGE - Interact & animate any WordPress site
motion.page/go/dwc/
--------------------------------------------------------------
GET RECODA WORKSPACE - Advance workspace for Oxygen Builder
recoda.me/workspace-store?via=dwc
______________________________________
SIGN UP WITH INSTAWP PRO
app.instawp.io/register?ref=umDnu9Wfos
--------------------------------------------------------------
GET YABE WEBFONT - Custom fonts management and self-host Google Fonts with seamless WordPress page builders integration
webfont.yabe.land/?ref=11
=============================================
DISCLAIMER: This video or description contains affiliate links, which means that if you click on one of the product links, you'll be supporting the channel, and I’ll receive a small commission.
=============================================
Переглядів: 239

Відео

Dynamic INLINE Quickview Grid for Bricks Builder
Переглядів 7503 місяці тому
Get the Dynamic Inline Quickview Grid! An elegant and accessible way to preview your content within a grid in BRICKS BUILDER , with features designed make your content presentation more professional. Quick view for team members, products, listings, post etc., any custom post type. GET THIS COMPONENT: designwithcracka.gumroad.com/l/DynamicInlineQuickviewGridforBRICKSBUILDER GET BRICKS BUILDER AL...
CSS Logical Properties Made Easy: A Beginner's Guide with Fun Examples!
Переглядів 1,3 тис.3 місяці тому
Ready to make your web design smarter and more adaptable? In this beginner-friendly tutorial as we dive into CSS logical properties and learn how to create layouts that look great in any language or direction with simple, fun examples. By the end, you'll have the skills to make your CSS flexible and future-proof. Join this channel to get access to perks: ua-cam.com/channels/YdiyuV6R2_NhCae84yFh...
The Hidden CSS Property You Should Be Using for Better UX!
Переглядів 1,3 тис.4 місяці тому
The Hidden CSS Property You Should Be Using for Better UX! CSS tips | Bricks Builder | Oxygen Builder | Breakdance Builder | WordPress | Tutorial #css #css3 #bricksbuilder #bricks #breakdancebuilder #oxygen #oxygenbuilder #wordpress Join this channel to get access to perks: ua-cam.com/channels/YdiyuV6R2_NhCae84yFhBw.htmljoin CHECKOUT MY PREMIUM TEMPLATES/COMPONENTS designwithcracka.gumroad.com/...
FREE Dynamic Ticker Slider for Oxygen Builder
Переглядів 7926 місяців тому
I'm giving this away for FREE! designwithcracka.gumroad.com/l/DynamicTickerSliderforOXYGENBUILDER/oxy-100-free The Dynamic Ticker Slider is a integrates with Oxygen's repeater feature and supports Advanced Custom Fields (ACF) and Metabox, making it a great solution for displaying dynamic content. This tool can also be utilized for static content, providing flexibility for various use cases. Bri...
Dynamic Post Lightbox (Quick View) for Breakdance Builder WordPress
Переглядів 1,4 тис.6 місяців тому
This Dynamic Lightbox (Quick View component) seamlessly integrates with BREAKDANCE BUILDER , with features designed make your content presentation more professional. GET THIS COMPONENT: designwithcracka.gumroad.com/l/DynamicPostLightboxforBREAKDANCEBUILDER GET ALL ACCESS MEMBERSHIP (40% OFF for limited SLOTS) : designwithcracka.gumroad.com/l/DesignwithCrackaMembership/trust-40-off Bricks Builde...
Breakdance Pro WordPress Review | should you switch from Elementor?
Переглядів 4 тис.6 місяців тому
Breakdance offers a perfect blend of flexibility and power, allowing you to try before you buy. GET BREAKDANCE BUILDER: breakdance.com/ref/50/ Timestamp: 00:00 - Intro 02:00 - Pricing 03:40 - Features overview 06:05 - Elements demo 10:19 - Breakdance Migration Mode 11:09 - Easy Layout tools 17:05 - Header and Menu Builder 21: 57 - Design Library 24:00 - WooCommerce Integration 26:52 - Entrance/...
Presets in Breakdance vs Classes in Bricks/Oxygen WordPress Builders
Переглядів 2,1 тис.6 місяців тому
Breakdance Builder Review: Let's explore how the new Preset feature of Breakdance 2.0. compares to Bricks Builder's classes in the area of ease of use, maintainability/Scalability, and user-friendliness. GET BREAKDANCE BUILDER: breakdance.com/ref/50/ Timestamp: 00:00 - Intro 02:00 - Preset vs Class: Premade components 08:31 - Preset vs Class: Custom components 19:10 - Preset vs Class: Ease of u...
First Look At The New Features Coming to Breakdance 2.0 | WordPress Page Builder
Переглядів 3,7 тис.7 місяців тому
Let's explore the exciting new features of Breakdance 2.0. With an enhanced layout engine and a robust preset feature, version 2.0 propels Breakdance to new heights, continuing its mission to dominate with unparalleled user-friendliness. GET BREAKDANCE BUILDER: breakdance.com/ref/50/ Timestamp: 00:00 - Intro 01:44 - Enhanced Layout engine 05:13 - Component Preset 09:23 - Copy/Paste control sect...
New Features! Sidebar Navigation Builder 2.0 for Bricks Builder
Переглядів 2,2 тис.7 місяців тому
Check out the new features of the High quality Responsive Sidebar Slide Navigation Template for Bricks Builder with Infinite slide levels. This template comes with a fully setup sidebar & header layout. GET THIS COMPONENT: designwithcracka.gumroad.com/l/ResponsiveSidebarSlideNavigationTemplateforBricksBuilder GET ALL ACCESS MEMBERSHIP (40% OFF for limited SLOTS) : designwithcracka.gumroad.com/l...
Fancy sticky header for BREAKDANCE BUILDER WORDPRESS
Переглядів 3127 місяців тому
Revolutionize the way you design and present your website headers. Get Fancy sticky header for BREAKDANCE: designwithcracka.gumroad.com/l/FancyStickyHeaderforBREAKDANCE DEMO: breakdancetuts.designwithcracka.com/fancy-header/ CHECKOUT MY PREMIUM TEMPLATES/COMPONENTS designwithcracka.gumroad.com/ GET MEMBERSHIP ACCESS TO ALL MY PREMIUM COMPONENTS/TEMPLATES designwithcracka.gumroad.com/l/Designwit...
Dynamic Post Lightbox (Quick View) for Oxygen Builder
Переглядів 5347 місяців тому
This Dynamic Lightbox (Quick View component) seamlessly integrates with OXYGEN BUILDER , with features designed make your content presentation more professional. GET THIS COMPONENT: designwithcracka.gumroad.com/l/DynamicPostLightboxforOXYGENBUILDER GET ALL ACCESS MEMBERSHIP (40% OFF for limited SLOTS) : designwithcracka.gumroad.com/l/DesignwithCrackaMembership/trust-40-off Bricks Builder | Oxyg...
Dynamic Post Lightbox (Quick View) for Bricks Builder
Переглядів 1,8 тис.7 місяців тому
This Dynamic Lightbox (Quick View component) seamlessly integrates with BRICKS BUILDER , with features designed make your content presentation more professional. GET THIS COMPONENT: designwithcracka.gumroad.com/l/DynamicPostLightboxforBRICKSBUILDER GET ALL ACCESS MEMBERSHIP (40% OFF for a limited time - 3 SLOTS LEFT!) : designwithcracka.gumroad.com/l/DesignwithCrackaMembership/trust-40-off Bric...
Infinite Scrolling Cards & Fancy Sticky Header - Bricks | Oxygen | WordPress
Переглядів 2,2 тис.9 місяців тому
Checkout Design with Cracka's two new Components available right now - Infinite Scrolling Cards Section & Fancy Sticky Header. Available for Bricks and Oxygen. Bricks Builder | Oxygen Builder | WordPress | Tutorial #oxygen #oxygenbuilder #wordpress #bricksbuilder #bricks Join this channel to get access to perks: ua-cam.com/channels/YdiyuV6R2_NhCae84yFhBw.htmljoin CHECKOUT MY PREMIUM TEMPLATES/C...
Sidebar Navigation Builder for BREAKDANCE BUILDER is ready!
Переглядів 3,1 тис.Рік тому
How to setup the Multi-Level Sidebar Slide Navigation Template for Breakdance Builder GET THIS TEMPALTE: designwithcracka.gumroad.com/l/ResponsiveSidebarmulti-levelSlideNavigationTemplateforBREAKDANCEBUILDER ALL ACCESS MEMBERSHIP (40% OFF for a limited time) : designwithcracka.gumroad.com/l/DesignwithCrackaMembership/trust-40-off Checkout more Templates at designwithcracka.gumroad.com/ BOOK A 1...
Smart Centered logo header for Bricks Builder - NEW PREMIUM COMPONENT
Переглядів 1,6 тис.Рік тому
Smart Centered logo header for Bricks Builder - NEW PREMIUM COMPONENT
Sidebar Slide Navigation Builder for Bricks - COMPONENT
Переглядів 4,2 тис.Рік тому
Sidebar Slide Navigation Builder for Bricks - COMPONENT
Sidebar Slide Navigation Builder for Oxygen - TEMPLATE RELEASE
Переглядів 2 тис.Рік тому
Sidebar Slide Navigation Builder for Oxygen - TEMPLATE RELEASE
Create Modern Parallax Portfolio landing page in WordPress | Breakdance Builder
Переглядів 8 тис.Рік тому
Create Modern Parallax Portfolio landing page in WordPress | Breakdance Builder
Interview with Louis - founder of Breakdance Website Builder
Переглядів 2,8 тис.Рік тому
Interview with Louis - founder of Breakdance Website Builder
Switch Bricks Builder Nestable Tabs to accordion on mobile with Advance CSS Grid layout.
Переглядів 3,1 тис.Рік тому
Switch Bricks Builder Nestable Tabs to accordion on mobile with Advance CSS Grid layout.
Modern layout with inverted border radius and text wrap in Breakdance Website Builder for WordPress
Переглядів 12 тис.Рік тому
Modern layout with inverted border radius and text wrap in Breakdance Website Builder for WordPress
Master Tricky CSS Grid Layout in Bricks Builder | WordPress Tutorial
Переглядів 9 тис.Рік тому
Master Tricky CSS Grid Layout in Bricks Builder | WordPress Tutorial
Breakdance Single site License now available | WordPress Website Builder
Переглядів 860Рік тому
Breakdance Single site License now available | WordPress Website Builder
Breakdance WordPress Website Builder Tutorial - The Basics | Free download
Переглядів 8 тис.Рік тому
Breakdance WordPress Website Builder Tutorial - The Basics | Free download
Intro to Interactions - Bricks interactions and animations tutorial | WordPress Tutorial
Переглядів 13 тис.Рік тому
Intro to Interactions - Bricks interactions and animations tutorial | WordPress Tutorial
5 WordPress Tips to know before building a new WordPress Website
Переглядів 6 тис.Рік тому
5 WordPress Tips to know before building a new WordPress Website
Custom CSS in Bricks Builder for an efficient workflow | How to CSS Tutorial | WordPress Tutorial
Переглядів 4,9 тис.Рік тому
Custom CSS in Bricks Builder for an efficient workflow | How to CSS Tutorial | WordPress Tutorial
First Look at Breakdance 1.4 Beta CSS Grid - Visual Builder for WordPress
Переглядів 3,1 тис.Рік тому
First Look at Breakdance 1.4 Beta CSS Grid - Visual Builder for WordPress
How to use Oxygen Builder's CSS Grid feature 🌟- WordPress Tutorial
Переглядів 3 тис.Рік тому
How to use Oxygen Builder's CSS Grid feature 🌟- WordPress Tutorial

КОМЕНТАРІ

  • @moallaacademy
    @moallaacademy 6 годин тому

    from elementor i switched to bricks. it is great especially for dynamic websites...

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

    thank you, awesome tutorial! I applied everything, just when scaling the browser window, video does not scale properly together. not a big issue, but any way to fix this?

  • @mimam-hebron
    @mimam-hebron 2 дні тому

    Thank you.

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

    this is the best video on css grids for oxygen builder -- no question at all. been wracking my brain trying to figure out how to do this + you've solved it in 25 minutes!!!

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

    I’m switching from Elementor to Breakdance and no turning back. It offers greater customization, is more straightforward, easier to use, incredibly fast, and not bloated like Elementor. Plus, there’s no need for third-party plugins to support customization.

  • @GeneralEnthusiast
    @GeneralEnthusiast 17 днів тому

    Hey brother. Please recreate this for a Breakdance workflow. Thanks

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

    Thank you Mr. Cracka 🙏 Parent element had overflow auto

  • @Luca-ui3rn
    @Luca-ui3rn 21 день тому

    Thx for this video- could you pls make this Video for bricks?

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

    any possible to put the swatch select on quick view?

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

      You can use the default variation select, custom swatch isn't supported.

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

      @@DesignwithCracka thanks for your reply

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

    Hello, does this menu allow for arrow based navigation? I tried the demo site and it is really great, but it appears using arrows for navigation only effects the page scrollrather than the active menu. This is looking like a really good option

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

      Menu navigation typically supports tab key to navigate and enter key select. This menu is navigable with the keyboard via the tab and enter keys.

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

    Is this menu navigable through the use of arrow keys? Including dropdowns?

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

    Great. And how would I make the two column divs equal height? This is important to scale the image on smaller viewport when content column get's taller than the image - it would be great to keep the image same height and horizontally cropped. Because adding height:100% to the divs does not work...

  • @tristanabais1044
    @tristanabais1044 29 днів тому

    To make it more efficient, just use one slider and replace the pagination with thumbnails. ;-)

  • @jose-kb1dg
    @jose-kb1dg Місяць тому

    This saves a lot of time. i use it on my company site, and it got much better. Thank you for sharing this tutorial.

  • @matthewbaker5593
    @matthewbaker5593 Місяць тому

    This is perfect, I was looking for this exact grid layout, but as I’m not using the ‘post’ element I can’t figure out how you would link each card to my single post template? Any pointers would be greatly appreciated. Keep the tutorials coming , I’m learning a lot from them 🤘

  • @RR-ok4wz
    @RR-ok4wz Місяць тому

    great video, but I'm so lost! =(

  • @planinakosmaj
    @planinakosmaj Місяць тому

    Awesome video, that pulse icon is very cool feature 😮😀🤟

  • @moriartythenavigator1945
    @moriartythenavigator1945 Місяць тому

    Such a genius..GOSH!! Thank you!

  • @jhustice15
    @jhustice15 Місяць тому

    How can I get the Oxygen elements for woocommerce

  • @aryan2405
    @aryan2405 Місяць тому

    Are the templates of the design library you showed... available in the free version of break dance?

  • @dsolarium
    @dsolarium Місяць тому

    Really valuable information: Check the responsivness with the inspect tool - don't rely on the builder to show a true representation of the front-end. I've started doing this and I feel alot more productive. Thanks so much Design With Cracka.

  • @Tepraider
    @Tepraider Місяць тому

    Tried it for 2 headings in 2 slides, and well it didn't work It just resets after some time, doesn't loop perfectly.

  • @ytstudio-d
    @ytstudio-d Місяць тому

    great feature and thank you very much, is there such an option from the picture?

  • @diagosa
    @diagosa Місяць тому

    So helpfull tutorial, thanks❤

  • @Sebastien_Dottin-SDOweb
    @Sebastien_Dottin-SDOweb Місяць тому

    Excellent ! Thanks 👍

  • @mimam-hebron
    @mimam-hebron Місяць тому

    Definitely classes for me

  • @bishal.dangol
    @bishal.dangol Місяць тому

    can you share us templates for free?? please

  • @dausone
    @dausone 2 місяці тому

    Helpful. But not very responsive in my experience by using the advanced slider out of the box. However, you can do the same full screen adjustments on a section with a basic slider. The basic slider will give you a much more responsive experience and much faster to set up. Maybe you can consider doing a more simple and faster tutorial with the basic slider to help people out.

  • @ManuelGraphFilms
    @ManuelGraphFilms 2 місяці тому

    I watched the whole vid somehow expecting a tutorial and it ended up being a sale

  • @moriartythenavigator1945
    @moriartythenavigator1945 2 місяці тому

    Thank you very much !! Brilliant and Generous as Always

  • @koebanimedia
    @koebanimedia 2 місяці тому

    @Designwithcracka, is it possible to replicate this functionality in Oxygen Builder and what should I take note of?

  • @gurjotgrewal5169
    @gurjotgrewal5169 2 місяці тому

    i did this and for some reason on front end it's empty not showing anything. But when im editing its working well. any tips?

  • @dsolarium
    @dsolarium 2 місяці тому

    I love this guy and his channel - he's so knowledgeable. Everything he shows us will work exactly 💯 how he says it will.

  • @litmol
    @litmol 2 місяці тому

    Thank you very much for another profound and well explained tutorial. I did to things improve the final outcome: Firstly, I combined auto-fit and minmax into the repeat function to get a smoother transition (something I learned from Cracka - thank you). Secondly, I set the span 2 (for the first child) for screen size larger than mobile portrait viewpoint, in order to get a one column (squeezing two columns was too narrow for me).

  • @moriartythenavigator1945
    @moriartythenavigator1945 2 місяці тому

    Hands-down the best Oxygen Builder tutorials on UA-cam. Always shows us how to make the design responsive, which is SO important.

  • @hoanglegia7367
    @hoanglegia7367 2 місяці тому

    thanks. first and second reason help me out.

  • @space-between2023
    @space-between2023 2 місяці тому

    I did it the same way, but my divs are not the height I filled in

  • @obito-269
    @obito-269 2 місяці тому

    very helpful, thank you!

  • @neonflux2221
    @neonflux2221 2 місяці тому

    Oh My Dayz !! Ordering the cards was so simple - I can't believe I spent so much time trying to figure this out. Thank you SO MUCH !!!

  • @neonflux2221
    @neonflux2221 2 місяці тому

    Brilliant !!

  • @stevereid636
    @stevereid636 2 місяці тому

    You put review in the title, but this is more like a sales pitch. If you’re not going to have an objective viewpoint, then it shouldn’t be called it a review

    • @DesignwithCracka
      @DesignwithCracka 2 місяці тому

      Tell me one thing I mentioned that’s not objective. Besides, reviews are both objective and subjective, because to a certain degree it’s based on the reviewers perception. You can add your objective take in the comment section if I left something out.

  • @mdqmatias
    @mdqmatias 2 місяці тому

    Isn't easier to create the shape in a svg transparent, and the apply the svg as a mask to the main container and then yes put the button with absolute, etc...

    • @DesignwithCracka
      @DesignwithCracka 2 місяці тому

      Try it and let us know, with responsiveness :)

  • @peterodehnal3708
    @peterodehnal3708 2 місяці тому

    Hello Cracka, I have a somewhat long sales landing page and want to have an in-page navigation option so users can scroll up and down the page. Does your Sidebar Slide Navigation Builder for Oxygen (template) work well in this scenario? Also, is it compatible with the latest version of Oxygen (v4.9)? Many thanks. ~P.

    • @DesignwithCracka
      @DesignwithCracka 2 місяці тому

      Hi Peter, yes the sidebar works well with in-page navigation, and it's compatible with the latest version of Oxygen.

  • @obito-269
    @obito-269 2 місяці тому

    thanks!

  • @CaterStudios
    @CaterStudios 2 місяці тому

    Yes what you miss is that, classes should be added before you begin styling an element. After styling and you add a class only style changes made after that are carried over to that class and connected component.

    • @DesignwithCracka
      @DesignwithCracka 2 місяці тому

      www.loom.com/share/6ef054d2e16b401fb82caf9ac1f8fbb5?sid=20e4ae2b-0705-446c-be81-5c9ffb928bc7

  • @obito-269
    @obito-269 2 місяці тому

    thank you! 👍

  • @cuba32-atasteofcuba
    @cuba32-atasteofcuba 2 місяці тому

    Very well constructed video