Django fontsize tinymce - django

Question

I am trying to use django tinymce in my project but the font is too small. I have googled it and learned I am meant to use content_css but without proper step by step approaches as to how exactly this should be done.
I am wondering if there was another way and if there isn't, could someone give me a simple step by step approach to solving it using the content_css.
Below is the forms.py
class PostForm(forms.ModelForm):
text = forms.CharField(help_text='Enter your Post here', widget=TinyMCE(attrs={'cols': 80, 'rows': 10}))
name = forms.CharField(widget=forms.HiddenInput(), initial='User')
created_on = forms.DateTimeField(widget=forms.HiddenInput(), initial=timezone.now())
class Meta:
model = Post
fields = ('title', 'text',)
{% extends 'blog/base.html' %}
{% load staticfiles %}
{% block body_block %}
<!-- <h1>TinyMCE Quick Start Guide</h1>
<form method='post'>
<textarea id = 'mytextarea'>Hello, World!</textarea>
</form> -->
{% if post %}
<div class="single">
<div class="container">
<div class="col-md-8 single-main">
<div class="single-grid">
<h4>{{ post.title|safe }}</h4>
<img src="{% static 'images/post1.jpg' %}" alt=""/>
<p>{{ post.text|safe }}</p>
</div>
<div class="comments">
<h2><u>Comments</u></h2>
{% if comments %}
{% for comment in comments %}
<h3>~{{ comment.commenter.first_name|title}} {{comment.commenter.last_name|title }}</h3>
<ul>
<li>
{{ comment.text|safe }}
</</li><br>
</ul>
<span class="hidden-xs"style="margin-left:70%;, font-family:Arial">Published: {{ comment.created_on }}</span >
{% if comment.commenter == request.user or user.is_superuser %}
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Delete</button>
{% endif %}
{% endfor %}
{% else %}
No comments available
{% endif %}
</div>
<div class="content-form">
<h3>Leave a comment</h3>
{% if user.is_authenticated %}
<form id="comment_form" action="{% url 'blog:detail' post.slug %}" method="post">
{% csrf_token %}
{% for hidden in form.hidden_fields %}
{{ hidden }}
{% endfor %}
{% for field in form.visible_fields %}
{{ field.errors }}
{{ field }}<br/><br/>
{% endfor %}
<input class="btn btn-primary" type="submit" name="submit" value="submit">
</form>
{% else %}
You must be logged in to comment
{% endif %}
</div>
<ul class="comment-list " >
<h5 class="post-author_head">Written by {{ post.author.first_name|title }} {{ post.author.last_name|title }}</h5>
<li><img src="{% static 'images/avatar.png' %}" class="img-responsive" alt="">
<div class="desc">
<p>View all posts by: {{ post.author.first_name|title }} {{ post.author.last_name|title }}</p>
</div>
<div class="clearfix"></div>
</li>
</ul>
</div>
<div class="col-md-4 side-content">
<div class="recent">
<h3>RECENT POSTS</h3>
{% if recent_posts %}
<ul>
{% for post in recent_posts %}
<li>{{post.title|title }}</li>
{% endfor %}
</ul>
{% else %}
<li>No post has been posted</li>
{% endif %}
</div>
<div class="comments">
<h3>RECENT COMMENTS</h3>
{% if recent_comments %}
<ul>
{% for comment in recent_comments %}
<li>{{comment.commenter|title}} on {{comment.post|title}}</li>
{% endfor %}
</ul>
{% else %}
<li>No comments at the moment</li>
{% endif %}
</div>
<div class="clearfix"></div>
<div class="archives">
<h3>ARCHIVES</h3>
<ul>
<li>October 2013</li>
<li>September 2013</li>
<li>August 2013</li>
<li>July 2013</li>
</ul>
</div>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
</div>
{% if comment.commenter == request.user or user.is_superuser %}
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Delete Post</button>
<button style="margin-left:90%;,line-height: .9;color: red;, font-family:Arial;" type="button" name="button">Edit Post</button>
{% endif %}
{% else %}
asadsh
{% endif %}
{% endblock %}

Answer 1

To add content css files to tinymce, you have to change the tinymce.init object value to include your content_css.
Search for the initialization call in your script and add a line to your object like in this example:
tinymce.init({
...
content_css: [
'//example.com/js/your-css-here.css'
],
...
});
If a content_css part is already present, just add the URL to the array, i.e.
['url 1 here', 'url 2 here', 'your new url here']
In your custom css file, you can now set your desired font size, i.e.
body { font-size: 14px; }