-
Gutenberg Blocks Development – Live Reload
As I never menaged to set up WordPress/Scripts –hot I prefer to use Browser Sync Install NPM After instaling NPX Create block run: Then in the package.json update scripts section Replace ‘dev-wordpress.local’ with your local websute URL
Category: Gutenberg -
GitHub Action to create a release
With this workflow in place, creating a new release is as simple as pushing a version tag to your repository. The GitHub Action takes care of everything else for you. It checks out your code, sets up Node.js (using the latest LTS version), and installs your project’s dependencies if a package.json file is present. Once…
Category: GitHub -
Delete GitHub repository history
Deleting the .git folder may cause problems in your git repository. If you want to delete all your commit history but keep the code in its current state, it is very safe to do it as in the following: Checkout/create orphan branch (this branch won’t show in git branch command): Add all the files to…
Category: GitHub -
Developer Notes Page in the WordPress Admin
Add a private Dev Notes page to the WordPress admin for administrators: rich text, tables, images, autosave and an HTML view, no plugin.
Category: WordPress -
Display Side Editor in Hybrid Theme
Place this in function.php or use Scripts Organizer Code Snippet. We’ll let WordPress think it’s a block theme so the Editor shows up, but we’ll override template loading to use PHP templates like index.php. In your functions.php, override the block template resolution like this: This forces WordPress to always use index.php for rendering the front-end…
Category: Gutenberg -
Disable Default Block Patterns in WordPress
Disable the default WordPress core block patterns and the Pattern Directory patterns so the inserter only shows your theme’s own patterns.
Category: Gutenberg -
WordPress Countdown Timer Shortcode With Tailwind CSS
A WordPress countdown timer shortcode: days, hours, minutes and seconds to a date in your site’s timezone, styled with Tailwind CSS classes.
Category: WordPress -
Load Gutenberg Component Styles on a WordPress Settings Page
Make @wordpress/components on a WordPress plugin settings page look like in the block editor by loading the core component styles on that page only.
Category: Gutenberg -
Tailwind Starter Config files
Prepared config files to get you started fast with best practices
Category: Tailwind -
Load Scripts Organizer CSS/SCSS inside Gutenberg editor
Load the CSS of Scripts Organizer CSS or SCSS code blocks into the WordPress Gutenberg editor, so the editor canvas matches your site.
-
Custom Dashboard with Metabox
Great tutorial from John Aperture on how to create Admin Dashboard with Bricks and Metabox inspired by our previous tutorial Custom Dashboard with Visual Builders.
Category: MetaBox -
Replace the WordPress Dashboard With a Custom Page
Replace the WordPress admin dashboard with a page you built in Gutenberg, Bricks, Oxygen or Elementor, shown full width next to the admin menu.
Category: WordPress -
Style Oxygen Menu Element with Tailwind
Video Tutorial Basic oxygen structure with:div.container > list wrapper (with image inside) + menu element Front end preview Front end preview for mobile
-
Add a CSS Class to wp_nav_menu Links in WordPress
Add CSS classes, including Tailwind classes, to the links of a WordPress wp_nav_menu() with one extra argument, without replacing existing classes.
-
Enable Winden with conditions
Are working on the online shop or live website? Is always pain to migrate customers? You want to migrate page by page and not to redo entire website at once? In scenario where you have existing website and want to partially rebuild it and migrate to tailwind we are offering option to enable Winden only…
Category: Tailwind -
Show Reading Time in WordPress Without a Plugin
Show the estimated reading time of a WordPress post in your theme without a plugin: 200 words per minute plus time for images.
Category: WooCommerce -
Dequeue Gutenberg Block Inline Styles in WordPress
Remove the inline CSS WordPress prints for single Gutenberg blocks, like wp-block-group-inline-css, and keep the rest of the block styles.
Category: WordPress -
Toggle Between Two Elements in WordPress With a Button
Toggle between two elements in WordPress: one button switches between two content panels, for example monthly and yearly prices. No jQuery.
Category: JavaScript
3rd party plugins actions admin archive block-themes block editor Blocks block theme build capabilities core CSS Custom Post custom post types Developer development filters Front End full site editing gutenberg hook Image img load styles maintenance media mu-plugin Must Have npm Oxygen performance php plugins scripts organizer security SEO settings api single product theme.json Tips updates WooCommerce wordpress wp-cli WP Admin