I am enqueuing some javascript that injects SVGs into my page's DOM (called SVGInjector); it works great except for one thing: there is an undesirable "blink"/shift of elements on my screen where the injected elements are placed upon loading. Apparently this blink has a name I found months after asking the question, it is called the Flash of Unstyled Content (or FOUC) and even has its own Wiki. The reason for this shift seems pretty clear: the page's other elements are apparently drawn before the js that injects the SVGs runs, and then, once they are inserted, the page changes to accommodate the added SVGs. I mentioned it here in an answer to my own question that I asked yesterday: https://wordpress.stackexchange.com/a/247315/105196 I am hoping someone can tell me how to prevent this blinking/shift. I believe the solution would entail either 1) delaying the drawing of the page's other elements until after the SVG is injected via the enqueued js or 2) making the js run earlier, but … [Read more...] about How to delay display of page elements until enqueued script has injected html
Prototype js remove element
Remove type attribute from script and style tags added by WordPress
Warning: The type attribute is unnecessary for JavaScript resources. From line 10, column 146; to line 10, column 176 feed/" /> <script type="text/javascript">window Warning: The type attribute for the style element is not needed and should be omitted. From line 11, column 1798; to line 11, column 1820 </script> <style type="text/css">img.wp Warning: The type attribute for the style element is not needed and should be omitted. From line 23, column 193; to line 23, column 251 a='all' /><style id='kirki-styles-global-inline-css' type='text/css'>.envel Warning: The type attribute is unnecessary for JavaScript resources. From line 23, column 905; to line 23, column 1010 }</style> <script async type="text/javascript" src="http://....../wp-content/cache/minify/df983.js"></scri Warning: The type attribute for the style element is not needed and should be omitted. From line 70, column 126; to line 70, column 167 70.png" /><style … [Read more...] about Remove type attribute from script and style tags added by WordPress
Hook into backbone to add js to wp-admin -> media library?
I've enqueued a .js file on the "Media Library" page (upload.php). I need to hide and manipulate a few of the thumbnails on the page using JS only ( I'm not looking for workarounds ). The elements on the page are being rendered by backbone and I have found no way so far to hook into it. In any window/document state, $('li.attachment').hide() function for example won't do it's job because of this. I have tried going with the following piece of code, with no result so far, can't even debug the code because of unproperly hooking: window.wp = window.wp || {}; ( function( $, _ ) { var media = wp.media, Attachments = media.model.Attachments, Query = media.model.Query, original = {}; original.AttachmentsBrowser = { manipulate: media.view.AttachmentsBrowser.prototype.manipulate }; _.extend( media.view.AttachmentsBrowser.prototype, { initialize: function() { original.AttachmentsBrowser.initialize.apply( this, arguments ); }, manipulate: function() { var options = this.options, self = this, i = … [Read more...] about Hook into backbone to add js to wp-admin -> media library?
Remove Order List Row Link in WooCommerce Admin?
I wanna remove the functionality of when you click on a order row in Orders in Admin, you will be sent to the edit page for that order. I know it's added with jQuery in a js-file in the WooCommerce plugin. I have located the actual code: /** * Click a row. */ WCOrdersTable.prototype.onRowClick = function( e ) { if ( $( e.target ).filter( 'a, a *, .no-link, .no-link *, button, button *' ).length ) { return true; } if ( window.getSelection && window.getSelection().toString().length ) { return true; } var $row = $( this ).closest( 'tr' ), href = $row.find( 'a.order-view' ).attr( 'href' ); if ( href && href.length ) { e.preventDefault(); if ( e.metaKey || e.ctrlKey ) { window.open( href, '_blank' ); } else { window.location = href; } } }; But I don't wanna change any code in the plugin. And there aren't js hooks or any php hook that can control that part of code. So I guess the option is to add the no-link class to the columns in the list? How do I do that? I can't find … [Read more...] about Remove Order List Row Link in WooCommerce Admin?
Removing auto versioning of JS and loading to header
I want to remove the JS I added and gets versioned by wp. I have a js script called base.js, and wordpress loads that by itself like <script type="text/javascript" src="../base.js?ver=4.9.9"></script> this code removes the version number function remove_cssjs_ver( $src ) { if( strpos( $src, '?ver=' ) ) $src = remove_query_arg( 'ver', $src ); return $src; } add_filter( 'style_loader_src', 'remove_cssjs_ver', 1000 ); add_filter( 'script_loader_src', 'remove_cssjs_ver', 1000 ); But what I want to do is stop WP from loading this JS completely. i tried deregestering and dequeueing but it didnt work. … [Read more...] about Removing auto versioning of JS and loading to header