StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>You'll have to create your own implementation for this. Overwriting dismissRelatedLookupPopup is a bit hackish, but Django seems to lack support for a better solution.</p> <p>UPDATE: This <a href="https://code.djangoproject.com/attachment/ticket/16260/16260-admin-popup-callback.diff" rel="nofollow">ticket</a> describes the popup issue.</p> <p>In your static folder where 'ckeditor' lives, create a plugin, e.g.</p> <pre><code>/app/ /static/ /app/ /js/ /ckeditor/ /plugins/ /feincms/ /images/ mediaFile.png plugin.js </code></pre> <p>plugin.js</p> <pre><code>/** * Basic sample plugin inserting a feincms mediaFile into the CKEditor editing area. */ // Register the plugin with the editor. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.plugins.html CKEDITOR.plugins.add( 'feincms', { // The plugin initialization logic goes inside this method. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.pluginDefinition.html#init init: function(editor) { // Define an editor command that inserts a feincms. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#addCommand editor.addCommand( 'insertMediaFile', { // Define a function that will be fired when the command is executed. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.commandDefinition.html#exec exec : function(editor) { // Define your callback function function insertMediaFile(imageUrl) { // Insert the imageUrl into the document. Style represents some standard props. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#insertHtml editor.insertHtml('<img src="/media/' + imageUrl + '" style="float:left;margin-right:10px;margin-bottom:10px;width:200px;" />'); } var imageUrl; window.dismissRelatedLookupPopup = function (win, chosenId) { imageUrl = $(win.document.body).find('#_refkey_' + chosenId).val(); insertMediaFile(imageUrl); var name = windowname_to_id(win.name); var elem = document.getElementById(name); if (elem) { if (elem.className.indexOf('vManyToManyRawIdAdminField') != -1 && elem.value) { elem.value += ',' + chosenId; } else { document.getElementById(name).value = chosenId; } } win.close(); }; var win = window.open('/admin/medialibrary/mediafile/?pop=1', 'id_image', 'height=500,width=800,resizable=yes,scrollbars=yes'); win.focus(); } }); // Create a toolbar button that executes the plugin command. // http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.ui.html#addButton editor.ui.addButton( 'feincms', { // Toolbar button tooltip. label: 'Insert MediaFile', // Reference to the plugin command name. command: 'insertMediaFile', // Button's icon file path. icon: this.path + 'images/mediaFile.png' } ); } } ); </code></pre> <p>Make sure to add the plugin to the ckeditor init script, e.g.</p> <pre><code>{ name: 'insert', items : [ 'feincms','HorizontalRule','SpecialChar' ] }, </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload