Django adding tiny-mce - django

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.

Related

Is there a django admin widget that allows the admin to sort model objects by fields values?

I am building an app in Django.
I found there is a very easy way to integrate a widget into django admin that allows the admin to filter model objects by fields values. That is achieved by including the line
list_filter = ['field_to_filter_by_its_values']
into the class mymodelAdmin(ImportExportModelAdmin) in admin.py, as shown below
class target_area_history_dataAdmin(ImportExportModelAdmin):
resource_class = target_area_history_dataResource
list_filter = ['Target_area_input_data__Name']
admin.site.register(target_area_history_data, target_area_history_dataAdmin)
Now, instead of integrate a widget to filter my model objects by that field, is there a way to integrate a widget to sort my model objects by that field?
Note: I am using Django Import-Export in my model.
I'll suggest you use django-treebeard. This allows you to view tree nodes hierarchically in the administration interface, with interface features dependent upon the tree algorithm used.
# admin.py
from django.contrib import admin
from treebeard.admin import TreeAdmin
from .models import Category
class CategoryAdmin(TreeAdmin):
list_display = ("title", "created", "modified",)
list_filter = ("created",)
admin.site.register(Category, CategoryAdmin)
What's cool about this is that you can not only sort (by clicking the header row) but also drag things around, as shown in this image.
I recommend you using the grapelli admin interface that allows what you need and a bit more. here you have the grapelli project page and the https://github.com/sehmaschine/django-grappelli.
It's a well documented package and is plug and play for what you need. It also gives a fresh face to Django Admin and is compatible with Django import/export package.

Django Admin - customize use jquery inside and custom fields

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

How to override a Django reusable app's model?

I've installed a django reusable app (Django-Userena) and would like to overwrite the given models.py file.
I have created an app named 'accounts' that calls from Django-Userena. In my 'accounts' app, I have this models.py file that has a class MyProfile that inherits from Django-Userena class UserenaBaseProfile - class MyProfile(UserenaBaseProfile)
In the UserenaBaseProfile class, there is the following code:
privacy = models.CharField(_('privacy'),
max_length=15,
choices=PRIVACY_CHOICES,
default=userena_settings.USERENA_DEFAULT_PRIVACY,
help_text = _('Designates who can view your profile.'))
I would like to extend privacy with an extra value with 'editable=False,' as I do not want this field to be displayed in the auto-generated form.
I tried several ways like calling privacy again in the MyProfile inherited model with the new settings but I am only made aware of Django's "Field name "hiding" is not permitted" (https://docs.djangoproject.com/en/1.4/topics/db/models/#field-name-hiding-is-not-permitted)
My current solution is to simply include the whole UserenaBaseProfile class in my 'accounts' app models.py before calling class MyProfile(UserenaBaseProfile) below.
This does not look like an elegant solution to me. How do you guys go about overriding the models.py file in the reusable app?
Thank you very much.
In my opinion it could be done in two ways:
Make a fork of Django-Userena with your modified model and you use yours.
Make a wrapper of Django-Userena with your models.py and use your wrapper app.
For the urls.py/views.py you could just put:
#Your wrapper views:
from django-userena.views import *
#your wrapper urls:
from django-userena.urls import *
Here are your models:
#your MODIFIED model:
from django-userena.models import *
# then put you new UserenaBaseProfile
class UserenaBaseProfile(models.Model):
#copy the model fields
...
privacy = models.CharField(_('privacy'),
max_length=15,
choices=PRIVACY_CHOICES,
default=userena_settings.USERENA_DEFAULT_PRIVACY,
help_text = _('Designates who can view your profile.'))
Then you could use your custom app in your project.
If you want to customise templates, create a templates directory in your project and put there your modified template files keeping their original names, so the django template-loader could find yours first (it depends how template-loaders have been configured in your settings.py)

Django admin multiple photo upload

I have to create a blog posting system and I need to make it possible to upload multiple photos in Django Admin and select it via Django TinyMCE. One of the solutions is Filebrowser, but I have already spent a few days and haven't got it worked. Are there any alternatives?
I'm trying to do something similar, but not with Tinymce, I choose wmd.
I created two models, one for the blog post, and one for the images, and in the admin interface I included the images as inlines. here's some example.
in your model.py file:
class Project(models.Model):
...
#TinyMce field.
description = models.TextField()
class ProjectImage(models.Model):
image = models.ImageField(upload_to='prjimages/%Y/%m/%d/%H/%M/%S/')
project = models.ForeignKey(Project)
than in your admin.py file, you can have the PostImage as inline.
from django.contrib import admin
from models import *
class ProjectImageAdmin(admin.ModelAdmin):
pass
class ProjectImageInline(admin.StackedInline):
model = ProjectImage
max_num=10
extra=0
class ProjectAdmin(admin.ModelAdmin):
inlines = [ProjectImageInline,]
admin.site.register(ProjectImage, ProjectImageAdmin)
admin.site.register(Project, ProjectAdmin)
you can change the ImageField Widget to show the url, and maybe a preview for each image (I have no example code for this at the moment). And if the user want to include the image in the post, he can just copy paste the url to Tinymce.
It's not a complete solution, but maybe you can extend it with some work to fit your needs.
You should take look at Dropzone.js which you can easily drag and drop multiple images to admin page.

Django grappelli adding custom js to change_form

I try to add my custom javascript to some change_form templates.
Before having installed Grappelli, I could do that by extending
change_form.html of admin and creating sub folders under the templates
with my module names.
For example my tree hireachy was like :
+templates
++admin_copies
+++change_form.html (I have added extra js blocks)
++admin
+++employer
++++employer
+++++change_form.html
++++employer_new
+++++change_form.html
As you understand I have a model named "Employer". I can add my custom
js methods under the change_form.html files.
However, this kind of inheritance cause javascript/breadcrumbs
problems with Grappelli.
How can I add simply my custom javascript functions for each model
separetly ?
Create a subclass of ModelAdmin, and define the custom js in its Media class.
admin.py, in the same folder as the models.py that has Employer:
from django.contrib import admin
from models import Employer
class EmployerAdmin(admin.ModelAdmin):
class Media:
js = ("js/custom.js",) # This paths are appended to your MEDIA_URL setting
admin.site.register(Employer, EmployerAdmin)
Read more here