Topics
- Cache Busting: How It works & methods for Cache Busting CSS
- How to Remove WP Version & Time From Scripts/Style
- How to Disable Unwanted XML files Generated by Yoast SEO Plugin
- How to Generate Site & Secret Key for Google reCaptcha v2 & v3
- How to Add Google reCaptcha on your Contact Form 7
- Add Additional Custom JS and CSS
- How to Add Multiple Logo In Header/Sticky Header
- How to Change wp-login URL For WordPress
- How to Change WordPress Logo of the Login Page
Cache Busting: How It Works & Methods For Cache Busting CSS
Overview
Solve the browser caching issue by using Cache busting and different file versions. Therefore, the browser doesn’t retrieve the old file from the cache but requests to the origin server for the new file.
Cache busting is useful. It allows your visitors to receive the most recently updated files without a hard refresh or clear browser cache.
- File name versioning (e.g. style.v2.css)
- File path versioning (e.g. /v2/style.css)
- Query strings (e.g. style.css?ver=2)
All its mechanisms can be easily updated to reflect a modified file. Without Hard Refresh and Clear Browsing Cache
Ex.
Just have to add Version PHP Code in Link/JS ( i.e. custom.css )
<link rel='stylesheet' type='text/css' href="<?php echo get_stylesheet_directory_uri() ?>/assets/dist/custom.css?v=<?php echo rand();?>" />
How to Remove WP Version & Time From Scripts/Style
Steps
- Open function.php file
- Add this code below in function file
<?php add_filter( 'style_loader_src', 'sdt_remove_ver_css_js', 9999 ); // Remove WP Version From Scripts add_filter( 'script_loader_src', 'sdt_remove_ver_css_js', 9999 ); // Function to remove version numbers function sdt_remove_ver_css_js( $src ) { if ( strpos( $src, 'ver=' ) || strpos( $src, 'time=' ) ) $arr_params = array( 'ver', 'time'); $src = remove_query_arg( $arr_params, $src ); return $src; }
Before
After Added Code
How to Disable Unwanted XML files Generated by Yoast SEO Plugin
Overview
Posts, pages, and other custom post types can be customized under the ‘Content Types’ tab. Removing a post type from the search results will also remove them from the sitemap.
Steps
- Log in to your WordPress website.
- Click on ‘SEO’. You will see left-hand side menu In Dashboard
- Click on ‘Search Appearance’.
- Click on the appropriate tab ( i.e. Content Type, Taxonomies, Media etc… )
- Toggle on the appropriate Posts, Pages, Templates, etc. and then “OFF/NO” the Settings in “Show Search Results.”
- Also “Turn Off” Search Url’s settings as they all generate XML files likes ( Author, Category, Post Tag, Pages, Posts, Custom Post Types, etc. )
- Click ‘Save Changes’.
How to Generate Site & Secret Key for Google reCaptcha v2 & v3
- Click Admin Console on the upper right corner
- Sign in on your Gmail account
- Click Setting Button on the upper right corner
- Add all the information as mentioned in the screenshot.
- After that Copy Both keys
How to Add Google reCaptcha On your Contact Form 7
Steps
- Open WordPress Dashboard
- In Contact Form 7 Click Integration Tab.
- Click Configure Keys
ADD Additional Custom JS and CSS
Steps
- Open function.php file
- Add This Code Below In Function File
<?php function enqueue_styles() { // enqueue styles wp_enqueue_style('slick', get_stylesheet_directory_uri() .'/css/slick.css'); wp_enqueue_style('slick-theme', get_stylesheet_directory_uri() .'/css/slick-theme.css'); wp_enqueue_script('slick',get_stylesheet_directory_uri() .'/js/slick.js'); } add_action('wp_enqueue_scripts', 'enqueue_styles');
How to Add Multiple Logo In Header / Sticky Header
Steps
- Open function.php file
- Add this Code In File
<?php add_action( 'customize_register', 'wpse_customize_custom_header_meta' ); function wpse_customize_custom_header_meta( \WP_Customize_Manager $wp_customize ) { $wp_customize->add_setting('themename_theme_options11', array( 'capability' => 'edit_theme_options', 'type' => 'option', )); $wp_customize->add_control( new WP_Customize_Image_Control($wp_customize, 'image_upload_test', array( 'label' => __('Sticky Logo', 'red-door'), 'section' => 'header_image', 'settings' => 'themename_theme_options11', ))); } Open header.php file and add this code to below end of logo of id (i.e. #logo ) and above endif ( i.e. <?php endif ) <a class="sticky-logo" href="<?php echo esc_url( home_url( '/' ) ); ?>"> <?php $custom_logo_id = get_option( 'themename_theme_options11',true ); $image = wp_get_attachment_image_src( $custom_logo_id , 'full' ); ?> <img src="<?php echo $custom_logo_id; ?>" alt=""> </a> - Go to WordPress Dashboard >> Appearance >> Customize >> Header Image
- Upload New Logo In Sticky Logo
How to Change wp-login URL For WordPress
Steps
- Open wp-login.php file from setup wordpress
- Find wp-login in the file and replace “any file name you have needed ( i.e. control.php” )
- After that, save the file with the same name that we used to replace wp-login
- After that, delete wp-login.php file
- Then type your appropriate web url ( i.e. urlname/control.php )
How to Change WordPress Logo of the Login Page
Steps
- Open function.php file
- Add this code in function file and add image path in style tag
<?php function login_logo() { ?> <style type="text/css"> body.login div#login h1 a { background-image: url('<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png"') !important; background-size: contain; width: auto;} </style> <?php } add_action( 'login_enqueue_scripts', 'login_logo' ); - Hurray! ? See the result
You may also like
WooCommerce: Boost conversion with Pre-Sales activities
Conversion means users who are converted from visitors to customers for your e-commerce website. You...
WooCommerce: Conversion rate
As per today’s situation, about 5+ million e-commerce websites are using the WooCommerce platform. To survive and thrive, you need to know where you stand in this competitive and crowded community. ...
Introducing Twenty Twenty-Two – first default block theme!
The WordPress default theme twenty twenty-two with WordPress...
