Forum Replies Created

Viewing 15 replies - 1 through 15 (of 54 total)
  • Thread Starter MegaZ

    (@megaz)

    Team, I found the source of the issue – this only happens when one selects an existing image from the media library!

    I tried uploading files manually, and it worked just fine. So the bug is when you insert an image compare block, then use two images from the media library. Please try on your end, and you should be able to replicate it.

    Thread Starter MegaZ

    (@megaz)

    @bluejay77 – Please don’t close this thread, as the issue remains a problem…

    Thanks!

    • This reply was modified 2 years, 2 months ago by MegaZ.
    Thread Starter MegaZ

    (@megaz)

    @lastsplash,

    My apologies for a late reply. I did test it with other themes as well – the problem remains the same. And I absolutely made sure to disable site accelerator.

    Try it yourself – switch to block editor / Gutenberg, then add images to before/after and see that the URL will look like this: “https://i2.wp.com/sitename.com/wp-content/uploads/YYYY/MM/file.jpg” instead of just “https://sitename.com/wp-content/uploads/YYYY/MM/file.jpg”.

    This is definitely a bug, and I saw it reported by someone else on your Github page…

    Thread Starter MegaZ

    (@megaz)

    Bruce, the site URL is https://photographylife.com

    I don’t have any links to examples, because I manually go into the code editor and remove redirects from wp.com and ssl=1 appends at the end, but here is a sample of code of what happens when I don’t change it:

    <!-- wp:jetpack/image-compare {"imageBefore":{"id":249695,"url":"https://i0.wp.com/photographylife.com/wp-content/uploads/2022/09/compare1.jpg?ssl=1","alt":"Compare1","width":2048,"height":1535},"imageAfter":{"id":249696,"url":"https://i1.wp.com/photographylife.com/wp-content/uploads/2022/09/compare2.jpg?ssl=1","alt":"Compare2","width":2048,"height":1535}} -->
    <figure class="wp-block-jetpack-image-compare"><div class="juxtapose" data-mode="horizontal"><img id="249695" src="https://i0.wp.com/photographylife.com/wp-content/uploads/2022/09/compare1.jpg?ssl=1" alt="Compare1" width="2048" height="1535" class="image-compare__image-before"/><img id="249696" src="https://i1.wp.com/photographylife.com/wp-content/uploads/2022/09/compare2.jpg?ssl=1" alt="Compare2" width="2048" height="1535" class="image-compare__image-after"/></div></figure>
    <!-- /wp:jetpack/image-compare -->

    So what I have to do for each before/after image, is switch to code editor, then remove “ix.wp.com/” from each src, then remove “?ssl=1” at the end of the URL.

    Also, why does the same image of before and after has to be coded twice for it to work? Can’t you guys make it simpler code so that the URL to the file is written once? That’s how my before/after plugin used to work before I switched to Jetpack image compare.

    Thanks!

    Thread Starter MegaZ

    (@megaz)

    Is this how you guys treat your paying customers? By ignoring their legitimate requests? That’s a great business model. Will be reaching out for a refund.

    OK, for anyone who is struggling with this, I created CSS for the most important icons. Place this into your theme default style.css, and remove all styling from WPDiscuz, do not load Fontawesome.

    /* WpDiscuz & FontAwesome */
    .fas {
            width: 15px;
            height: 15px;
    }
    
    .far {
            width: 10px;
            height: 10px;
    }
    
    .fas, .far {
            display: inline-block;
            background-position: center;
            background-repeat: no-repeat;
    }
    
    .fa-clock {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 448c-110.5 0-200-89.5-200-200S145.5 56 256 56s200 89.5 200 200-89.5 200-200 200zm61.8-104.4l-84.9-61.7c-3.1-2.3-4.9-5.9-4.9-9.7V116c0-6.6 5.4-12 12-12h32c6.6 0 12 5.4 12 12v141.7l66.8 48.6c5.4 3.9 6.5 11.4 2.6 16.8L334.6 349c-3.9 5.3-11.4 6.5-16.8 2.6z'/%3E%3C/svg%3E");
    }
    
    .fa-thumbtack {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='https://www.w3.org/2000/svg' xmlns:xlink='https://www.w3.org/1999/xlink' aria-hidden='true' focusable='false' style='-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg);' preserveAspectRatio='xMidYMid meet' viewBox='0 0 1152 1664'%3E%3Cpath d='M480 736V288q0-14-9-23t-23-9t-23 9t-9 23v448q0 14 9 23t23 9t23-9t9-23zm672 352q0 26-19 45t-45 19H659l-51 483q-2 12-10.5 20.5T577 1664h-1q-27 0-32-27l-76-485H64q-26 0-45-19t-19-45q0-123 78.5-221.5T256 768V256q-52 0-90-38t-38-90t38-90t90-38h640q52 0 90 38t38 90t-38 90t-90 38v512q99 0 177.5 98.5T1152 1088z'/%3E%3C/svg%3E");
    }
    
    .fa-lock {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M640 768h512v-192q0-106-75-181t-181-75-181 75-75 181v192zm832 96v576q0 40-28 68t-68 28h-960q-40 0-68-28t-28-68v-576q0-40 28-68t68-28h32v-192q0-184 132-316t316-132 316 132 132 316v192h32q40 0 68 28t28 68z'/%3E%3C/svg%3E");
    }
    
    .fa-unlock-alt {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1376 768q40 0 68 28t28 68v576q0 40-28 68t-68 28h-960q-40 0-68-28t-28-68v-576q0-40 28-68t68-28h32v-320q0-185 131.5-316.5t316.5-131.5 316.5 131.5 131.5 316.5q0 26-19 45t-45 19h-64q-26 0-45-19t-19-45q0-106-75-181t-181-75-181 75-75 181v320h736z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-sort-down {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1408 1088q0 26-19 45l-448 448q-19 19-45 19t-45-19l-448-448q-19-19-19-45t19-45 45-19h896q26 0 45 19t19 45z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-quote-left {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M832 960v384q0 80-56 136t-136 56h-384q-80 0-136-56t-56-136v-704q0-104 40.5-198.5t109.5-163.5 163.5-109.5 198.5-40.5h64q26 0 45 19t19 45v128q0 26-19 45t-45 19h-64q-106 0-181 75t-75 181v32q0 40 28 68t68 28h224q80 0 136 56t56 136zm896 0v384q0 80-56 136t-136 56h-384q-80 0-136-56t-56-136v-704q0-104 40.5-198.5t109.5-163.5 163.5-109.5 198.5-40.5h64q26 0 45 19t19 45v128q0 26-19 45t-45 19h-64q-106 0-181 75t-75 181v32q0 40 28 68t68 28h224q80 0 136 56t56 136z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-cog {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1152 896q0-106-75-181t-181-75-181 75-75 181 75 181 181 75 181-75 75-181zm512-109v222q0 12-8 23t-20 13l-185 28q-19 54-39 91 35 50 107 138 10 12 10 25t-9 23q-27 37-99 108t-94 71q-12 0-26-9l-138-108q-44 23-91 38-16 136-29 186-7 28-36 28h-222q-14 0-24.5-8.5t-11.5-21.5l-28-184q-49-16-90-37l-141 107q-10 9-25 9-14 0-25-11-126-114-165-168-7-10-7-23 0-12 8-23 15-21 51-66.5t54-70.5q-27-50-41-99l-183-27q-13-2-21-12.5t-8-23.5v-222q0-12 8-23t19-13l186-28q14-46 39-92-40-57-107-138-10-12-10-24 0-10 9-23 26-36 98.5-107.5t94.5-71.5q13 0 26 10l138 107q44-23 91-38 16-136 29-186 7-28 36-28h222q14 0 24.5 8.5t11.5 21.5l28 184q49 16 90 37l142-107q9-9 24-9 13 0 25 10 129 119 165 170 7 8 7 22 0 12-8 23-15 21-51 66.5t-54 70.5q26 50 41 98l183 28q13 2 21 12.5t8 23.5z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-chevron-up {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1683 1331l-166 165q-19 19-45 19t-45-19l-531-531-531 531q-19 19-45 19t-45-19l-166-165q-19-19-19-45.5t19-45.5l742-741q19-19 45-19t45 19l742 741q19 19 19 45.5t-19 45.5z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-chevron-down {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1683 808l-742 741q-19 19-45 19t-45-19l-742-741q-19-19-19-45.5t19-45.5l166-165q19-19 45-19t45 19l531 531 531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-comments {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1408 768q0 139-94 257t-256.5 186.5-353.5 68.5q-86 0-176-16-124 88-278 128-36 9-86 16h-3q-11 0-20.5-8t-11.5-21q-1-3-1-6.5t.5-6.5 2-6l2.5-5 3.5-5.5 4-5 4.5-5 4-4.5q5-6 23-25t26-29.5 22.5-29 25-38.5 20.5-44q-124-72-195-177t-71-224q0-139 94-257t256.5-186.5 353.5-68.5 353.5 68.5 256.5 186.5 94 257zm384 256q0 120-71 224.5t-195 176.5q10 24 20.5 44t25 38.5 22.5 29 26 29.5 23 25q1 1 4 4.5t4.5 5 4 5 3.5 5.5l2.5 5 2 6 .5 6.5-1 6.5q-3 14-13 22t-22 7q-50-7-86-16-154-40-278-128-90 16-176 16-271 0-472-132 58 4 88 4 161 0 309-45t264-129q125-92 192-212t67-254q0-77-23-152 129 71 204 178t75 230z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-user {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1536 1399q0 109-62.5 187t-150.5 78h-854q-88 0-150.5-78t-62.5-187q0-85 8.5-160.5t31.5-152 58.5-131 94-89 134.5-34.5q131 128 313 128t313-128q76 0 134.5 34.5t94 89 58.5 131 31.5 152 8.5 160.5zm-256-887q0 159-112.5 271.5t-271.5 112.5-271.5-112.5-112.5-271.5 112.5-271.5 271.5-112.5 271.5 112.5 112.5 271.5z'/%3E%3C/svg%3E%0A");
    }
    
    .fa-at {
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1792 1792' xmlns='https://www.w3.org/2000/svg'%3E%3Cpath d='M1100 775q0-108-53.5-169t-147.5-61q-63 0-124 30.5t-110 84.5-79.5 137-30.5 180q0 112 53.5 173t150.5 61q96 0 176-66.5t122.5-166 42.5-203.5zm564 121q0 111-37 197t-98.5 135-131.5 74.5-145 27.5q-6 0-15.5.5t-16.5.5q-95 0-142-53-28-33-33-83-52 66-131.5 110t-173.5 44q-161 0-249.5-95.5t-88.5-269.5q0-157 66-290t179-210.5 246-77.5q87 0 155 35.5t106 99.5l2-19 11-56q1-6 5.5-12t9.5-6h118q5 0 13 11 5 5 3 16l-120 614q-5 24-5 48 0 39 12.5 52t44.5 13q28-1 57-5.5t73-24 77-50 57-89.5 24-137q0-292-174-466t-466-174q-130 0-248.5 51t-204 136.5-136.5 204-51 248.5 51 248.5 136.5 204 204 136.5 248.5 51q228 0 405-144 11-9 24-8t21 12l41 49q8 12 7 24-2 13-12 22-102 83-227.5 128t-258.5 45q-156 0-298-61t-245-164-164-245-61-298 61-298 164-245 245-164 298-61q344 0 556 212t212 556z'/%3E%3C/svg%3E%0A");
    }

    And if you want a relatively lightweight CSS file for WpDiscuz (38K total), which takes into account the above style changes, remove the style.css from wpdiscuz/themes/default folder, and replace it with this:

    /* wpDiscuz CSS Style */
    #comments{max-width: 1100px; margin: 50px auto; color: #333333; font-style: normal; }
    #comments p, #respond p{ float: none!important;}
    #wpdcom{max-width:750px; padding:0; margin:7px auto 15px auto;}
    #wpdcom *{box-sizing:border-box; line-height: initial;}
    #wpdcom i{margin:0;}
    #comments #wpdcom span, #respond #wpdcom span, #wpdcom span{display: inline;letter-spacing: inherit;text-transform: none;font-size: 1em;}
    #wpdcom form{margin: 0px; padding: 0px; border: none; background: none;}
    #wpdcom input:required {box-shadow: 0px 0px 1px #555;}
    #wpdcom svg{display:inline;}
    #wpdcom .wpd-cursor-pointer{cursor: pointer;}
    #wpdcom .avatar{padding:0px; margin:0 auto; float:none; display:inline; height:auto; border:none; border-radius:0%; box-shadow: none; }
    #wpdcom span.current{color:#fff}
    #wpdcom .wc-label a:focus{outline:0}
    #wpdcom .wpdiscuz-hidden{display:none}
    #wpdcom .wpd-clear, #wpdcom .clearfix, .wpdiscuz_top_clearing, .wpdiscuz_clear{clear:both}  .wpdiscuz_clear_right{clear:right}  .wpdiscuz_clear_left{clear:left}
    #wpdcom .wpd-space{flex-grow: 1;}
    #wpdcom .wpd-hidden{visibility: hidden; opacity:0; transition: visibility 0s, opacity 0.5s linear;}
    #wpdcom .wpd-up{color: #009149 !important;}
    #wpdcom .wpd-up svg{fill: #009149!important;}
    #wpdcom .wpd-down{color: #fc5844!important;}
    #wpdcom .wpd-down svg{fill: #fc5844!important;}
    #wpdcom .wpd-reply{margin-left:25px}
    #wpdcom .wpd-reply.wpd_comment_level-2{margin-left:70px}
    #wpdcom.wpd-layout-2 .wpd-reply{margin-left:40px}
    #wpdcom.wpd-layout-2 .wpd-reply.wpd_comment_level-2{margin-left:28px}
    #wpdcom .wpdlb{clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;}
    
    /* Tooltip */
    [wpd-tooltip]{position:relative;}
    [wpd-tooltip]::before {content: "";position: absolute;top:-8px;left:50%;transform: translateX(-50%);border-width: 7px 7px 0 7px;border-style: solid;border-color: #555555 transparent transparent transparent;z-index: 100;opacity:0;}
    [wpd-tooltip]::after {content: attr(wpd-tooltip); position: absolute;left:50%;top:-8px;transform: translateX(-50%)   translateY(-100%);background: #555555;text-align: center;color: #fff;padding:8px 10px;font-size: 11px; line-height:1.5; min-width: 6vw; border-width:0; border-radius: 4px;pointer-events: none;z-index: 99;opacity:0;text-transform: none;}
    [wpd-tooltip]:hover::after,[wpd-tooltip]:hover::before {opacity: 1;transition: all .4s ease-in-out;}
    [wpd-tooltip-size='small']::after{min-width: 5vw;}
    [wpd-tooltip-size='medium']::after{min-width: 10vw;}
    [wpd-tooltip-size='long']::after{min-width: 14vw;}
    [wpd-tooltip-position='left']::before{left:0%;top:50%;margin-left:-11px; transform:translatey(-50%) rotate(-90deg)}
    [wpd-tooltip-position='top']::before{left:50%;}
    [wpd-tooltip-position='bottom']::before{top:100%;margin-top:8px;transform: translateX(-50%) translatey(-100%) rotate(-180deg)}
    [wpd-tooltip-position='right']::before{left:100%;top:50%;margin-left:0px;transform:translatey(-50%) rotate(90deg)}
    [wpd-tooltip-position='left']::after{left:0%;top:50%;margin-left:-8px;transform: translateX(-100%)   translateY(-50%);}
    [wpd-tooltip-position='top']::after{left:50%;}
    [wpd-tooltip-position='bottom']::after{top:100%;margin-top:8px;transform: translateX(-50%) translateY(0%);}
    [wpd-tooltip-position='right']::after{left:100%;top:50%;margin-left:9px;transform: translateX(0%)   translateY(-50%);}
    
    /* Form Head */
    #wpdcom .wpd-form-head{border-bottom: 1px solid #cccccc; padding: 7px 2px 9px 2px; margin-top: 20px; margin-bottom: 5px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between;}
    #wpdcom .wpd-sbs-toggle{color: #666666; font-size: 14px; line-height: 20px; cursor: pointer;}
    #wpdcom .wpd-sbs-toggle i.fa-envelope{ font-size: 15px; margin-right: 4px; }
    #wpdcom .wpd-sbs-toggle i.fa-caret-down{ font-size: 16px; margin-left: 4px; color: #666666;}
    #wpdcom .wpd-sbs-toggle .wpd-sbs-title{ font-size: 15px;}
    #wpdcom .wpd-auth{display: flex; flex-direction: row; justify-content: flex-end;}
    #wpdcom .wpd-auth .wpd-sep{border-right: 1px #cccccc solid; margin:0 12px; display: inline;}
    #wpdcom .wpd-auth .wpd-login{font-size: 14px; line-height: 20px;}
    #wpdcom .wpd-auth .wpd-login i{margin-right: 2px;}
    #wpdcom .wpd-auth .wpd-login a{color: #3272bf; text-decoration: none;}
    #wpdcom .wpd-auth .wpd-login a:hover{color: #0d3e81;}
    
    /* Comment Form */
    #wpdcom .wpd-form-wrap{padding-bottom: 10px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap{display: flex; flex-wrap: nowrap; flex-direction: row; justify-content:space-between; padding: 20px 0; align-items: center;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap [id^=wpd-editor-wraper]{flex-grow:1; position: relative; width: 100%;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap [id^=wpd-editor-wraper] textarea{width: 100%;}
    #wpdcom .wpd-form .wpd-avatar{margin-right: 15px; border-radius: 100%; text-align: left;flex-shrink: 0; align-self: flex-start;}
    #wpdcom .wpd-form .wpd-avatar img,
    #wpdcom .wpd-form .wpd-avatar img.avatar{width:56px; height:56px; max-width: 56px; border-radius: 100%; border: 1px solid #cccccc; padding: 2px; background-color: #ffffff; vertical-align: middle; text-align: center;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea{ height: 54px ; border-radius: 5px; border: 1px solid #cccccc; width: 100%; padding: 10px 15px; font-size: 14px; box-shadow: inset 1px 1px 8px rgba(0, 0, 0, 0.1); font-family: inherit; outline: none; -webkit-transition: .18s ease-out; -moz-transition: .18s ease-out; -o-transition: .18s ease-out; transition: .18s ease-out;resize: none;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea:hover {box-shadow: inset 1px 2px 8px rgba(0, 0, 0, 0.02);}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea::-moz-placeholder { line-height:28px; color: #666666; font-size: 16px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea::-webkit-input-placeholder {line-height:28px; color: #666666; font-size: 16px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea:-ms-input-placeholder {line-height:28px; color: #666666; font-size: 16px;}
    #wpdcom .wpdiscuz-edit-form-wrap {margin-bottom: 15px; margin-top: 10px; position: relative;}
    #wpdcom .wpdiscuz-edit-form-wrap table{  border: none; margin: 15px 0px;}
    #wpdcom .wpdiscuz-edit-form-wrap table td{ border: none; padding: 1px 0px; border-bottom: 1px dashed #cccccc;}
    #wpdcom .wpdiscuz-edit-form-wrap table td label{font-size: 13px; color: #666666;display: inline; line-height: 22px; margin-right: 20px; vertical-align: text-bottom;}
    #wpdcom .wpdiscuz-edit-form-wrap .wc_save_wrap{text-align: right; margin-top: 10px;}
    #wpdcom .wpdiscuz-edit-form-wrap .wc_save_wrap .wc_cancel_edit{margin: 0px 10px;}
    #wpdcom .wpd-form.wpd-secondary-form-wrapper{margin-bottom: 25px;}
    #wpdcom .wpd-form.wpd-secondary-form-wrapper .wpdiscuz-textarea-wrap{padding-top: 10px;}
    #wpdcom .wpd-form-wrap .wpd-login-to-comment{text-align: center;font-size: 16px;padding: 15px 0 0 0;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap{padding-bottom: 10px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt{flex-wrap: wrap;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-avatar{flex-basis: 69px; margin-right: 0;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap{flex-basis: calc( 100% - 70px );}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap .quicktags-toolbar{ width: 100%; margin-bottom: 1px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap textarea{width: 100%;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wmu-upload-wrap {flex-basis: 100%;text-align: right; margin-top: 3px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wmu-upload-wrap i{color: #888; font-size: 18px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt [wpd-tooltip]::after{left:auto; margin-left: -35px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt [wpd-tooltip]::before{right: 25px; left:auto;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .quicktags-toolbar .ed_button {opacity: 0.8; box-shadow:none; background: #eeeeee; color: #666; font-size: 13px; padding: 1px 12px; margin: 2px 1px; display: inline-block; border-radius: 0; line-height: 20px;}
    #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .quicktags-toolbar .ed_button:hover{opacity: 1;}
    
    /* COMMENT FORM | BUTTONS */
    #wpdcom input[type="button"],
    #wpdcom input[type="reset"],
    #wpdcom input[type="submit"],
    #wpdcom button{margin:inherit;}
    #wpdcom .wc-field-submit input[type="submit"]{margin-left: 2%;}
    #wpdcom .wpd_label, #wpdcom .wpd_label{margin:1px 0px 5px 0px; padding: 0px;display:inline-block;}
    #wpdcom .wpd_label, #wpdcom .wpd_label span{display: inline-block}
    #wpdcom .wpd_label input[type="checkbox"].wpd_label__checkbox{display:none; }
    #wpdcom .wpd_label__checkbox { display: none; }
    #wpdcom .wpd_label__check { display: inline-block; border: 0px; border-radius: 0; vertical-align: middle; cursor: pointer; text-align: center; margin:0px 3px 0px 0px; }
    #wpdcom .wpd_label__check i.wpdicon{font-size: 15px; line-height: 20px; padding: 4px 5px; width: 32px; margin: 0px; }
    #wpdcom .wpd_label__check i.wpdicon-on{display: none;}
    #wpdcom .wpd_label__check i.wpdicon-off{display: inline-block; color: #aaaaaa; border: 1px solid #dddddd; }
    #wpdcom .wpd_label__checkbox:checked + .wpd_label__text .wpd_label__check .wpdicon-on{display: inline-block; }
    #wpdcom .wpd_label__checkbox:checked + .wpd_label__text .wpd_label__check .wpdicon-off{display:none; }
    #wpdcom .wpd_label__check i.wpdicon-off.fa-unlock-alt, #wpdcom .wpd_label__check i.wpdicon-on.fa-lock{ font-size: 15px; }
    #wpdcom.wpdiscuz_unauth .wc-field-submit{padding-top: 15px;}
    
    /* Comment Form | ROWS and COLS */
    #wpdcom .wpd-form-foot{margin-left: 70px;}
    #wpdcom .wpd-form-row .wpd-form-col-full{width:100%; float:none; margin:0; text-align:left; padding:0; }
    #wpdcom .wpd-form-row .wpd-form-col-left{width:49%; float:left; margin:0; text-align:left; padding:0; }
    #wpdcom .wpd-form-row .wpd-form-col-right{width:49%; float:right; margin:0; text-align:right; padding:0; }
    #wpdcom .wpd-form-row .wpd-form-col-full .wpdiscuz-item{text-align:left; }
    #wpdcom .wpd-form-row .wpd-form-col-left .wpdiscuz-item{text-align:left; }
    #wpdcom .wpd-form-row .wpd-form-col-right .wpdiscuz-item{text-align:right; }
    
    /* Comment Fields | FIELDS */
    #wpdcom .wpdiscuz-item label.wpd-field-label{ float:none; }
    #wpdcom .wpd-form-row .wpdiscuz-item{width:100%; vertical-align:baseline; padding:1px 0 7px 0; position:relative; }
    #wpdcom .wpd-form-row .wpd-field{width:100%; line-height:20px; color:#777777; display:inline-block; float:none; clear:both; margin:0; box-sizing:border-box; padding-top:2%; padding-bottom: 2%; font-size:14px; border-radius:3px; vertical-align:baseline;}
    #wpdcom .wpd-form-row .wpd-has-icon .wpd-field{padding-left:30px; }
    #wpdcom .wpd-form-row .wpd-has-desc .wpd-field{padding-right:30px; }
    #wpdcom .wpd-form-row .wpdiscuz-item .wpd-field-icon {display:inline-block; font-size:16px; line-height:16px; opacity:0.3; padding:0; margin:0px; position:absolute; top:9px; left:8px; width:20px; text-align:left; }
    #wpdcom .wpd-form-row .wpdiscuz-item .wpd-field-desc{display:inline-block; font-size:16px; line-height:16px; opacity:1; margin:0px; position:absolute; top:8px; right:8px; width:20px; text-align:right; border-left:1px solid #ccc; color:#aaa; padding:0px 5px; cursor:pointer; }
    #wpdcom .wpd-form-row .wpdiscuz-item.wpd-field-select .wpd-field-desc{border-left: none;}
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="text"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="email"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="url"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="color"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="date"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime-local"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="month"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="number"],
    #wpdcom .wpd-form-row .wpdiscuz-item input[type="time"]{height:32px;}
    #wpdcom .wpd-form-row .wpdiscuz-item textarea{height:72px; padding-left: 10px;}
    #wpdcom .wc-field-submit{text-align:right; padding: 1px 2px 0 0; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-start;}
    #wpdcom .wc-field-submit input[type="button"]{margin:1px; border:#ddd 1px solid; font-size:13px; line-height:16px; padding:6px 15px; clear:both; float:none}
    #wpdcom .wpd-item-wrap{ text-align:left; }
    #wpdcom .wpd-item{ text-align:left; }
    #wpdcom .wpd-form-col-left .wpd-field-group .wpd-field-group-title, #wpdcom .wpd-form-col-right .wpd-field-group .wpd-field-group-title, #wpdcom .wpd-form-col-full .wpd-field-group .wpd-field-group-title{ font-size:13px; text-align:left; line-height:20px; padding: 5px 0; }
    #wpdcom .wpd-form-col-left .wpd-has-desc .wpd-field-group-title, #wpdcom .wpd-form-col-right .wpd-has-desc .wpd-field-group-title, #wpdcom .wpd-form-col-full .wpd-has-desc .wpd-field-group-title{ padding-right:35px; }
    #wpdcom .wpd-comment-right .wpd-top-custom-fields{ padding:5px 10px 10px 0px; }
    #wpdcom .wpd-comment-right .wpd-bottom-custom-fields{ padding:5px 0px; margin-bottom:5px; margin-top: 10px;}
    
    /* Checkbox */
    #wpdcom .wpd-form-col-left div:last-of-type, #wpdcom .wpd-form-col-right div:last-of-type{ border-bottom:none; }
    
    /* Comment Threads */
    #wpdcom #wpd-threads{margin-top: 20px;}
    #wpdcom .wpd-thread-head{width: 100%; border-bottom: 2px solid #cccccc; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;}
    #wpdcom .wpd-thread-head .wpd-thread-info{ color:#555555; padding:5px 15px 3px 5px; font-weight: 600; margin-bottom: -2px; font-size: 14px; letter-spacing:1px; text-transform: uppercase; text-align: left; line-height: 24px;}
    #wpdcom .wpd-thread-head .wpd-thread-info.wpd-reviews-tab{padding:5px 15px 0px 14px;}
    #wpdcom .wpd-thread-head .wpd-thread-info .wpdtc{font-size: 15px;}
    #wpdcom .wpd-thread-head .wpdiscuz-user-settings{font-size:15px; color:#777777; cursor: pointer; text-align: center; padding: 5px 10px 6px 12px; margin:0 2px -2px 2px; width: 40px; text-align: center;}
    #wpdcom .wpd-thread-head .wpd-thread-filter{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;}
    #wpdcom .wpd-thread-filter .wpd-filter{font-size:16px; color:#999999; border-bottom: 2px solid #999999; cursor: pointer;text-align: center; padding: 5px 10px; margin:0 1px -2px 1px; line-height: 18px;}
    #wpdcom .wpd-thread-filter .wpdf-reacted{color:#ffa600; border-bottom-color: #ffa600; width: 34px;}
    #wpdcom .wpd-thread-filter .wpdf-hottest{color:#fc5844; border-bottom-color: #fc5844; width: 34px;}
    #wpdcom .wpd-thread-filter .wpdf-sorting{font-size:14px; color:#777777; line-height: 18px; text-transform: capitalize; min-width: 100px; font-family: "Arial Hebrew", Arial, sans-serif;}
    #wpdcom .wpd-thread-filter .wpdf-sorting i{font-size: 15px; margin-left: 6px; vertical-align: top; line-height: 14px;}
    #wpdcom .wpd-thread-list .wpd-load-more-submit-wrap{display: flex; flex-direction: row; justify-content: center; padding: 10px;}
    
    /* Comment - Default Layout (#1) */
    #wpdcom .wpd-thread-list{ padding: 30px 0;}
    #wpdcom .wpd-comment .wpd-comment-wrap{display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: space-between;align-items: stretch;align-content: flex-start; padding-bottom: 5px;}
    #wpdcom .wpd-comment .wpd-comment-left{width: 60px; text-align: center; margin-right: 20px;}  _:-ms-lang(x), #wpdcom .wpd-comment .wpd-comment-left{width: auto;}
    #wpdcom .wpd-comment .wpd-comment-right{padding-bottom: 15px; flex-grow: 1; width: calc(100% - 80px);}
    #wpdcom .wpd-comment .wpd-avatar {position: relative;}
    #wpdcom .wpd-comment .wpd-avatar img,
    #wpdcom .wpd-comment .wpd-avatar img.avatar{width:56px; height:56px; max-width: 56px; border-radius: 100%; border: 1px solid #cccccc; padding: 2px; background-color: #ffffff; vertical-align: middle; text-align: center; float: none;}
    #wpdcom .wpd-comment .wpd-avatar i{position: absolute;bottom: 1px;right: 5px; border-radius: 50%;padding: 3px;font-size: 10px;border: 2px solid #fff; width: 20px; line-height: initial!important; text-align: center;}
    #wpdcom .wpd-comment .wpd-comment-label{ margin: 9px auto 2px auto; border-radius: 3px; font-size: 11px; line-height: 14px; text-align: center; width: 100%; padding: 1px 5px; cursor: default; display: flex; align-items: center; justify-content: center; flex-flow: row;}
    #wpdcom .wpd-comment .wpd-comment-label span{text-overflow: ellipsis; white-space: nowrap;overflow: hidden; display: inline-block; width: 100%; padding: 0;}
    #wpdcom .wpd-comment .wpd-follow-link{color:#999999; font-size: 13px; cursor: pointer; padding-left: 5px;}
    #wpdcom .wpd-comment-header{ font-size: 13px; color: #999999;}
    #wpdcom .wpd-comment .wpd-comment-header{padding:5px 0 5px 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center;}
    #wpdcom .wpd-comment-header .wpd-comment-author{ font-size: 15px; font-weight: 600; text-decoration: none; letter-spacing:0.7px; margin-right: 5px;}
    #wpdcom .wpd-comment .wpd-comment-header i{line-height: 1.75;}
    #wpdcom .wpd-comment-date{padding:0 5px; font-size: 11px;}
    #wpdcom .wpd-comment-date i{ font-size: 11px; margin-right: 4px;}
    #wpdcom .wpd-comment-status{padding:0 5px;}
    #wpdcom .wpd-comment-status div{display: inline-block; cursor: default;}
    #wpdcom .wpd-comment-status i{ margin:0 3px;}
    #wpdcom .wpd-comment-status .wpd-sticky{vertical-align: top;}
    #wpdcom .wpd-comment-status .wpd-closed{color: #999999; font-size: 12px;}
    #wpdcom .wpd-comment-header .wpd-comment-share{padding:0 6px; color: #aaaaaa; cursor: default;}
    #wpdcom .wpd-comment-header .wpd-comment-share .wpd-tooltip-content{text-align: center;}
    #wpdcom .wpd-comment-header .wpd-comment-share .wpd-tooltip-content i{ font-size: 12px; padding:0 6px; cursor: pointer;}
    #wpdcom .wpd-comment-header .wpd-comment-share .wpd-tooltip-content i:hover{ color: #ffee46;}
    #wpdcom .wpd-comment-header .wpd-comment-link{padding:0; cursor: pointer; font-size: 12px; color: #aaaaaa; align-self: flex-start; padding-top: 9px;}
    #wpdcom .wpd-comment-header .wpd-comment-link span{margin-left: 12px}
    #wpdcom .wpd-comment-text{font-size: 15px; padding:0 0 8px 0; word-break: break-word;}
    #wpdcom .wpd-comment-text * {line-height: 1.6;}
    #wpdcom .wpd-comment-text p{margin-right: 10px;}
    #wpdcom .wpd-comment-text p:last-child{margin-bottom:0px;}
    #wpdcom .wpd-comment-text ol,
    #wpdcom .wpd-comment-text ul{margin: 0 0 1rem 1rem;}
    #wpdcom .wpd-comment-text img,
    #wpdcom .wpd-comment-text iframe,
    #wpdcom .wpd-comment-text video,
    #wpdcom .wpd-comment-text audio{max-width: 100% !important;}
    #wpdcom .wpd-comment-text iframe{width: 480px; height: 280px;}
    #wpdcom .wpd-comment-text blockquote {margin: 5px auto 5px 15px;padding: 2px 10px;font-size: 14px;}
    #wpdcom .wpd-comment-text blockquote p {margin-bottom: 5px;}
    #wpdcom .wpd-comment-text .wpd-inline-feedback-wrapper {font-style: italic; font-size: 15px; padding: 15px; background: #fffce1; margin-bottom: 10px; color: #777;}
    #wpdcom .wpd-comment-text .wpd-inline-feedback-wrapper .wpd-inline-feedback-info{font-style: normal; font-weight: 600;}
    #wpdcom .wpd-comment-text .wpd-inline-feedback-wrapper i.fa-quote-left { margin-right: 8px;font-size: 17px;color:#999797;}
    #wpdcom .wpd-comment-footer{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content:space-between; align-items: center; padding-top:0;}
    #wpdcom .wpd-comment-footer .wpd-vote{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; padding-right: 20px; font-size: 0;}
    #wpdcom .wpd-comment-footer .wpd-vote-up,
    #wpdcom .wpd-comment-footer .wpd-vote-down{ width: 16px; height: 16px; opacity:0.7; cursor: pointer;}
    #wpdcom .wpd-comment-footer .wpd-vote-down.wpd-dislike-hidden{display:none!important;}
    #wpdcom .wpd-comment-footer .wpd-vote-up svg,
    #wpdcom .wpd-comment-footer .wpd-vote-down svg{ fill: #888888; cursor: pointer;}
    #wpdcom .wpd-comment-footer .wpd-vote-result{padding:0 8px; font-size: 14px; text-align: center; color: #999999;}
    #wpdcom .wpd-comment-footer .wpd-reply-button{cursor:pointer; font-size: 14px; color: #999999; white-space: nowrap;}
    #wpdcom .wpd-comment-footer .wpd-reply-button i{margin-right: 6px; opacity:0.7;}
    #wpdcom .wpd-comment-footer .wpd-reply-button svg{ vertical-align: middle; transform: rotate(180deg); width: 22px; height: 22px; opacity:0.7; fill: #999999; margin-right: 2px;}
    @-moz-document url-prefix() { #wpdcom .wpd-comment-footer .wpd-reply-button svg{vertical-align: bottom;} }
    #wpdcom .wpd-comment-footer .wpd-reply-button span{line-height: 21px; font-size: 1em;}
    #wpdcom .wpd-comment-footer .wpd-vote-up:hover,
    #wpdcom .wpd-comment-footer .wpd-vote-down:hover{opacity: 1;}
    #wpdcom .wpd-comment-footer .wpd-reply-button:hover{color: #777777;}
    #wpdcom .wpd-comment-footer .wpd-reply-button:hover svg{opacity: 1;}
    #wpdcom .wpd-comment-footer .wpd-tools i{color: #aaaaaa; font-size: 14px; cursor: pointer;}
    #wpdcom .wpd-comment-footer .wpd-toggle i{color: #aaaaaa; font-size: 15px; cursor: pointer;}
    #wpdcom .wpd-comment-footer .wpd-toggle .wpd-view-replies{font-size: 13px!important; color:#888;margin-right: 7px;}
    #wpdcom .wpd-hidden-replies .wpd-toggle.wpd-hidden:last-child{visibility: visible; opacity: 1;}
    #wpdcom .wpd-comment-footer .wpd-sep{border-right: 1px #cccccc solid; margin:0 7px; width: 1px; height: 15px;}
    #wpdcom .wpd-comment-right:hover .wpd-comment-footer .wpd-tool-wrap,
    #wpdcom .wpd-comment-right:hover .wpd-comment-footer .wpd-sep,
    #wpdcom .wpd-comment-right:hover .wpd-comment-footer .wpd-tools,
    #wpdcom .wpd-comment-right:hover .wpd-comment-footer .wpd-toggle,
    #wpdcom .wpd-comment-right:hover .wpd-comment-header .wpd-comment-share,
    #wpdcom .wpd-comment-right:hover .wpd-comment-header .wpd-comment-link{visibility: visible; opacity: 1;}
    #wpdcom .wpd-comment-right .wpd-comment-last-edited {margin: 10px 0 20px 0; font-size: 12px; color: #999; font-style: italic;}
    #wpdcom .wpd-comment-right .wpd-comment-last-edited i{padding-right: 5px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-left{width: 50px;} _:-ms-lang(x), #wpdcom .wpd-comment.wpd-reply .wpd-comment-left{width: auto;}
    #wpdcom .wpd-comment.wpd-reply .wpd-avatar img,
    #wpdcom .wpd-comment.wpd-reply .wpd-avatar img.avatar{width:48px; height:48px; max-width: 48px; }
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-label{font-size: 10px; line-height: 13px; margin:10px auto 7px auto;display: flex; align-items: center; justify-content: center; flex-flow: row;}
    #wpdcom .wpd-comment.wpd-reply .wpd-follow-link{font-size: 11px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-header .wpd-comment-author,
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-header .wpd-comment-author a{ font-size: 14px; margin-right: 5px;}
    #wpdcom .wpd-comment .wpd-reply-to{font-size: 13px; color: #999999; font-style: italic;}
    #wpdcom .wpd-comment .wpd-reply-to i{margin-right: 6px;}
    #wpdcom .wpd-comment .wpd-reply-to a{text-decoration: none; opacity: 0.8; color: #0274be;}
    #wpdcom .wpd-comment .wpd-reply-to a:hover{opacity: 1; color: #000000;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-vote-up,
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-vote-down{ width: 15px; height: 15px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
    _:-ms-lang(x), #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-vote-up,
    _:-ms-lang(x), #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-vote-down{display: -ms-flexbox;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-vote-result{font-size: 13px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-reply-button{font-size: 13px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-reply-button svg{width: 20px; height: 20px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-reply-button span{line-height: 19px; font-size: 1em;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-tools i{font-size: 13px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-toggle i{font-size: 14px;}
    #wpdcom .wpd-comment.wpd-reply .wpd-comment-footer .wpd-sep{height: 14px;}
    #wpdcom.wpd-layout-1 .wpd-comment .wpd-reply-to{margin-bottom: 6px; border-left: 1px solid #cccccc; padding: 0px 10px;}
    #wpdcom.wpd-layout-1 .wpd-comment .wpd-avatar i{bottom: 0px; right: 0px;}
    #wpdcom.wpd-layout-1 .wpd-new-loaded-comment > .wpd-comment-wrap > .wpd-comment-right{padding-right: 15px; padding-left: 15px;}
    #wpdcom.wpd-layout-1 .wpd-comment .wpd-follow-link{margin-top: 5px;}
    
    /* Comment - Layout #2 */
    #wpdcom.wpd-layout-2 .wpd-form .wpd-form-foot{margin-left: 65px;}
    #wpdcom.wpd-layout-2 .wpd-form .wpd-avatar{width: 54px; margin-right: 11px;}
    #wpdcom.wpd-layout-2 .wpd-form .wpd-avatar img,
    #wpdcom.wpd-layout-2 .wpd-form .wpd-avatar img.avatar{width:48px; height:48px; max-width: 48px; border-radius:0; border: none; border-bottom: 2px solid #cccccc; padding: 1px; background-color: #ffffff; vertical-align: middle; text-align: center;}
    #wpdcom.wpd-layout-2 .wpd-form .wpdiscuz-textarea-wrap textarea::placeholder {line-height: 27px;font-size: 15px;}
    #wpdcom.wpd-layout-2 .wpd-form .wpdiscuz-textarea-wrap textarea {height: 48px;}
    #wpdcom.wpd-layout-2 .wpd-comment{margin-bottom: 20px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header,
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info .wpd-uinfo-top,
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info .wpd-uinfo-bottom {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-end;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info{display: block; flex-grow: 1; margin-bottom: -3px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info .wpd-uinfo-top{flex-wrap: nowrap; align-items: center;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-comment-label{width: auto; padding: 1px 15px; }
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-label{margin: 0px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-avatar{padding-right: 15px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-avatar img,
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-avatar img.avatar{width:48px; height:48px; max-width: 48px; border-radius:0; border: none; border-bottom: 2px solid #cccccc; padding: 1px; background-color: #ffffff; vertical-align: middle; text-align: center;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-avatar i{bottom: -2px; right: 7px;}
    _:-ms-lang(x), #wpdcom.wpd-layout-2 .wpd-comment .wpd-avatar i{line-height: 10px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-follow-link {font-size: 12px; padding-left: 2px; padding-right: 12px;}
    #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-text{margin: 8px 0 5px 0;}
    #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-comment-date {padding:0 10px 0 0;font-size: 12px;}
    #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-comment-status {padding:0 10px;}
    #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-comment-link {margin-bottom:0; padding-top: 1px;}
    #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-reply-to{font-size: 12px; padding-top:2px; margin-left: 0px; font-style: normal;}
    #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-reply-to i{margin-right: 3px;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply {margin-bottom: 0;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-comment-header .wpd-user-info .wpd-uinfo-top{margin-bottom: 3px;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-comment-header .wpd-comment-date {padding:0 10px;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-comment-label{font-size: 10px; line-height: 13px; margin:0 10px 0 0;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-follow-link{margin-right: 12px; border-right: 1px solid #ccc; padding-right: 12px;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-comment-wrap{margin: 0px 0px 5px 0px; background-color:#fafafa; border-left: 3px solid #dedede; padding: 10px 15px 0px 17px;}
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-avatar img,
    #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-avatar img.avatar{border-bottom: none;}
    #wpdcom.wpd-layout-2 .wpd-new-loaded-comment > .wpd-comment-wrap > .wpd-comment-right{padding-right: 15px; padding-left: 15px;}
    #wpdcom.wpd-layout-2 .wpd-new-loaded-comment.wpd-comment.wpd-reply > .wpd-comment-wrap > .wpd-comment-right{padding-left: 0; padding-right: 0;}
    
    /* Tools Actions */
    #wpdcom .wpd-tools{position:relative;}
    #wpdcom .wpd-tools-actions{display:none; font-family: "Arial Hebrew", Arial, sans-serif; font-size: 14px; position: absolute; left: -50%; min-width: 100px; flex-direction: column; background-color: #fff; border: 1px solid #ccc; padding: 5px 8px; border-radius: 3px; z-index: 9; color: #999; top: 26px;}
    #wpdcom .wpd-tools-actions .wpd-cta-button{cursor: pointer; line-height: 18px;  padding: 2px 5px;}
    #wpdcom .wpd-tools-actions .wpd-cta-button a{color: #999;}
    #wpdcom .wpd-tools-actions .wpd-cta-button:hover{background-color: #F5F5F5;}
    #wpdcom .wpdf-sorting{position:relative;}
    #wpdcom .wpdiscuz-sort-buttons{display:none;position:absolute;flex-direction:column;background-color:#fff;border:1px solid #ccc;padding:5px;border-radius:3px;width:100%;left:0;top:32px;z-index:9;}
    #wpdcom .wpdiscuz-sort-buttons .wpdiscuz-sort-button{padding:5px 0;}
    #wpdcom .wpdiscuz-sort-buttons .wpdiscuz-sort-button:hover{background-color: #F5F5F5;}
    #wpdcom .wpd-comment .wpd-comment-status .wpd-unapproved{color:#fc9007;}
    #wpdiscuz-comment-message{position:fixed;top:38px;right:5px;width:400px;z-index:99999; font-size: 14px; line-height: 20px;}
    #wpdiscuz-comment-message.wpdiscuz-comment-message-auth{top:60px;}
    #wpdiscuz-comment-message div{color:#fff;padding:5px 10px;margin-top:5px;}
    #wpdiscuz-comment-message .wpdiscuz-message-error {background-color: #D32F2F;box-shadow:#666 0px 0px 8px; padding: 10px 20px;}
    #wpdiscuz-comment-message .wpdiscuz-message-success {background-color: #4CAF50;box-shadow:#666 0px 0px 8px; padding: 10px 20px;}
    #wpdiscuz-comment-message .wpdiscuz-message-warning {background-color: #FFA726;box-shadow:#666 0px 0px 8px; padding: 10px 20px;}
    
    #wpd-editor-source-code-wrapper-bg{display: none;position: fixed;top: 0;left: 0;background-color: rgba(0,0,0,.6);width: 100%;z-index: 9999999;height: 100%;}
    #wpd-editor-source-code-wrapper{display: none;width: 50%;height: 350px;position: fixed;top: 50%;left: 50%;transform:translate(-50%,-50%);background-color: #fff;z-index: 99999991;justify-content: center;align-items: center;padding: 5px;border-radius: 5px;text-align: right;}
    #wpd-editor-source-code{height: 300px;width: 100%;resize: none;}
    #wpd-insert-source-code{padding: 3px 40px; margin-top: 5px;}
    .wpd-vote-result-sep {height: 11px;align-self: center;width: 1px;background-color: #ccc;}
    
    #wpdiscuz-loading-bar{position:fixed;top:6px;right:12px;width:32px;height:25px;border:0;background-image:url('../../assets/img/loading.gif');z-index:999999;display:none;}
    #wpdiscuz-loading-bar.wpdiscuz-loading-bar-auth{top:38px;}
    
    #wpdcom .wpd-comment-info-bar {display: none; padding: 10px; margin: 20px auto 0 auto; flex-direction: row; justify-content: space-between; font-size: 14px; }
    #wpdcom .wpd-current-view{padding: 3px; color: #555;}
    #wpdcom .wpd-comment-info-bar .wpd-current-view i{margin-right: 6px; font-size: 18px;}
    #wpdcom .wpd-filter-view-all{color: #fff;background:#999;padding: 5px 20px;font-size: 13px;cursor: pointer;border-radius: 3px;}
    
    /* No Avatar */
    #wpdcom.wpdiscuz_no_avatar .wpd-comment .wpd-comment-right{flex-basis: 100%;}
    #wpdcom.wpdiscuz_no_avatar .wpd-form .wpdiscuz-textarea-wrap.wpd-txt textarea{flex-basis: 100%;}
    #wpdcom.wpdiscuz_no_avatar.wpd-layout-1 .wpd-form .wpd-form-foot,
    #wpdcom.wpdiscuz_no_avatar.wpd-layout-2 .wpd-form .wpd-form-foot,
    #wpdcom.wpdiscuz_no_avatar.wpd-layout-3 .wpd-form .wpd-form-foot{margin-left: 0;}
    #wpdcom.wpdiscuz_no_avatar.wpd-layout-1 .wpd-comment .wpd-comment-wrap{display: block;}
    #wpdcom.wpdiscuz_no_avatar.wpd-layout-1 .wpd-comment .wpd-follow-link{text-align: left;}
    
    /* Errors */
    .wc_comment_edit_not_possible,.wc_comment_not_edited,.wc_comment_not_updated,
    .wc_deny_voting_from_same_ip,.wc_error_email_text,.wc_error_url_text,
    .wc_follow_email_confirm_fail,.wc_follow_impossible,.wc_follow_login_to_follow,
    .wc_follow_not_added,.wc_invalid_captcha,.wc_invalid_field,.wc_login_to_vote,
    .wc_msg_input_max_length,.wc_msg_input_min_length,.wc_msg_required_fields,
    .wc_self_vote,.wc_vote_only_one_time,.wc_voting_error,.wpdiscuz-sendmail-error{background-color:#fce8e8!important;font-size:14px;text-align:center;color:#ce4a66;border:1px solid #f2d3d2;padding:5px 10px;width:100%;box-sizing:border-box;margin:5px 0;border-radius:3px}
    .wpd-ajax-error{background-color:#fce8e8!important;font-size:14px;text-align:center;color:#ce4a66;border:1px solid #f2d3d2;padding:5px 10px;width:100%;box-sizing:border-box;margin:5px 0;border-radius:3px}
    
    /* Labels & Avatar Colors */
    #wpdcom .wpd-avatar img{border-color: #999999;}
    #wpdcom .wpd-comment-label{color: #666666; border: 1px solid #999999;}
    #wpdcom .wpd-comment-author, #wpdcom .wpd-comment-author a{color: #666666;text-decoration:none;}
    
    /* Blog User (All other user roles / logged-in users) */
    #wpdcom .wpd-blog-user .wpd-comment-label{color: #ffffff; background-color: #31839e; border: none;}
    #wpdcom .wpd-blog-user .wpd-comment-author, #wpdcom .wpd-blog-user .wpd-comment-author a{color:#31839e;}
    
    /* Smart Phones */
    @media screen and (max-width:600px){
        #comments, #respond{padding-left: 0!important;padding-right: 0!important;}
        #wpdcom {padding: 5px 3%;overflow: hidden;}
        #wpdcom .wpd-form-row div:hover.wpd-field-desc span {margin-left: -187px;}
        #wpdcom .wpd-form-row div.wpd-field-desc span::after { margin-left: 80px;}
        #wpdcom #wpd-threads .wpd-comment-link [wpd-tooltip]::after{left: -150%;}
        #wpdcom #wpd-threads .wpd-tool-wrap [wpd-tooltip]::after{left: -50%;}
    
        /* Comment Form */
        #wpdcom .wpd-auth {margin: 0 0 2px -3px;}
        #wpdcom .wpd-social-login .wpd-connect-with{display: none!important;}
        #wpdcom .wpd-form .wpd-avatar{display: none;}
        #wpdcom .wpd-form.wpd-form-wrapper{padding-right: 5px;}
        #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt textarea{flex-basis: 100%; width: 100%;}
        #wpdcom .wpdiscuz_select{font-size: 16px !important;}
        #wpdcom .wpd-form .wpd-form-foot,
        #wpdcom.wpd-layout-2 .wpd-form .wpd-form-foot{margin-left: 0;}
        #wpdcom .wpd-form-row .wpd-form-col-left,
        #wpdcom .wpd-form-row .wpd-form-col-right {width: 100%; float: none;}
        #wpdcom .wpdiscuz-item.wpd-field-group.wpd-field-rating {border-bottom: none; height: auto;}
        #wpdcom .wpd-form-row .wpdiscuz-item input[type="text"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="password"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="email"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="url"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="color"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="date"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime-local"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="month"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="number"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="time"], #wpdcom .wpd-form-row .wpdiscuz-item input[type="week"], #wpdcom textarea, #wpdcom select, #wpdcom .wpd-form-row .wpd-field{font-size: 16px!important; height: auto;}
        #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap{flex-basis: 100%; width: 100%;}
        #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .quicktags-toolbar{margin-bottom: 2px;}
        #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .quicktags-toolbar .ed_button {font-size: 14px; width: 19%;}
        /* Comment Threads */
        #wpdiscuz-comment-message{width: 97%; }
        #wpdcom .wpd-hidden {visibility: visible; opacity: 1;}
        #wpdcom .wpd-tools-actions{left: auto; right: 0px;}
        #wpdcom .wpd-thread-head .wpd-thread-info{flex-basis: 100%; border-bottom: 2px solid #ccc;}
        #wpdcom .wpd-thread-head .wpd-thread-filter{margin-top: 5px;}
        #wpdcom .wpd-comment-footer .wpd-toggle .wpd-view-replies{display: inline-block; width: 78px; white-space: nowrap; overflow: hidden;font-size: 10px !important;}
        /* Comment Layouts */
        #wpdcom .wpd-comment .wpd-comment-wrap{display: block;}
        #wpdcom .wpd-comment-footer{flex-wrap: wrap;}
        #wpdcom .wpd-comment .wpd-comment-left{width: 100%;}
        #wpdcom .wpd-comment .wpd-comment-right{width: 100%;}
        /* Comment Layout #1 */
        #wpdcom.wpd-layout-1 .wpd-comment .wpd-comment-left{text-align: left;}
        /* Comment Layout #2 */
        #wpdcom.wpd-layout-2 .wpd-reply {margin-left: 0px;}
        #wpdcom.wpd-layout-2 .wpd-reply.wpd_comment_level-2{margin-left: 15px;}
        #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info {width:100%; display: flex; flex-direction:row; justify-content: flex-start; flex-grow: 0;margin-bottom: -3px;float: right;margin-left: 61px;flex-wrap: wrap;margin-top: -44px;}
        #wpdcom.wpd-layout-2 .wpd-comment .wpd-comment-header .wpd-user-info .wpd-uinfo-top {flex-wrap: wrap!important;}
        #wpdcom.wpd-layout-2 .wpd-comment.wpd-reply .wpd-comment-header .wpd-comment-date{padding-left: 0;}
        #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-comment-link {margin-bottom: 0; padding-top: 1px; align-items: normal; flex-basis: 100%; text-align: right; margin-top: -20px;}
        #wpdcom.wpd-layout-2 .wpd-comment-header .wpd-reply-to{margin-right: 10px;}
        /* Tooltip */
        [wpd-tooltip-size='small']::after{min-width: 60px;}
        [wpd-tooltip-size='medium']::after{min-width: 90px;}
        [wpd-tooltip-size='long']::after{min-width: 200px;}
    }

    Note that you will need to use Layout 2 for the above to work – I wiped out Layout 3 from the CSS, since I don’t care for it.

    Hope this helps!

    Ideally, no external fonts should be loaded – adding a file to load decreases site speed and puts more unnecessary load. Instead, load SVG into CSS and serve it that way. It will be much faster and very lightweight in comparison.

    I would love to see a truly minimal CSS approach also. One that shows the bare minimum, and rest gets loaded on demand

    Thread Starter MegaZ

    (@megaz)

    @gvectors-team, I am aware of the Rich Editor being loaded separately. However, if you open the minified JS file, you will see that you are making a ton of calls to the rich editor (different functions), as well as other features that are potentially unused. I can clean up your JS file myself, but I would rather have you guys do that.

    My recommended approach is to strip out anything that is not needed by the core plugin. If a user adds a module to use (such as subscribers, or bubbles), then add separate JS files. If this is done properly, the main JS file should only be 1-2 KB in size, not 54K.

    Keep in mind that combining scripts or using minified versions doesn’t make your plugin faster – a browser still needs to download and render those files. If you split up the functionality, one can then use a plugin like W3TC to merge all files into a single CSS and JS file and make it super small and fast.

    Please prioritize these fixes / optimizations. If you make this plugin small and lightweight (core plugin functionality), it will instantly be the #1 plugin system for WordPress. At this point, it is running a pile of unnecessary code and CSS – just use a browser inspector and take a look at the Coverage tab – mine is showing that over 80% of the code is not used for both JS and CSS. That’s a lot of unused code to parse for a browser.

    Thanks for clearing up on the minimum style. Instead of having your end users create CSS from scratch, why not make the smallest CSS file that only works with one template and provides only styling for the core plugin? If you do this, it would be the most minimal version, and it would require little to no styling effort on the end part of developers. Right now, one has to deal with all that CSS code and try to figure out what to keep and what to delete…

    Hope this helps. Once again, please don’t take this as a criticism of your work. You guys are doing a lot of great stuff and I am looking forward to seeing WPDiscuz as the most popular comment system for WordPress.

    Thread Starter MegaZ

    (@megaz)

    OK, I see what the issue is. Well, it used to work before, and now it doesn’t ??

    I changed the variable to the following:
    %%term_title%% %%page%% %%sep%% %%sitename%%

    After I did that, the Category title started working again. Thanks for your help!

    Thread Starter MegaZ

    (@megaz)

    Forgot to add, there are no Javascript errors in the console. WordPress version is 5.4.2.

    Thread Starter MegaZ

    (@megaz)

    Running Yoast 14.4.1 (latest version).

    Under Search Appearance -> Taxonomies, I have SEO title set as “%%category%% %%page%% %%sep%% %%sitename%%”.

    After saving, the result is the following: ” – Site Name”. Page and separator are working fine, only the category title itself isn’t showing up.

    All other snippets are working just fine, only categories is messed up.

    Thread Starter MegaZ

    (@megaz)

    Amazing, thanks Bryan!!! Yes, this solves the issue completely.

    Thread Starter MegaZ

    (@megaz)

    @bhadaway, after a little bit of troubleshooting to find out what was wrong, I found the issue. The problem is not with the giant array of files in the chkdisp.php, that’s not what is halting PHP. The problem is with the main stop-spammer-registrations-new.php script. Specifically, here is the line of code that is doubling PHP load time for me:

    add_filter( 'gettext', 'ss_login_text' );
    function ss_login_text( $translating ) {
            $options = ss_get_options();
            if ( isset( $options['login_type'] ) && $options['login_type'] == "username" ) {
                    return str_ireplace( 'Username or Email Address', 'Username', $translating );
            } else if ( isset( $options['login_type'] ) && $options['login_type'] == "email" ) {
                    return str_ireplace( 'Username or Email Address', 'Email Address', $translating );
            } else {
                    return $translating;
            }
    }

    As soon as I stop add_filter( ‘gettext’, ‘ss_login_text’ ); from calling the ss_login_text function, performance comes back to normal.

    Here is the timed curl response time before and after:
    real 0m0.750s
    real 0m0.766s

    After:
    real 0m0.329s
    real 0m0.336s

    As you can see, that one line of code is causing the script execution time to more than double.

    It looks like you are not using gettext correctly, which is causing all the performance issues. Please have a look at this article for more details on what gettext can do on busy servers:

    https://pippinsplugins.com/dangers-gettext-filter/

    The specific line in your code that is wreaking havoc is “$options = ss_get_options();” – I suspect it is somehow invoking all options to be translated? Who knows, but the issue has been identified, and I suggest that you remedy it as soon as possible and avoid gettext calls altogether, if possible.

    I went through every plugin I have, and not a single one invokes gettext. I think this filter is too dangerous and should not be used in a live environment…

    Thread Starter MegaZ

    (@megaz)

    Thanks @bhadaway for understanding.

    I don’t think the issue in this particular case has to do with bloating – could be simply something PHP is having a hard time parsing, so it is creating a much bigger load on the PHP server and reducing page load time. I am running HUGE plugins like WooCommerce, which have hundreds of PHP scripts with a boatload of content – none of them slow down the site. So you have a long way to go before this plugin becomes bloated. I simply think the changes implemented in 2020.4 are not good in terms of performance impact. Once again, if you simply put the 2020.3 code against .4, you will see that the script execution time has increased dramatically.

    For a start, I would recommend rolling back the changes from 2020.4 to 2020.3, which should address the performance issue immediately. Then we can see what can be done with parsing of thousands of domains through an array – perhaps there is a more efficient way to do it.

    Please keep in mind that whoever updates to the 2020.4 version is already impacted – rolling back or pushing a 2020.5 update that removes the performance bottlenecks is going to make both website owners and hosting companies happy ??

    Thanks for the hard work!

    Thread Starter MegaZ

    (@megaz)

    @bhadaway, I am not here to waste anyone’s time. I like your plugin, and it is the only plugin that actually works to prevent spam, especially for busy sites like mine.

    Hosting makes a difference, but in my case, I am running 5 servers in a load-balanced environment, with Cloudflare in the front. When measuring the performance of your plugin, I am running it without any caching in front, simply measuring back-end performance. The latest update is certainly creating a huge performance bottleneck, and I can easily tell the difference between 2020.3 and 2020.4. I tried disabling the disposable email check option, but it is not doing any good – I believe the performance issue is stemming from too large of an array.

    I looked at the code differences between 2020.4 and 2020.3 – it looks like the large array is the biggest change you’ve implemented.

    I am surprised you are not seeing any performance issues. Have you tried to time page load time with 2020.3 vs 2020.4?

    Please don’t take any of this as a criticism of your work. This is a great plugin, and I hope you succeed with your efforts with monetization.

Viewing 15 replies - 1 through 15 (of 54 total)