Jump to content

Why can't I uncheck the Display Source box when using JavaScript in a code block?

By elderlyman, in Customize with code

Go to solution Solved by paul2009,

Recommended Posts

elderlyman Level 4

elderlyman

Posted
Posted

Site URL: http://bostonbiketaxi.com

When I attempt to write some code in a code block using JavaScript, the Display Source option grays out and prohibits me from checking/unchecking.  So I am effectively prohibited from using JavaScript in a code block.  The option to check/uncheck the Display Source box works as expected when HTML is selected, but not for JavaScript.  What could be happening here?

 

 

1.png

2.png

3.png

Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

elderlyman Level 4

elderlyman

Posted
  • Author
Posted

Thanks @RyanDejaegher.  I should have read the docs further to see that display is always checked for JS.  Though I still don't understand why the Squarespace feature would be designed this way.  Why would there be no option to actually run JavaScript in a code block, only display it?  Yet the HTML can actually run be run or be displayed in a code block? 

Link to comment
  • Solution
paul2009 Level 17

paul2009

Posted
  • Solution
Posted (edited)
16 hours ago, elderlyman said:

Though I still don't understand why the Squarespace feature would be designed this way.  Why would there be no option to actually run JavaScript in a code block, only display it?

A Code Block can be used for two reasons:

  • to display code for others to read (by checking the Display Source option) and,
  • to add HTML to a webpage.

Because web pages are built with HTML, to add functional code, you must first format it as HTML. JavaScript can be added to a web page, but you must select HTML as the code type, and then insert the JavaScript between <script> and </script> tags.

It's the same for CSS. To add it using a Code Block, you must insert it between <style> and </style> tags - although Squarespace has a better solution for CSS.

 

Edited by paul2009

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment
  • 1 month later...
TempusInfernus Level 3

TempusInfernus

Posted
Posted (edited)

You can run javascript in the code block - just make sure you are not still in edit mode. (when you flip to preview mode it runs - for example a widget embed will show up)  I made this mistake struggling for about 2 hours the other day and when I figured it out, I wanted to smash my head into the desk for an equal amount of time. 

Edited by TempusInfernus
expanding

I'm more of a designer than a developer, but I know some HTML, CSS, and Javascript, and PHP, but I would not describe myself as good at any of them. I know just enough to get things to work the way I want with a little help sometimes, even if it takes hours and hours of burning time.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Sign Up / Login
Go to topic listing

News

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources