Message clipped due to unidentified CSS added in emails

sitemarketer · December 2015

Looking at the source of the email in Gmail, or the message within sendy, you see what appears to be 600K of CSS for the editor, with embedded images, fonts, tooltips, etc.

Here's some of it:

 <style type="text/css">._5d3-hoverMenu {
   position: absolute;
   z-index: 10000;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   visibility: hidden;
   opacity: 0;
 }

 ._5d3-opened {
   visibility: visible;
   opacity: 1;
 }

 ._5d3-opened ._5d3-btn,
 ._5d3-opened ._5d3-line {
   opacity: 1;
 }

 ._5d3-opened ._5d3-panel {
   box-shadow: 0 0 4px 0 rgba(0,0,0,0.2);
 }

 ._5d3-panel {
   box-shadow: none;
   height: 30px;
   background-color: #fff;
   color: #656565;
   font-size: 10px !important;
   font-family: 'Lato' !important;
   cursor: default !important;
   border-radius: 40px;
   white-space: nowrap !important;
   padding-right: 4px !important;
   transition: box-shadow 0.2s ease-in-out;
 }

 ._5d3-premium ._5d3-btn_premium:hover {
   background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjIycHgiIGhlaWdodD0iMjJweCIgdmlld0JveD0iMCAwIDIyIDIyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjMgKDEyMDgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5GaWxsIDEgKyBGaWxsIDExIENvcHkgMjwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSJQYWdlLTIiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHNrZXRjaDp0eXBlPSJNU1BhZ2UiPgogICAgICAgIDxnIGlkPSJTdGF0ZXMtRXhwYW5kZWQiIHNrZXRjaDp0eXBlPSJNU0FydGJvYXJkR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC03NjMuMDAwMDAwLCAtNzEwLjAwMDAwMCkiPgogICAgICAgICAgICA8ZyBpZD0iU3RhdGUtQ29weS0xMiIgc2tldGNoOnR5cGU9Ik1TTGF5ZXJHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNDkyLjAwMDAwMCwgNTkwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPGcgaWQ9Ikdyb3VwLUNvcHktMiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTQxLjAwMDAwMCwgODkuMDAwMDAwKSIgc2tldGNoOnR5cGU9Ik1TU2hhcGVHcm91cCI+CiAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkZpbGwtMS0rLUZpbGwtMTEtQ29weS0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMzAuMDAwMDAwLCAzMS4wMDAwMDApIj4KICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTEwLjk3MDMyMTMsMCBDNC45MTE2MjgxNiwwIDAsNC45MTA0OTk5MSAwLDEwLjk2ODI1OTIgQzAsMTcuMDI1ODEzNSA0LjkxMTYyODE2LDIxLjkzNjUxODQgMTAuOTcwMzIxMywyMS45MzY1MTg0IEMxNy4wMjkwMTQ1LDIxLjkzNjUxODQgMjEuOTQwNjQyNiwxNy4wMjU4MTM1IDIxLjk0MDY0MjYsMTAuOTY4MjU5MiBDMjEuOTQwNjQyNiw0LjkxMDQ5OTkxIDE3LjAyOTAxNDUsMCAxMC45NzAzMjEzLDAiIGlkPSJGaWxsLTEiIGZpbGw9IiNGQkM3M0MiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkxpbmUtKy1MaW5lLSstTGluZS0rLUxpbmUtQ29weS0yLSstTGluZS1Db3B5LTMtKy1MaW5lLUNvcHktNCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS4wMDAwMDAsIDUuMDAwMDAwKSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2U9IiNGRkZGRkYiIHN0cm9rZS13aWR0aD0iMS4yIj4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSJMaW5lLSstTGluZS0rLUxpbmUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuMDAwMDAwLCAwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik01LDEgTDAsMSIgaWQ9IkxpbmUiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNNSwxIEw1LDYiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTQsMiBMMSw1IiBpZD0iTGluZSI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkxpbmUtQ29weS0yLSstTGluZS1Db3B5LTMtKy1MaW5lLUNvcHktNCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsIDYuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTYsNSBMMSw1IiBpZD0iTGluZS1Db3B5LTIiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMSwwIEwxLDUiIGlkPSJMaW5lLUNvcHktMyI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik01LDEgTDIsNCIgaWQ9IkxpbmUtQ29weS00Ij48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==") !important;
   background-size: 22px !important;
 }

 ._5d3-anonymous ._5d3-btn_grammarly,
 ._5d3-anonymous ._5d3-btn_grammarly:hover {
   margin: 4px 0 0 4px !important;
 }

Etc, etc, etc.

Ben · December 2015

Hi,

The issue is that one of your browser extension ‘Grammarly’ is inserting tons of code into the editor without you knowing when you created your campaign, see a portion of your HTML code below:

Screenshot:

This undesired behavior by Grammarly not only causes Sendy to malfunction when saving and sending, it may cause your browser to crash in some circumstances.

Here's what you need to do:

1) Disable Grammarly extension in your browser

2) Re-create your campaign (not just “Duplicate”, create a new campaign and write your message)

Then send your campaign again.

Thanks.

Best regards,
Ben

Message clipped due to unidentified CSS added in emails

Comments