Tips, Expertise, Articles and Advice from the Pro's for Your Website or Blog to Succeed
Welcome to day 6 of freebie week on Designrfix. Today we have assembled a stunning collection of high quality free Photoshop patterns and textures. So if you are in search of some really cool patterns and textures for your latest project, this post is not to be missed. Feel free to download and use them...
The post 60+ High Quality Free Photoshop Patterns and Textures appeared first on DesignrFix.
Gutenberg 11.6 landed yesterday. Contributors added dozens of enhancements and bug fixes. Admittedly, there was not a whole lot that excited me as a user about this release.
Typography options for the Post Title block. Nice.
Cropping for the Site Logo. A necessary addition.
Toolbar button for converting old Gallery blocks to the new — still experimental — format. Sweet.
For the most part, the release felt like a slew of routine enhancements that have been in the pipeline for those of us closely following the plugin’s development. Almost boring. And that is not a bad thing at all. Less excitement and smaller doses of iterative improvements can be healthy for the project and its developers. We do not always need to feel like we are chasing the next big thing. This is a well-rounded release that polishes many areas, from navigation to widgets to general block enhancements.
There were two features that I am happy to see movement on. That is the site editor’s Global Styles system and child theme support.
Global Styles is the system that will truly connect end-users to theme developers and vice versa for the first time in WordPress history. We have made some attempts at this, such as the customizer. However, this feature will handle it on top of the standardized block system.
Essentially, themes will talk to WordPress through their theme.json files, and users will speak the same language through the Global Styles panel.
For example, imagine a theme author sets up the default text color as black and the background as white. This will appear on the front end of the site but also be reflected in the site editor. The Global Styles interface allows users to change those two colors to something they prefer. They can also see of a preview of their color and typography styles in the box at the top of the panel.
And, it does not stop at a couple of simple colors. Users can modify all sorts of design aspects like typography and spacing at the root and block levels.
Gutenberg 11.6 adds a navigation component to the Global Styles sidebar. Overall, it feels much smoother working through the top and sub-levels while editing my theme’s styles.
This is sort of a small but vital step toward overhauling the overall Global Styles interface. There is still much work to be done, but I am eager to see where the Gutenberg contributors take this component in the coming weeks and months.
I did run into one snag. Clicking on the Typography tab at the root level produces an error. However, it works at the block level.
Contributors also updated the old “Aa” icon representing the Global Styles panel with a half-dark-half-light circle button. My immediate reaction was that it was for switching between light and dark modes.
This was a sentiment shared by a user (from a now-deleted account) in the GitHub ticket.
Global Styles is not a new system disconnected from styles and themes, indeed is an improvement to the current themes system. If we were to consider the strength of WordPress’ past and present, we would perceive that on the dashboard, indeed a brush icon has been developed for years in people’s memory as an association with appearance, themes, styles, personalization. Therefore, the icon that would be most comprehensible in people’s memory regarding the new Customizer remains a brush. I say new and better Customizer, because this is how common people manifest what they understand about Global Styles. Departing from a pencil brush to yin-yang, moon, or water drop, I have not tested yet with public, but from past experience I assure you people are going to find this new icon unrelated and confusing.
As one of the pioneers of child theming in WordPress, using them long before they were officially supported, this is something near and dear to my heart. I created my first theme shop on this foundation. I have loads of ideas about how the block paradigm can reshape the theme space, and child themes are at the center of many of them.
However, all of the components of Full Site Editing have not entirely supported child themes until now. There are still a few pieces left to fit into the puzzle, but the system should work, mostly.
Templates, template parts, and theme.json files from a child theme should now completely overrule those from the parent. These changes work on both the front end and in the site editor.
Some open questions are being worked through in a related GitHub ticket. The most crucial development is still to come, which will handle merging values between the parent and child theme.json files. For example, it makes sense that child themes should be able to overwrite colors and typography while skipping definitions for layout-related values, falling back to the parent.
Once that is in place, designers will have an easy-yet-powerful way to realize the original vision behind CSS Zen Garden, a project that at least partially inspired child theming’s adoption by WordPress.
Contributing to TiDB's codebase is not easy, especially for newbies. As a distributed database, TiDB has multiple components and numerous tools, written in multiple languages, including Go and Rust. Getting started with such a complicated system takes quite an effort.
So, in order to welcome newcomers to TiDB and make it easier for them to contribute to our community, we've developed a TiDB integrated development environment: TiDE. Created during TiDB Hackathon 2020, TiDE is a Visual Studio Code extension that makes developing TiDB a breeze. With this extension, developing a distributed system can be as easy as developing a local one.
In the previous article, we saw how we could use fuzzy search in PostgreSQL. This article is more about using the power of full-text indexes to search through large text data. This is different from any other PostgreSQL indexes, which work either with alphanumeric or smaller textual content.
To understand how full-text search works, we are going to utilize the same data set we saw in the PostgreSQL Fuzzy Search blog -
If you frequently find yourself working with relational database instances, and especially MariaDB or MySQL, you probably already know the nuances of a couple of data types offered by MySQL. Some of the data types provided by MySQL are suited for numbers; others fit variable-length values, of which some are also good fits for text-based values.
Before explaining how to tune MySQL instances for specific (in this case, TEXT) data types, we must go over some of the data types offered by MySQL to make you understand how everything works in the first place. When it comes to data types, MySQL offers a few categories to choose from:
Foursquare has updated its Places Enterprise API to include an all-new autocomplete endpoint that promises to simplify the process of location and address entry. The new endpoint leverages a robust database of location data that encompasses details from 250 countries and territories.
We have been discussing different parts of various Authentication/Authorization requirement scenarios. We also covered some theory and saw some demo code regarding OAUTH, OIDC, Identity Server, etc.
In the previous post, we learned how to configure IdentityServer, AllowedScope of a client application, and how to make a PasswordTokenRequest for the scopes to UserInfo Endpoint.
So, you want to learn about performance testing and progress towards performance engineering or DevOps or Site Reliability Engineering. I get it. Jumping directly into performance testing might be overwhelming. I was directed to learn the tool, then the performance concepts. It is like, learning to swim by directly jumping into the pool. Either someone needs to save you from drowning if things go south, or if you are smart enough, you can manage. I was able to manage myself to learn the performance concepts parallel while learning the performance testing tool around a decade ago.
I do not want you to go down that route. In this blog post, I am going to list ten things you should learn before learning about performance testing and its tools. There is no end to learning stuff. But I have highlighted the essential and fundamental concepts you may need to go through for your performance testing trip.
Broken Access Control vulnerabilities are common in modern applications since the design and implementation of access control mechanisms rely on a highly complex ecosystem of multiple components and processes. In such a complex, changing ecosystem, security teams should apply several legal, organizational, and business logic to ensure the tech stack is watertight and has no room left for hackers to exploit the system.
As it sounds, the job isn’t easy, and there are fair chances of unidentified vulnerabilities on account of a formal approach to tackling security. The traditional method of identifying access-related vulnerabilities is to rely on manual testing. Due to the lack of automated, continuous detection, access control vulnerabilities often remain unnoticed and are potentially targeted by hackers at a much higher intensity.
California Consumer Privacy Act (CCPA) is the US’ answer to the EU’s General Data Protection Regulation (GDPR). With largely similar rules, the CCPA is the most robust data privacy legislation in the US. The Act set motion to other privacy acts that have been in progress in the US for some time, like Virginia’s CDPA, […]
The post How to Make Your WordPress Site CCPA Compliant appeared first on WPExplorer.
AWS cloud architecture solutions require infrastructure to run your platform solutions. Infrastructure includes compute technologies, databases, queues, and more. Each needs to be specified and built before turning on your platform solution.
There are many different ways you can choose to build your AWS infrastructure. Each method has its benefits and drawbacks that should be known before choosing how to create your production platform.
As an individual developer or as a part of a wider software development or IT team, you will find that time is rarely on your side, with many competing priorities throughout the working week. This naturally focuses you to look for ways to increase your productivity through the use of technology and tools to help you achieve more in less time. Throughout this blog post, we’re going to look at DevOps productivity and compare traditional tools with infrastructure as low code tools.
Everyone has heard of DevOps, yet many people struggle to understand exactly what DevOps is. Fundamentally DevOps is a perfect mixture of the philosophy of DevOps along with daily practices and supporting technology tools to enable you to deliver value through technology rapidly to your customers.
Please let me give more details
Introduction$datetime1 = new DateTime($orderdate);
$datetime2 = new DateTime($currdate);
$interval = date_diff($datetime1, $datetime2);
$interval->format('%m months');
$months_diff = $interval->format('%m months');
for($i = 1; $i <=($months_diff+1); $i++){
$totalFees = $fees + $totalFees;Hello. My name is Eben and I'm a beginner in php. I've been getting this error message "Notice: A non well formed numeric value encountered in C:\wamp64\www\Project\FeePayment.php on line 145".
This is the code;
for($i = 1; $i <=($months_diff+1); $i++){
$totalFees = $fees + $totalFees;Please I need help.
Spoiler Alert: it’s colonization! In her article “The American Obsession with Lawns,” Krystal D’Costa explains that the most grown crop in the United States are our lawns which is disappointing, to say the least, considering no one (on a community...
The post Why Do We Care About Perfect Lawns So Much Anyway? appeared first on Treehouse Blog.
By default the Gutenberg Block Editor loads its default CSS/stylesheet on the front-end of your WordPress site. This is fine for most cases, but there may be situations where you want to disable the Gutenberg styles for whatever reason. For example, my free WordPress plugin, Disable Gutenberg, enables users to disable the Gutenberg Block Editor and restore the Classic Editor. Included in the plugin settings is an option called “Enable Frontend” that lets users enable or disable the Gutenberg CSS/styles as desired. This quick DigWP tutorial explains programmatically how to disable Gutenberg styles on the front-end.
One reason why people may want to remove extraneous/unnecessary CSS/stylesheets from loading is improved site performance. So by disabling the Gutenberg CSS when it’s not needed, that’s one less asset that needs to load for every page request. That can have a huge cumulative effect on the performance of your WordPress site.
FYI the default Gutenberg stylesheet looks like this when included in the source code of your web pages:
<link rel='stylesheet' id='wp-block-library-css' href='https://example.com/wp-includes/css/dist/block-library/style.min.css' type='text/css' media='all' />So you know what to look for.
Without further ado, here is the magic code snippet sauce to add to your WordPress-powered site. You can add this code using a plugin such as Code Snippets, or you can add directly via theme (or child theme) functions.php, or add via simple custom plugin. Many ways to add the following code:
// disable gutenberg frontend styles @ https://m0n.co/15
function disable_gutenberg_wp_enqueue_scripts() {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
}
add_filter('wp_enqueue_scripts', 'disable_gutenberg_wp_enqueue_scripts', 100);This script disables the default Gutenberg stylesheet wp-block-library, and it also disables the theme-specific Gutenberg stylesheet (if applicable) wp-block-library-theme. That’s all it does, plain and simple.
In general, any WordPress stylesheet can be disabled using the WP core function, wp_dequeue_style(). For example, if you are using WooCommerce and the Storefront theme, you may want to prevent their related Gutenberg Block CSS/stylesheets from loading on the front-end. To do it, modify the previous code snippet so it looks like this:
// disable gutenberg frontend styles @ https://m0n.co/15
function disable_gutenberg_wp_enqueue_scripts() {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
wp_dequeue_style('wc-block-style'); // disable woocommerce frontend block styles
wp_dequeue_style('storefront-gutenberg-blocks'); // disable storefront frontend block styles
}
add_filter('wp_enqueue_scripts', 'disable_gutenberg_wp_enqueue_scripts', 100);The wp_dequeue_style() function is what’s doing all the work here. It is very effective and can be used to disable any stylesheet that is registered with WordPress. Check the docs at WordPress.org for more details.
The code techniques so far are kept very minimal for the sake of clarity. But as you probably know, there is much more that can be done when customizing asset loading and so forth. For example, you can add conditional logic so the stylesheets will be disabled only under certain conditions.
To give you an idea of the possibilities, here is a “real-world” example showing how Disable Gutenberg conditionally disables the front-end styles depending on user preference in the plugin settings.
// disable gutenberg frontend styles @ https://m0n.co/15
function disable_gutenberg_wp_enqueue_scripts() {
global $wp_query;
if (is_admin()) return;
$post_id = isset($wp_query->post->ID) ? $wp_query->post->ID : null;
$options = get_option('disable_gutenberg_options');
$enable = isset($options['styles-enable']) ? $options['styles-enable'] : false;
if (!$enable && !disable_gutenberg_whitelist($post_id)) {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
}
}
add_filter('wp_enqueue_scripts', 'disable_gutenberg_wp_enqueue_scripts', 100);Again this is just an example taken from an actively developed plugin. So much more is possible, as WordPress core provides all sorts of useful functions with which to work. So have fun and build something creative :)
More of our posts on Gutenberg Block Editor:
The filter() the method creates a new array filled with all the elements of the old array that pass a certain test, provided as a function.
Let’s take a look at the syntax:-
An overall beautiful design with lots of details and creative typography. Our pick this week.
With the Divi Layout Packs you’ll get world-class designs ready to be used for your client projects.
Learn how modern image formats (AVIF or WebP) can improve compression by up to 50% and deliver better quality per-byte while still looking visually appealing in this article by Addy Osmani.
Ben Evans’ master piece that he created over the course of one year! Insane CSS art!
LittleJS is a lightweight 2D JavaScript game engine with a super fast WebGL rendering system. Learn more about it in this article.
An article about training cars to do self-parking using a genetic algorithm.
Learn more about speculative prerendering in the browser and how to participate in Chrome origin trial.
20 very valid reasons to quit social media and experience real life.
Simple organic/blob shape generator that allows you to control the final shape.
A fantastic showcase of Charlie Le Maignan’s recent animated type project.
Read how container queries and container units will hopefully soon be game changers.
In this lesson we will learn how to generate static pages at build time using the getStaticProps function in Next.js. By Jon Meyers.
Visualize the <head> with these styles made by Harry Roberts.
Various art generators to create unique works. Made by Andrey Andronov.
Want to know how to make CSS Art? In this blog post Yosra Emad explains in detail how to create CSS art and have fun with it.
A beautiful showcase slideshow by Aysenur Turk.
Make a job-winning resume in minutes. Download the PDF for free. No sign-up. No subscription.
Learn about Okhsv and Okhsl, Björn Ottosson’s attempts at making better color pickers for the sRGB gamut.
Learn about fit-content, min-content, and max-content in CSS and how to use them in real-world projects.
A concept for a kinetic typography based page transition where background letters come into the foreground and reveal a new content level.
The best motion design and animation shots from Dribbble collected over the past couple of weeks.
The post Collective #681 appeared first on Codrops.
