str_replace inside specific css files

Is it possible to perform str_replace inside an enqueue stylesheet? i can do str_replace on inline style with this function function replace_text($text) { $text = str_replace('background-image', 'background', $text); return $text; } add_filter('the_content', 'replace_text'); is it possible to perform the same action inside style.css file ? wp-content/plugins/assets/style.css
Category: Web

Fatal error: Uncaught Error: Class 'WP_Block_Styles_Registry'

I am having some issues determining the solution to this problem below. The website was sent to our team to fix. Turned on error reporting in wp-config.php: define('WP_DEBUG', true); WordPress version: 5.3.2PHP version: 7.2 WordPress Theme: Grow Pro Fatal error: Uncaught Error: Class 'WP_Block_Styles_Registry' not found in /home/website/public_html/clientsite.com/wp-includes/script- loader.php:2902 Stack trace: #0 /home/website/public_html/clientsite.com/wp-includes/class-wp- hook.php(288): enqueue_block_styles_assets('') #1 /home/website/public_html/clientsite.com/wp-includes/class-wp- hook.php(312): WP_Hook->apply_filters(NULL, Array) #2 /home/website/public_html/clientsite.com/wp-includes/plugin.php(478): WP_Hook->do_action(Array) #3 /home/website/public_html/clientsite.com/wp-includes/script- loader.php(2856): do_action('enqueue_block_a...') #4 /home/website/public_html/clientsite.com/wp-includes/class-wp- hook.php(288): wp_common_block_scripts_and_styles('') #5 /home/website/public_html/clientsite.com/wp-includes/class-wp- hook.php(312): WP_Hook->apply_filters(NULL, Array) #6 /home/website/public_html/clientsite.com/wp-includes/plugin.php(478): WP_Hook->do_action(Array) #7 …
Category: Web

How to override Bootstrap css with my child theme css in wordpress?

I am trying to load my site's child theme's css after Bootstrap CDN css in wordpress. I tried using these code but it doesn't work. The Bootstrap css is not overriden. What should I do to fix that? function override_css() { wp_enqueue_style( 'bootstrap.min', 'https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css' ); wp_enqueue_style( 'style', get_stylesheet_directory_uri() . '/style.css', array(), '1.0.0', true ); } add_action( 'wp_enqueue_scripts', 'override_css' );
Category: Web

Add wp_add_inline_style into another wp_add_inline_style for better performance

function loadOneStylePage(){ wp_enqueue_style( 'main-style', get_template_directory_uri() . '/styles/main.css', array(), _S_VERSION ); wp_enqueue_style( 'main-style-separate-file', get_template_directory_uri() . '/styles/main.css', array(), _S_VERSION ); //i would like to merge the two files? wp_add_inline_style( 'main-style-separate-file', 'main-style' ); } add_action('wp-enquueue_scripts', 'loadOneStylePage'); Ideally, I would like to put these two together as 1 file. I know i can merely edit the single file and plainly add all the css together but for the sake of creating a custom theme and providing additional options is never bad. I know the …
Category: Web

Why is style.css not being enqueued?

I got a pretty basic theme and just found out my style.css file doesn't get loaded into the <head>. I already searched around but can't find out, why it's not loading. I inspected the global $wp_styles object already but couldn't find anything: function style_test() { $wp_styles = new WP_Styles(); echo '<pre>'; // $wp_styles->enqueue == completely empty print_r( $wp_styles->registered ); echo '</pre>'; } add_action( 'wp_print_scripts', 'style_test', 0 ); Inside the object i also can't find my registered/enqueued stylesheets (they get loaded), …
Category: Web

Customize the reset password page?

How can I style the reset password page, where I put in my new password? I tried going like this: function my_login_stylesheet() { wp_enqueue_style( 'custom-login', get_template_directory_uri() . '/dist/styles/main.css' ); } add_action( 'login_enqueue_scripts', 'my_login_stylesheet' ); but it added the CSS only to the login and forgot password page (forgot password as in the page where you put in your email). However, I want to style the reset password page (where you put in your passwords).
Category: Web

Adding google fonts to WordPress theme

I am trying to add google fonts to a custom WordPress theme. Therefore I tried to enqueue selected three font faces at once to make it fast loading. So, I use the below codes to register and enqueue the same. wp_register_style('googlFonts', '//fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&family=DM+Serif+Display&family=La+Belle+Aurore&display=swap'); wp_enqueue_style('googlFonts'); When I search via source code I can only see the last font. Other fonts are not loading. Even I can't see the same complete URL in the source code. Below is what I saw from the …
Category: Web

Dynamically add Js

I have a basic bunch of CSS/Js files defined in my functions.php file. There I register and enqueue those scripts and stylesheets. But in specific situations I want to load additional scripts based on the site template which is used. I tried to register and enqueue those additional scripts in the specific Template file, but it didnt work. It does only work when included in the functions.php. What is the correct way to do this?
Category: Web

Relative path instead of absolute for wp_enqueue_script

When you enqueue scripts or styles with the following: function themeslug_enqueue_style() { wp_enqueue_style( 'core', '/style.css', false ); } add_action( 'wp_enqueue_scripts', 'themeslug_enqueue_style' ); You get the following: <link rel='stylesheet' id='core-css' href='http://localhost:8080/wordpress/style.css?ver=4.9.4' type='text/css' media='all' /> Note that it appends the site url to the beginning, in this case http://localhost:8080. I'm trying to remove this so that it's relative to the file executing this. Usually this is done with plugins_url or get_stylesheet_uri(). However, I DO NOT want to use either of these, as …
Category: Web

Wordpress and Advanced Custom Fields and Flickity

I am trying to add [Flickity Carousel][1] into my Wordpress theme. I was successful yesterday. However, when I returned to my theme this morning the carousel files are not loading. I am not sure what went wrong or if I'm missing something. I am also utilizing advanced custom fields and tachyons Would really love a fresh set of eyes. Here is where I enqueue the files function flickity_scripts() { wp_enqueue_script( 'flickityjs', get_template_directory_uri() . '/js/flickity.pkgd.min.js', array( 'jquery' ), '1.9.0', true ); …
Category: Web

Enqueue styles in new site editor in WordPress 5.9

In the block editor for posts and pages, I used to use the enqueue_block_editor_assets hook to enqueue styles for the block. add_action( 'enqueue_block_editor_assets','load_assets_in_block' ); function load_assets_in_block() { wp_enqueue_style( 'block-style', plugins_url( 'assets/css/block-style.css', PLAYER_PLUGIN ), array(), PLAYER_PLUGIN_VERSION, false ); } This still works on posts and pages block, but it isn't working on the new site editor in WordPress 5.9? What is the recommended way to enqueue styles in site editor?
Category: Web

Load CSS before Theme CSS

I have a stylesheet I want to load first in the head before other plugins load css or theme css. For some reason priority is not working for me. Any idea how I can achieve this? I need to use functions as this stylesheet only loads on a specific page
Category: Web

enqueue styles for only mobile wp

I tried to enqueue some styles on mobile only using wp_is_mobile() function, but it always give me true, Here is the code (From functions.php file) : add_action('wp_enqueue_scripts','load_All_Styles'); // Set up styles function load_All_Styles() { wp_register_style('font-awesome',get_template_directory_uri().'/css/font-awesome.min.css',array(),false); wp_register_style('preloader',get_template_directory_uri().'/css/preloader.css',array(),false); wp_register_style('bootstrap',get_template_directory_uri().'/css/bootstrap.min.css',array(),false); if(wp_is_mobile()){ wp_enqueue_style( 'font-awesome' ); } if(is_front_page()) { wp_enqueue_style( 'preloader' ); } } what method to use instead? Any Solutions?
Category: Web

font style is not working on domain

I have two domains, one http://www.eu-ohne-mpu-fs.de/, second: http://eu-bw.de/. Second domain is the one where Wordpress Adress(URL) and Domain Adress(URL) is set. First one is pointing to the directory /eu-bw.de. In my child theme stylesheet i use Font-face CSS rule to style: title, headers and navigation fonts. That rule is working with second domain but not apply to number one. Also i use this code in function.php (the file is created in child theme directory) to enqueue parent theme stylesheet in …
Category: Web

How to check if a WordPress core block is active in sidebar

I have a widget area and I want to enqueue a stylesheet only if a core block is active in it. I tried the following code: // if has audio block. if (has_block('audio')) { wp_enqueue_style('audio-css', get_template_directory_uri() . '/assets/css/audio.css'); } And it kinda worked. The problem is it only works if the audio block is added in a post. But I want to check if the audio block is added to widget areas like the sidebar. And not just on a …
Category: Web

How to output wp_enqueue_style() in HTML head instead of footer

I added some actions to wp_enqueue_scripts to load my custom css and js files in the header section by using wp_head(); right before the closing </head> tag. function mytheme_scripts(){ // Load our main stylesheet wp_enqueue_style( 'mytheme-css', get_template_directory_uri() . '/css/styles.min.css', false); // Load concatenated vendors JavaScript file wp_enqueue_script( 'vendors-js', get_template_directory_uri() . '/js/vendors.min.js'); // Load our main JavaScript file wp_enqueue_script( 'mytheme-js', get_template_directory_uri() . '/js/app.min.js', array( 'vendors-js' )); } add_action( 'wp_enqueue_scripts', 'mytheme_scripts', false); While both *.js files are loaded in the HTML <head> …
Category: Web

How to organize priority of plugins CSS files?

I'm developing website with theme (Astra Pro with child theme) and plugins. While I'm checking my performance in Chrome Dev Tools trace shows non-critical stylesheets with high priority. Example — lightbox stylesheet is one of the primary files: Is there a way to control those priorities, so I could place critical files first, and non-critical later? Beginner level answers would be greatly appreciated. EDIT #1: I have added to my child theme functions.php code: add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 99 ); function …
Category: Web

Preload key requests using wp_enqueue

I'm currently doing some speed optimisation and one of the main things scoring the site down is:- "Preload key requests 2.64 s Consider using to prioritize fetching resources that are currently requested later in page load. Learn more." I enqueue all my styles and JS files in my functions.php as follows:- wp_register_script('jquery-ui', get_template_directory_uri() . '/assets/js/jquery-ui.min.js', array(), '1.12.1'); wp_enqueue_script('jquery-ui'); wp_register_style( 'jquery-ui-css', get_template_directory_uri() . '/assets/css/jquery-ui.min.css', array(), '1.12.1'); wp_enqueue_style( 'jquery-ui-css' ); How would I go about using rel="preload" with some of these files?
Category: Web

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.