0

The Problem

I've been grappling with this bug over several days now to no luck. When editing either a post or a page, all icons in the Visual Editor are missing:

enter image description here

As you can see this, includes the icon for the Gutenberg Add Block, which is completely invisible and here highlighted by its alt text. Also notice that the icons in the WP Admin section/toolbar display as normal, indicating the problem is only with the icons of the Visual Editor.

enter image description here

What I've Tried

To date, my extensive Googling, tweaking and testing has proved useless. The following is a list of all the solutions I've tried so far, from the standard to the slightly more complex:

  • Clearing browser cache/viewing the page in private browsing mode (as suggested here)

  • Deactivating all plugins (as suggested here)

  • Checking that the values of Wordpress Address and Site Address in Settings > General match

  • Going to Settings > Permalinks and clicking Save Changes (as suggested here)

  • Adding define( 'WP_MEMORY_LIMIT', '96M' ); to wp-config

  • Adding define( 'WP_MAX_MEMORY_LIMIT', '256M' ); to wp-config

  • Adding define(‘CONCATENATE_SCRIPTS’, false); to wp-config (as suggested here)

  • Adding $_SERVER[“HTTPS”] = “on”; to wp-config (as suggested here)

  • Replacing the wp-includes/js/TinyMCE folder entirely with the same folder from a fresh Wordpress download (as suggested here)

  • Replacing the entirety of wp-admin with the same folder from a fresh Wordpress download (as suggested here)

  • Using wp-cli to do a site-wide search-and-replace of http://www.myexamplesite.com to https://www.myexamplesite.com (as suggested here)

  • Disabling both HTTPS Enforce and and External Links Rewrite in using Siteground's cPanel (but not deleting the SSL certificate itself)

Not a single one of the above solutions results in the icons being restored again, even when I check the changes using Incognito/Private Browsing to counteract caching.

Possible Cause

I have some suspicion that this issue could have been caused by activating free Let's Encrypt SSL on the server, due to this post, and I also don't recall this issue occurring before I made that change, but I'm unsure as to a) how exactly enabling the free Let's Encrypt SSL would cause such an issue, and b) how it would be fixed.

Has anyone else dealt with this before?

  • Maybe it's a "mixed content" issue.. But have you tried disabling the SSL certificate? And the + ("add block" icon) is actually an inline svg element.. so right-click on the button and inspect the source - what do you see? And have you tried or are you using Really Simple SSL? – Sally CJ Aug 20 at 1:42
  • @SallyCJ The SSL cert is handled via the hosting server's cPanel (Siteground), I try to keep plugin use very minimal, especially where it can be accomplished in some other way. I completely forgot to include it in the above list but I also tried disabling both Force SSL itself and the option to rewrited links (which is for preventing mixed content), but none of that made any difference. The only thing I haven't done is delete the SSL certificate to well and truly disable SSL, but such a drastic step can't be necessary surely? – Hashim Aug 20 at 18:41
  • @SallyCJ As for the Add Block SVG, neither it nor the containers around it are showing as hidden in the markup, and the CSS appears normal, nothing there seems to be preventing it from displaying. – Hashim Aug 20 at 18:53
  • I would just try to completely remove the certificate and disable SSL, then check if that fixes the issue with the icons. If not, then at least it confirmed the cause is not SSL (or the certificate). But if yes, then try reinstalling the certificate and enable SSL. And if the issue persists, then I guess it's time to get help from SiteGround.. – Sally CJ Aug 21 at 6:35
  • 1
    @SallyCJ I've posted an update as an answer. – Hashim Aug 21 at 22:57
1

After a few more days of frustrating testing, I managed to track the issue down to the External Links Rewrite option in Siteground's Site Tools, under SSL options. When HTTP Enforce is enabled with the optional External Links Rewrite option (being able to see these changes virtually immediately in the browser requires a Force Refresh, which was what has made testing this stuff so hard) the icons in Visual Editor go missing. When External Links Rewrite is turned off, the icons show up again.

I've contacted Siteground's customer support for a solution, but so far they claim they've been unable to reproduce the issue, despite the fact I've so far managed to reproduce it on both of the two systems I have access to: Firefox and Chrome running on Windows 7, and Firefox running on MacOS High Sierra.

UPDATE:

Within 6 hours of filing the ticket, Siteground support finally escalated it to a more senior technical person, who then gave me the following response:

enter image description here

This response confirms what I'd suspected: that the "External Links Rewrite" option in Siteground's control panel (which they call Site Tools) is broken. They also claim that the team were already aware of the issue, although I'm skeptical of this given that it took a few responses for the initial support to escalate the ticket and the fact that the new React-based (and admittedly very good) Site Tools interface seems to have been launched just a few weeks ago.

In any case, Siteground insist a fix is on the way, and that in the meantime the solution is to disable HTTPS enforcement from the Site Tools panel entirely, and instead download its SG Optimiser plugin, enabling HTTPS Enforce and External Links Rewrite from there. I've tested this solution and can confirm that it solves the issue.

I inspected my .htaccess file after enabling these options with SG Optimiser, and it seemed to me that the only thing it was adding was the following Apache directive:

# HTTPS forced by SG-Optimizer
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTPS} off
    RewriteRule ^(.*)$ https://%{SERVER_NAME}%{REQUEST_URI} [R=301,L]
</IfModule>
# END HTTPS  

As someone who tries his best to run a bare-minimum installation with only the most necessary plugins, writing code for everything else, I wondered if this was the only thing SG Optimiser was doing to force HTTPS, and if I could replace it by simply adding the same directives to .htaccess myself.

However, on further inquiry from Siteground support, this doesn't seem to be the case:

enter image description here

Now, the only thing left to do is to wait for Siteground to fix this bug in the new Site Tools interface, after which I'll finally be able to remove the unnecessary SG Optimiser plugin and enforce HTTPS from the control panel itself.

0

I've just come across this issue myself on a new siteground install.

After some troubleshooting I found disabling all the Frontend Optimization options in the SG Optimizer plugin brought the editor icons back after purging the cache.

Then I enabled them one by one (except Combine CSS Files this has caused issues in the past and wasn't enabled before anyway)

I purged the cache after re-enabling each option checking the icons were still showing on the editor page after a page refresh.

It seems to have done the job.

Pete

  • I've never installed SG Optimizer on my site, although I suspect the issues are related. Looking into SG Optimiser, it seems that one of its most touted functions is to enable the External Links Rewrite option for SSL from within Wordpress without needing to log into the Siteground panel, so this seems to corroborate my finding that that particular feature is responsible for this. – Hashim Aug 21 at 22:55

protected by Community Oct 9 at 12:18

Thank you for your interest in this question. Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).

Would you like to answer one of these unanswered questions instead?

Not the answer you're looking for? Browse other questions tagged or ask your own question.