Posts

Blogger Tip: JavaScript Import Error - "Attribute name "async" associated with an element type “script” must be followed by the ‘ = ‘ character." - This error also occurs for "defer".

Does this error look familiar? If so, I have the fix!

Error parsing XML, line 9, column 16: Attribute name "async" associated with an element type "script" must be followed by the ' = ' character.


This blog is built using Blogger. On the left side of the blog, you'll notice the LinkedIn Badge for my LinkedIn profile.

This was pretty easy to add to the site, but I did run into a problem. Part of the setup process required me to add a new JavaScript import to the Blogger template. The JavaScript import statement was provided by LinkedIn and was easily copied and pasted into the <head> tag of the Blogger template. After clicking "Save theme" the error shown at the top of this post appeared.

After a little bit of research, the import tag was very easily fixed.

Before: 
<script async defer src='//platform.linkedin.com/badges/js/profile.js' type='text/javascript'/>

After: 
<script async='async' defer='defer' src='//platform.linkedin.com/badges/js/profile.js' type='text/javascript'/>

As you can see, I changed async to async='async'. I also changed defer to defer='defer'.
This small change fixes the error and allows the JavaScript file to be imported without issue!

Was this helpful or have you run into other issues working with Blogger? Let me know in the comments below!
Post a Comment
Read more

Prism.js - Style your blog's code!

One of the first things I needed to tackle when setting up this blog was syntax highlighting. I knew I would be posting code samples and I needed them to be easy to read and consume. After a little looking around, I was able to find a very simple to use JavaScript/CSS implementation that will do syntax highlighting for me on the blog. Thanks Prism! Here is an example! var s = 'this is a string'; var obj = { name: 'Adam', age: 99, birthdate: new Date('1/1/1915') }; This was really easy to implement. It took 4 steps. Customize and download prism.js and prism.css from their website. (This is insanely easy to do.)  Upload the javascript and css files to the website.  Include the javascript and css files on the website.  Wrap the code I want highlighted in tags.  If you are not interested in customizing your own or don't want to host your own files, you can use a CDN. This site uses the following links for the prism JS and CSS. <link hr...
1 comment
Read more