# Eliminating Render-blocking resources?

**URL:** <https://community.hubspot.com/t/eliminating-render-blocking-resources/19668>\
**Category:** CMS Development\
**Created:** [March 26, 2020, 8:22pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668 "2020-03-26T20:22:46Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![dchambers](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/dchambers/32/44643_2.png) [@dchambers](https://community.hubspot.com/u/dchambers)\
**Post date:** [March 26, 2020, 8:22pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/1 "2020-03-26T20:22:46Z")

</div>

Deleted

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [March 27, 2020, 12:55pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/2 "2020-03-27T12:55:34Z")

</div>

@dchambers in your HubSpot site settings you can move all the code that’s in the Site Header HTML section to the Site Footer HTML section. You should also make sure the “Load jQuery in the footer” toggle switch is turned on.

---

<div class="post-metadata">

**Author:** ![kyle4](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kyle4/32/7115_2.png) [@kyle4](https://community.hubspot.com/u/kyle4)\
**Post date:** [September 25, 2020, 4:41pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/3 "2020-09-25T16:41:09Z")

</div>

Hi Stefan,

When I do this for my website, the menu no longer shows up on mobile.

Any I ideas what could be causing this?

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [September 25, 2020, 4:44pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/4 "2020-09-25T16:44:47Z")

</div>

@kyle4 it’s most likely because your mobile menu is being created with a jquery script that’s trying to run before jquery is loaded. When you move jQuery to the footer you should also make sure all your javascript is using the **require\_js** functions so it gets loaded in the proper order.

For example, if your mobile script is inline in your header, you should wrap it like so:

```lia-code-sample
{% require_js %}
<script>
// the mobile nav script
</script>
{% end_require_js %}

```

This will force it to load in the footer below jQuery and it will work again.

---

<div class="post-metadata">

**Author:** ![kyle4](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kyle4/32/7115_2.png) [@kyle4](https://community.hubspot.com/u/kyle4)\
**Post date:** [September 25, 2020, 4:57pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/5 "2020-09-25T16:57:23Z")

</div>

Thank you for such a fast reply. I will try this now and post and update with how I make out. Thanks

---

<div class="post-metadata">

**Author:** ![kyle4](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kyle4/32/7115_2.png) [@kyle4](https://community.hubspot.com/u/kyle4)\
**Post date:** [September 25, 2020, 5:06pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/6 "2020-09-25T17:06:56Z")

</div>

Hi Stefan,

I was unable to get it to work. This is likely an error on my end. Is there anything glaringly wrong with the why I implemented the require\_js

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [September 25, 2020, 5:10pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/7 "2020-09-25T17:10:12Z")

</div>

If that’s an inline script you need to enclose it with the script tag. e.g.:

```lia-code-sample
{% require_js %}
<script>
function myfunctionsHere(){
// my function statements
}
myfunctionsHere();
</script>
{% end_require_js %}

```

If that’s an external js file, you should reference that file using the following syntax:

`{{ require_js('https://example.com/main.js') }}`

---

<div class="post-metadata">

**Author:** ![kyle4](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kyle4/32/7115_2.png) [@kyle4](https://community.hubspot.com/u/kyle4)\
**Post date:** [September 25, 2020, 5:22pm UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/8 "2020-09-25T17:22:48Z")

</div>

Hi Stefan,

This is an external JS file. Where is it that I should reference it? Sorry if this is a noob question.

---

<div class="post-metadata">

**Author:** ![ROverson](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/roverson/32/79644_2.png) [@ROverson](https://community.hubspot.com/u/ROverson)\
**Post date:** [May 21, 2021, 8:11am UTC](https://community.hubspot.com/t/eliminating-render-blocking-resources/19668/9 "2021-05-21T08:11:23Z")

</div>

Did you find a solution to this @kyle4 @stefen ?