WYSIWYG Editor(Editor HTML) no admin Django
Olá pessoal, Olha eu aqui denovo depois de muito tempo!!! Hoje eu vou falar de uma integração muito interessante para o admin do Django, é o uso do WYSIWYG(What you see is what you get) Editor chamado tinyMCE, que nada mais é um editor rich text, esta dica é muito interessante caso você queira fazer algum um tipo de CMS só usando o admin do django.
Segue os passos:
[js]
tinyMCE.init({
lang:'pt-br', //Para que funcione a tradução do tinyMCE você deve baixar o pacote em http://tinymce.moxiecode.com/language.php e descompactar os arquivos dentro da pasta ../tinyMCE
mode : "textareas",
theme : "advanced",
height : "400",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_buttons1 : "fullscreen,separator,preview
,separator,bold,italic,underline,strikethrough,separator,bullist,numlist,outdent,indent,separator,undo,redo,separator,link,unlink,anchor,separator,image,cleanup,help,separator,code",
theme_advanced_buttons2 : "removeformat,styleselect,formatselect,fontselect,fontsizeselect,separator,bullist,numlist,outdent,indent,separator,link,unlink,anchor",
theme_advanced_buttons3 : "sub,sup,separator,image,insertdate,inserttime,separator,tablecontrols,separator,hr,advhr,visualaid,separator,charmap,emotions,iespell,flash,separator,print",
//theme_advanced_buttons2 : "",
//theme_advanced_buttons3 : "",
auto_cleanup_word : true,
plugins : "table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,zoom,flash,searchreplace,print,contextmenu,fullscreen",
plugin_insertdate_dateFormat : "%d/%m/%Y",
plugin_insertdate_timeFormat : "%H:%M:%S",
extended_valid_elements : "a[name|href|target=_blank|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
fullscreen_settings : {
theme_advanced_path_location : "top",
theme_advanced_buttons1 : "fullscreen,separator,preview,separator,cut,copy,paste,separator,undo,redo,separator,search,replace,separator,code,separator,cleanup,separator,bold,italic,underline,strikethrough,separator,forecolor,backcolor,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,help",
theme_advanced_buttons2 : "removeformat,styleselect,formatselect,fontselect,fontsizeselect,separator,bullist,numlist,outdent,indent,separator,link,unlink,anchor",
theme_advanced_buttons3 : "sub,sup,separator,image,insertdate,inserttime,separator,tablecontrols,separator,hr,advhr,visualaid,separator,charmap,emotions,iespell,flash,separator,print"
}
});
[/js]
[python]
class Content(models.Model):
content = models.TextField(blank=True)
creator = models.ForeignKey(User)
date_creation = models.DateTimeField(auto_now_add=True)
session = models.OneToOneField(Session)
def __str__(self):
return self.content[0:30]
class Admin:
pass
# Esta trecho será responsável pela integração do admin com tinyMCE
js = (
'/media/tiny_mce/tiny_mce.js', #Eu joguei a pasta tiny_mce para a pasta media() do meu projeto eu poderia ter jogado pra "media/js"
'/media/js/textarea.js', #Arquivo que formata o editor
)
[/python]
Pronto pessoal seu admin ja está hábil para a inserção de conteúdo rich-text, essa integração do tinyMCE é muito proveitosa mesmo. Pessoal por hoje é só isso mesmo, até o próximo post.
3 Comentário para “WYSIWYG Editor(Editor HTML) no admin Django”
Deixe um comentário |


Caramba legal dá até pra montar um bloco de notas online com o django utilizando essa tua dica Ricardo. =) Flw, muito bom o post!
Rs, acho muito bacana ter um rich-text no admin.
Já havia tentado através de um outro “tuto” sou noob em django, comecei a usa-lo a pouco.
Fiz tudo certinho, no fonte do admin aparecem os js, mas nada em meus textareas, alguma dica?
Abraços
Érico
Faça parte da campanha: ajude um noob rs