Last active
October 8, 2019 15:40
-
-
Save pavel-vasiluk/6eae2a9935cb3b081549f44bd73666f6 to your computer and use it in GitHub Desktop.
Sulu CKEditor: adding plugins & toolbars for text color, background color & inserting images features
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{# app/Resources/SuluAdminBundle/views/Admin/index.html.twig #} | |
<!DOCTYPE html> | |
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> | |
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> | |
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> | |
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
<title>{{ name }}</title> | |
<meta name="description" content=""> | |
<meta name="viewport" content="width=device-width"> | |
<!-- Place favicon.ico and apple-touch-icon.png in the root directory --> | |
{% block stylesheets %} | |
<!-- build:css app.min.css --> | |
<link rel="stylesheet" type="text/css" href="/bundles/suluadmin/js/vendor/husky/husky.min.css"/> | |
<link rel="stylesheet" type="text/css" href="/bundles/suluadmin/css/main.css"/> | |
<!-- endbuild --> | |
{% endblock stylesheets %} | |
</head> | |
<body> | |
<div class="spinner initial-loader"> | |
<div class="double-bounce1 bouncer"></div> | |
<div class="double-bounce2 bouncer"></div> | |
</div> | |
<div id="main" data-aura-component="app@suluadmin" data-aura-user="{{ user| json_encode }}"> | |
{% block main %} | |
<div class="navigation-container"> | |
<div class="sulu-navigation-labels"></div> | |
<div data-aura-component="navigation@husky" data-aura-url="/admin/navigation" data-aura-collapse="true" | |
data-aura-user-name="{{ user.fullName }}" | |
data-aura-system-name="{{ name }}" | |
data-aura-system-version="{{ suluVersion }}" | |
data-aura-user-locales='{{ translated_locales|keys|json_encode }}' | |
data-aura-user-locale="{{ user.locale }}" | |
data-aura-logout-route="{{ path('logout') }}" | |
data-aura-resize-width="1470" | |
class="navigation-column"> | |
</div> | |
</div> | |
<div class="content-container"> | |
<div id="labels-container" data-aura-component="labels@suluadmin"></div> | |
<div class="content-column fixed"> | |
<div class="wrapper"> | |
<div class="page"> | |
<main class="grid" id="content"></main> | |
</div> | |
</div> | |
</div> | |
<div class="sidebar-column max"> | |
<aside id="sidebar" data-aura-component="sidebar@suluadmin"></aside> | |
</div> | |
</div> | |
<div id="overlayContainer" data-aura-component="overlay@suluadmin"></div> | |
{% endblock main %} | |
</div> | |
<script type="text/javascript"> | |
{% autoescape false %} | |
var SULU = { | |
debug: true, | |
user: {{ user|json_encode }}, | |
sections: {{ config|json_encode }}, | |
locales: {{ locales|json_encode }}, | |
translatedLocales: {{ translated_locales|json_encode }}, | |
translations: {{ translations|json_encode }}, | |
fallbackLocale: '{{ fallback_locale }}' | |
}; | |
{% endautoescape %} | |
// CKEditor needs base path to load some other files | |
var CKEDITOR_BASEPATH = '/bundles/suluadmin/js/vendor/husky/vendor/ckeditor/'; | |
</script> | |
{% block javascripts %} | |
<!-- build:js app.min.js --> | |
<script data-main="/bundles/suluadmin/js/main" src="/bundles/suluadmin/js/vendor/husky/husky.js"></script> | |
<script> | |
$(window).load(function () { | |
let i = setInterval(() => { | |
if (typeof app !== 'undefined' && typeof app.sandbox.ckeditor !== 'undefined') { | |
clearInterval(i); | |
app.sandbox.ckeditor.addPlugin('colorbutton'); | |
app.sandbox.ckeditor.addPlugin('colordialog'); | |
app.sandbox.ckeditor.addToolbarButton('colors', 'TextColor', 'paint-brush'); | |
app.sandbox.ckeditor.addToolbarButton('colors', 'BGColor', 'paint-brush'); | |
app.sandbox.ckeditor.addToolbarButton('insert', 'Image'); | |
} | |
}, 100); | |
}); | |
</script> | |
<!-- endbuild --> | |
{% endblock javascripts %} | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Приятно слышать, что помог 🙂Пожалуйста