Troubleshooting after Updating to Version 2

Updated December 1, 2019

After months and months of hard work, V2 is finally here! This update has changed the face of Stackable, and together with such a huge update comes the risk of some (minor) kinks that may temporarily affect blocks that were built with Version 1.

We’ve spent a considerable amount of time testing this latest version to make sure that it does not break anything on your published site. However, since some minor hiccups might occur, here are some troubleshooting guides on what to do just in case you do encounter a problem. We will update this post as more and more people upgrade to v2.

1. Everything looks broken in the frontend

If everything looks broken in your frontend after upgrading, please try out these solutions:

Solution 1

The styles being loaded in your frontend may still be the old styles from version 1.

  • Please try clearing or purging the caches created by your caching plugin (like W3 Total Cache or WP Super Cache), server-side caching solution (like SG Optimizer), or DNS caching (like CloudFlare).
  • If you have speed optimization or minification plugins that remove query var strings from files loaded; or minify and combine stylesheets, it’s possible that these may force your site to load cached copies of the old stylesheets. Please try clearing or purging their current files.
Solution 2
  • It’s possible that Stackable may have failed to load the backward compatibility styles. Please head over to your backend admin, then navigate to the “Stackable” menu. Once there, scroll to the very bottom and make sure that the “Load version 1 block stylesheet for backward compatibility” is checked.

For those who curious about how this works, this option is automatically checked if you upgraded from version 1. There are a lot of changes between version 1 and version 2, and in order to ensure fast loading speeds of your site, all the old styles have been separated into another stylesheet. This stylesheet is only needed if you use version 1 blocks.

2. Reusable blocks that have Stackable blocks look broken

After updating, and you’re using reusable blocks, there’s a chance that you may notice your reusable blocks to look broken.

Solution
  • When this happens, you may need to edit your reusable blocks and update them (even without changes) in order to trigger the blocks inside it to migrate to the new Stackable blocks.

Unfortunately, this needs to be done because the block editor doesn’t yet handle block updating in reusable blocks well.

3. Space between a Separator Block and another block

After updating, you might see a space between a Stackable Separator block and an adjacent block.

When this happens, you have 2 possible solutions depending on the adjacent block you are using:

Solution 1
  • If the adjacent block you are using is another Stackable block, you can turn on the built-in separator for the adjacent block (yes, all Stackable blocks now have built-in separators), and remove the stand-alone Stackable separator block
Solution 2
  • You can also adjust the margin in the Stackable Separator block you are already using so the space will no longer appear in the front end

4. Some Text Colors Inside Containers might Reset when Editing Existing Pages

While all text colors are maintained in the published view, you might encounter some text colors reverting back to the theme colors. This will not automatically happen and might occur only after you edit your existing page.

Solution
  • In case this happens, it would be safest to manually change the text colors to your preferred colors

5. Block Error Prompt

While this is not expected to happen, in editing mode you might encounter the prompt “This block contains unexpected or invalid content”.

Solution 1
  • If this happens, the first step is to attempt recovery. You can do this by clicking on the three dots within the error prompt panel and clicking “attempt block recovery”.
Solution 2
  • While your block showed errors in the block editor, there’s a chance that your block would still look great in the frontend. So a possible solution would also be to leave the block as-is with an error.
Solution 3
  • When all else fails, you can recreate your block. The best thing about this solution is you get to explore the different new features of the block.

6. Other Errors after Updating to V2

If there are any other errors that you encounter after updating to V2 that cannot be solved by the troubleshooting tips above, please let us know. Our support team is always ready to help you out!

You can also report any bugs on the Stackable Git Hub Repository.

Want to engage more?

Join the Stackable Facebook Community.

Learn more about Stackable, engage with the Stackable team, and share interesting insights and with fellow Stackable users.

Be part of our community today.

How to Transfer Billing to your Client

If you have created a website for your client and you have purchased Stackable Premium on their behalf, you can transfer the ownership and billing of Stackable Premium to your client.

You can easily transfer billing to your client by doing these steps:

1. Login your Stackable account through this link: https://wpstackable.com/account/

2. Navigate to Renewals and Billings, then select your plan and click on “Cancel Auto-Renew“.

1.png.webp

3. Navigate to Websites and click on your client’s website in the list. Then click on “Transfer Billing to Client“.

2.png.webp

4. Afterwards, a popup will open which will notify your client of the transfer. Input your client’s name and email. An email with a direct purchase link will be sent to your client so they can associate their billing with Stackable Premium while keeping the license and management on your end. You will get a notification when this will happen.

b107b80406a5be9545b23ecdcd0afc2a.png

Will My Staging Site Count as a Site in My License?

Nope, your staging site, local development site, or tests site won’t be counted as a site in your license.

Here are the Top-level domains that are considered as dev or staging:

  • *.dev
  • *.dev.cc (DesktopServer)
  • *.test
  • *.local
  • *.staging
  • *.example
  • *.invalid
  • *.myftpupload.com (GoDaddy)
  • *.cloudwaysapps.com (Cloudways)
  • *.wpsandbox.pro (WPSandbox)
  • *.ngrok.io (tunneling)

And here are the Subdomains that are considered as dev or staging:

  • local.*
  • dev.*
  • test.*
  • stage.*
  • staging.*
  • stagingN.* (SiteGround; N is an unsigned int)
  • *.staging.wpengine.com (WP Engine)
  • *.dev.wpengine.com (WP Engine)
  • dev-.pantheonsite.io (Pantheon) test-.pantheonsite.io (Pantheon)
  • staging-*.kinsta.com (Kinsta)

Branding Guidelines

Main Logos

Icon with name

Icon only

Icons with border

For use against backgrounds including gradient and images when the main logo tends to get drowned out against the background.

Secondary Logo

Icon with name (White)

Icon only (White)

For use in black and white displays or printing

Colors and Typography

Typeface

Main Colors

Gradient Colors

Other Colors (Logo Icon)