The question:
I have a problem with my blog. When you view it on desktop, the page looks fine.
However, if you view the “Customize” page, it looks like this:
And on mobile, the blog looks blank as well. Can you help me?
(Blog: http://atharvnadkarni.com/blog)
The Solutions:
Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.
Method 1
Your mathjax script tag isn’t closed properly:
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/[email protected]/es5/tex-chtml.js">
</head>
<body ... >
This means that the </head>, and the <body> and all of your page content is treated as text inside the <script> tag until you hit the </script> from your document.body.classList.remove("no-js");, and lost. (If you view page source in your browser you should be able to see this: the tags after your MathJax-script tag have no syntax highlighting.)
I don’t know where that <script> tag came from but you should generate add a </script> close tag after it to close it properly.
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/[email protected]/es5/tex-chtml.js"></script>
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0