I want to implement in Django Admin a jquery plugin that "adjust" and image(http://guillotine.js.org/), them get the coordinates with ImageKit and save the new image.
I need some tutorials and advises how to do it.
I have no tutorials, but can give you advice.
You can customize your admin model with custom css and js, by Media class, like so:
class MyModelAdmin(admin.ModelAdmin):
class Media:
css = {
"all": ("my_styles.css",)
}
js = ("my_code.js",)
You can look in dev tools, how Django chose names id's and classes for elements in page and also check the docs.
Admin docs
Related
I have a website running on Django that uses Wagtail for most of the pages (that are simply text content, editable through the Wagtail Admin UI). However, I have some content that needs to be dynamically rendered from my own Django model (let's say it's a list of handouts). I'd like that content to be rendered on a Wagtail page that would also have some Wagtail models (e.g., top menu, some introductory text). What's the best way to do this? I thought about making the list of handouts an API endpoint, and rendering it with JavaScript + XHR, but it seems like there should be a good way to do it server-side.
Assuming the introductionary text is a block in a Wagtail StreamField, you could also define a Wagtail Block that links to a Django model. https://pypi.org/project/wagtail-modelchooser/ is a useful extension that provides this functionality. This makes it possible to render things from Django model instances in your Wagtail stream content.
One option would be to create a property on your Page model that retrieves whatever you are looking for from this other model
# rest of your imports
...
from handouts import Handouts
class MyPage(Page):
# rest of your page's fields
...
#property
def get_handouts(self):
handouts = Handouts.objects.all()
return handouts
Pretty much as the subject has it: I have a Flask-Admin site, and would like to add TinyMCE or CKEditor to a textarea in an inline model.
There are various instructions for adding CKEditor to Flask-Admin in general, e.g. Flask-Admin and CKEditor WYSIWYG textarea integration and Getting CKEditor to work with Flask-Admin. I've followed these to create the WTForms widget and field. The inline models don't use edit.html, for pulling in the JS, but I can add it to the master template, though this is not ideal.
But the main issue is how to attach the WTForms field to the Flask-Admin model. The existing instructions have you set a form_overrides = dict(fieldname=CKTextAreaField). But that doesn't work inside inline_models. How do I accomplish this?
I had this issue a few days ago and managed to solve it by adding this to my view class.
class CustomView(ModelView):
extra_js = ['//cdn.ckeditor.com/4.6.0/standard/ckeditor.js']
inline_models=[ ( YourModel, dict(
form_overrides={
'FieldName':CKTextAreaField
}
))]
Assuming that you followed the flask admin docs tutorial for CKEditor.
inline_models consist of (model, options) pairs. The "options" object is the key here: it accepts most of the form_* attributes that ModelView has.
In Admin for InlineForm there is a link that goes to the website, be default the text is (View on site).
I want to add a similar link that goes to that model(that is inline) Detail Edit Page.
Insert a JavaScript script in one of the Edit/Details Model Page in Admin
How can this be done ?
Adding JS and CSS to a models list_view and form_view pages are easy.
Write a class Media inside the admin class for the respective model.
admin.py
class MyModelAdmin(admin.ModelAdmin):
class Media:
css = {
"all": ("css/mycss.css",)
}
js = ("js/my_js.js",)
Place the javascript file inside /yourapp/static/yourapp/js/my_js.js
and css inside /yourapp/static/yourapp/css/mycss.css
How may I widen the searchbox in Django CMS admin?
enter image description here
You can specify additional CSS to be loaded as part of the admin page.
For example, see below an example loading both CSS and JS files:
class ImageGalleryAssetAdmin(admin.ModelAdmin):
...
class Media:
js = ('admin/xxx/enhance_admin.js',)
css = {
'all': ('admin/css/xxx/list_view.css',)
}
admin.site.register(ImageGalleryAsset, ImageGalleryAssetAdmin)
You can then just find ID of your search box and specify CSS to change its looks.
Please suggest the best way to add tinymce to django admin area. Is it possible to add it by extending /admin/change_form.html in my template directory ?
The best way in my opinion is django-tinymce.
Its awesome and super easy to integrate into your project, plus you can add django-filebrowser in easily for image uploading.
django-tinymce is the way to go. You can use pip to install it. You use it on model fields like so:
from tinymce import models as tinymce_models
class Foo(models.Model):
description = tinymce_models.HTMLField(blank=True, null=True, help_text="You can use HTML markup - be careful!")
If you are using South for DB migrations you need to help it out with this line:
add_introspection_rules([], ["^tinymce.models.HTMLField"])
Works like a charm!
Put the tiny_mce.js library somehwere in your media folder. For example in js/tiny_mce/
Then (for django 1.2) you need to create a custom model admin in your_app/admin.py. Add a class Media with js attribute to it. Example:
from django.contrib import admin
from myapp.models import MyModel
class MyModelAdmin(admin.ModelAdmin):
class Media:
js = ('js/tiny_mce/tiny_mce.js',
'js/admin/textareas.js',)
admin.site.register(MyModel, MyModelAdmin)
In media/js/admin/textareas.js you can add your call to tinyMCE.init. Example:
tinyMCE.init({
mode : "textareas",
theme : "advanced"
});
That's it. Javascript is included automatically. No need to overwrite admin templates.
Note: One thing I forget to mention that in this case it only applies to the admin for MyModel. If you need the same functionality for all yout model's, simply register this custom ModelAdmin to them or add Media classes to exising ModelAdmin classes.