Admin InterfaceのTextareaを広くする

jQueryを使ってTextareaの高さを自在に変更できると入力しやすく便利です。
適応前は表示範囲は固定されていて見辛いですが、
AdminExtendTextarea01
posted by (C)常山
適応後広げて使ってみると快適です。
AdminExtendTextarea02
posted by (C)常山


変更箇所は1ヶ所のみ。
"/admin/base_site.html"ですが、"MEDIA_ROOT"のディレクトリ直下の"/admin/base_site.html"に追加修正します。

{% block extrahead %}
<style type="text/css">
    div.grippie {
        background:#EEEEEE url({{ MEDIA_URL }}js/textarea_resize/grippie.png) no-repeat scroll center 2px; 
        border-color:#DDDDDD;
        border-style:solid;
        border-width:0pt 1px 1px;
        cursor:s-resize;
        height:9px;
        overflow:hidden;
        margin-left: 106px;
    }
    textarea {
        display:block;
        margin-bottom:0pt;
        width:95%;
        height: 20%;
    }
</style>
<script type="text/javascript" src="{{ MEDIA_URL }}js/jquery.js"></script>
<script type="text/javascript" src="{{ MEDIA_URL }}js/textarea_resize/jquery.textarearesizer.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
         $('textarea:not(.processed)').TextAreaResizer();
	});
</script>
{% endblock %}

たったこれだけで、Textareaの入力が快適になります。


元ネタはExpandable Textareas in Django