As the WordPress Gutenberg block editor evolves, new features are being added to make content creation easier. And block patterns may just be the most exciting addition for both web designers and their clients.
Celý článek
PublishPress Blocks – Advanced Gutenberg Blocks, Permissions, Layouts, Forms
Styling Wide and Full-Width Gutenberg Blocks in WordPress
The Gutenberg block editor for WordPress has changed how we create content within the CMS. But it’s also opened up some new possibilities on the front end as well. Pokračovat ve čtení „Styling Wide and Full-Width Gutenberg Blocks in WordPress“
Posts Like Dislike
Line Awesome
Font Awesome is well, awesome, but our data shows that people actually like line icons even more. Since Icons8 is all about making people happy, we made Line Awesome as a free alternative to Font Awesome 5.11.2.
Line Awesome consists of ~1380 flat line icons that offer complete coverage of the main Font Awesome icon set. This icon-font is based off of the Icons8 Windows 10 style, which consists of over 4,000 icons, so be sure to check that out if you need more specific icons.
Scroll Timeline (jQuery)
FakerPress
Page Builder Gutenberg Blocks – CoBlocks
CSS Timeline
Learn how to create a responsive „timeline“ with CSS. Pokračovat ve čtení „CSS Timeline“
jQuery Document Ready Function For WordPress
You can set up a jQuery document ready function for use with WordPress and use the jQuery library that WordPress ships with rather than use another one. Here are three ways to use jQuery document ready function with WordPress.
Usually, a jQuery document ready function is expressed as below.
1 2 3 | $(document).ready(function(){ }); |
jQuery document ready 1st way
WordPress loads its own jQuery library in what is known as ‘no conflict mode‘ and the $
selector or variable that defines jQuery doesn’t work with the WordPress loaded jQuery version, so it has to be expressed more like so…
1 2 3 4 5 | jQuery(document).ready(function($){ // Code goes here }); |
Here we are using jQuery
at the beginning of the document ready function and then passing or binding that to the $
selector, so now anywhere else in the code you can use the $
selector.
jQuery document ready 2nd way
There is also a shorthand version of the jQuery document ready function.
1 2 3 4 5 | jQuery(function($) { // Code goes here }); |
Same issue here, using the jQuery
at the beginning.
jQuery document ready 3rd way
Another way is to add the document ready code is inside a Javascript function…
1 2 3 4 5 6 7 8 9 | (function($){ $(function() { // Code goes here }); })(jQuery); |
The outer Javascript function is known as an anonymous function and jQuery is wrapped at the end, so is therefore aliased or bound to the $
selector, so in the inner function the jQuery shorthand document does not need to be aliased.
Add the Javascript where needed or register and enqueue the script for usage.