I am trying to create a forum and during development i got stuck at the part where how do users add code blocks to their post with syntax highlighting? just like the one below:
print("Hello world")
Also just like in this forum how do i preview what I’m writing while writing it? also i would want it to be stored in database as codeblocks so that it can be viewed or rendered when a user opens a post.
i have tried django-ckeditor but its not working out how i expected. As i click on code snipet in ckeditor its opening another window and the input field there only works when i reduce my window size and there is no syntax highlighting and i have to choose the language manually.
Is there a better way to do this?
Please ignore if i said something dumb, i’m at a beginer-intermediate level.
Most likely. But, if you want:
Then you need to be looking for a JavaScript solution to handle the editing with a Django solution for rendering it. This means you’ll need to find an encoding of the text that both your JavaScript and Django tools have in common.
One options would be to use one of the Markdown extensions to tag the code (which is what this forum uses). You then need to find a common Markdown parser to handle both the editing and presentation of those blocks.
For example, notice the difference between using " ```text "
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
Using " ```python "
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
and using " ```json "
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
Notice how it’s the same code highlighted three different ways depending upon the language selected. (That’s why you need to select the language manually using ckeditor, the rendering engine needs to know what highlighting to apply.)
And no, I don’t have any specific recommendations here. You could try searching djangopackages.org to try and get some ideas. Maybe someone else here has more detailed information to share.
1 Like
oh! but still when use a code block here i don’t have to choose a language. it detects whether im typing html or python. how?
And i will take a look at django-markdowns. but im still confused as to how i can input codeblocks with backquotes.
It makes assumptions. Probably uses some pattern matching to tell along with maybe some settings. However, it doesn’t always get it right when there’s an overlap such as the dict example above.
What are you confused about?
actually i got it to work. i mean i figured out a way to display the code with highlight.js and markdown.
this is my code:
html:
<div class="newPost">
<div class="preview">
yes this is a new topic created by me.....
<pre><code class="language-python">
for if i am trying to write this function here only the function for a range of values part should have syntax highlighting...
def func();
for i in range(6):
print(i)
</code></pre>
</div>
views.py:
def forum_view(request):
if request.user.is_authenticated:
return render(request, 'forum.html')
else:
messages.error(request, "You need to be logged in to access the forum.")
text = "<h1>this is a test</h1>"
html = md.markdown(text, extensions=['fenced_code'])
return redirect('login',{'html':html})
but in this case i am getting the output as:
here since i typed the normal sentance inside the code tag it highlights the word ‘range’ since its used in python.
this is one place i’m stuck at as if how would i tell it to highlight only the code?
and the second and main one is that how would i get the post as an input from the user? i mean do i get it as normal text with codeblocks in backquotes or is there any better way?
the main confusion is if i get the input as normal text i should figure out a way to display the part of the text with backquotes as codeblocks with syntax highlighting. Or if i can find some way to get the input and save it as a markdown (with text and codeblocks) it would be easy for me to display it as it is…!
please ignore the sentence in the codeblock and output, it does not make sense. i just wanted to see if it will highlight normal texts like ‘range’.
Actually i just noticed something from the codeblocks in my reply, it seems to highlight the words the same way as in my output. But still i will need to figure out a way for django to put those in backquotes inside html code tag and the rest outside it from the whole user input. 
@KenWhitesell FINALLY! One step closer to final result.
I got it to display what ever the user posts perfectly. texts would render as texts and codebolcks would render differently with syntax highlighting.
Here is the result:
Thanks alot for your support.
Im still not done ill have to take input from user as well…
