The Live CSS editor is currently being included in the code of every page using the Newspaper theme (even for non-logged in users), and is merely being hidden from view with a style="display: none"
I noticed it when looking at my site’s results in Google search, and seeing this in the summary for every page:
“Edit with Live CSS. Save. Write CSS OR LESS and hit save. CTRL + SPACE for …”
This issue was also brought up by someone else as a comment on Themeforest: https://themeforest.net/comments/18588378
As was mentioned by that user in the Themeforest thread, this can be fixed by manually commenting out the require_once "css-live/css-live.php"; line in the wp-content/plugins/td-composer/td-composer.php file.
But that does not seem like the best long term solution.
Would it be possible in a future Newspaper update to set this to only be included on a page when a user is logged in, for example with a is_user_logged_in() check or something?
Because, besides the effects in the search engines, I think it is totally unnecessary to load all this extra code on each page when no one is even logged in to make use of the editor:
<div id="tdw-css-writer" style="display: none" class="tdw-drag-dialog tdc-window-sidebar">
<header>
Edit with Live CSS
<div class="tdw-less-info" title="This will be red when errors are detected in your CSS and LESS"></div>
</header>
<div class="tdw-content">
<div class="tdw-tabs-content tdw-tab-editor tdc-tab-content-active">
<script>
(function(jQuery, undefined) {
jQuery(window).ready(function() {
if ( 'undefined' !== typeof tdcAdminIFrameUI ) {
var $liveIframe = tdcAdminIFrameUI.getLiveIframe();
if ( $liveIframe.length ) {
$liveIframe.load(function() {
$liveIframe.contents().find( 'body').append( '<textarea class="tdw-css-writer-editor" style="display: none"></textarea>' );
});
}
}
});
})(jQuery);
</script>
<textarea class="tdw-css-writer-editor td_live_css_uid_1_5a77558c5778f"></textarea>
<div id="td_live_css_uid_1_5a77558c5778f" class="td-code-editor"></div>
<script>
jQuery(window).load(function (){
if ( 'undefined' !== typeof tdLiveCssInject ) {
tdLiveCssInject.init();
var editor_textarea = jQuery('.td_live_css_uid_1_5a77558c5778f');
var languageTools = ace.require("ace/ext/language_tools");
var tdcCompleter = {
getCompletions: function (editor, session, pos, prefix, callback) {
if (prefix.length === 0) {
callback(null, []);
return
}
if ('undefined' !== typeof tdcAdminIFrameUI) {
var data = {
error: undefined,
getShortcode: ''
};
tdcIFrameData.getShortcodeFromData(data);
if (!_.isUndefined(data.error)) {
tdcDebug.log(data.error);
}
if (!_.isUndefined(data.getShortcode)) {
var regex = /el_class=\"([A-Za-z0-9_-]*\s*)+\"/g,
results = data.getShortcode.match(regex);
var elClasses = {};
for (var i = 0; i < results.length; i++) {
var currentClasses = results[i]
.replace('el_class="', '')
.replace('"', '')
.split(' ');
for (var j = 0; j < currentClasses.length; j++) {
if (_.isUndefined(elClasses[currentClasses[j]])) {
elClasses[currentClasses[j]] = '';
}
}
}
var arrElClasses = [];
for (var prop in elClasses) {
arrElClasses.push(prop);
}
callback(null, arrElClasses.map(function (item) {
return {
name: item,
value: item,
meta: 'in_page'
}
}));
}
}
}
};
languageTools.addCompleter(tdcCompleter);
window.editor = ace.edit("td_live_css_uid_1_5a77558c5778f");
// 'change' handler is written as function because it's called by tdc_on_add_css_live_components (of wp_footer hook)
// We did it to reattach the existing compiled css to the new content received from server.
window.editorChangeHandler = function () {
//tdwState.lessWasEdited = true;
window.onbeforeunload = function () {
if (tdwState.lessWasEdited) {
return "You have attempted to leave this page. Are you sure?";
}
return false;
};
var editorValue = editor.getSession().getValue();
editor_textarea.val(editorValue);
if ('undefined' !== typeof tdcAdminIFrameUI) {
tdcAdminIFrameUI.getLiveIframe().contents().find('.tdw-css-writer-editor:first').val(editorValue);
// Mark the content as modified
// This is important for showing info when composer closes
tdcMain.setContentModified();
}
tdLiveCssInject.less();
};
editor.getSession().setValue(editor_textarea.val());
editor.getSession().on('change', editorChangeHandler);
editor.setTheme("ace/theme/textmate");
editor.setShowPrintMargin(false);
editor.getSession().setMode("ace/mode/less");
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: false
});
}
});
</script>
</div>
</div>
<footer>
Save
<div class="tdw-more-info-text">Write CSS OR LESS and hit save. CTRL + SPACE for auto-complete.</div>
<div class="tdw-resize"></div>
</footer>
</div>