Viewing Include a Javascript snippet on my page

Include a Javascript snippet on my page



User: Tom V. 3 years ago
Hi guys

I'm looking for a widget, that will allow me to include java script code snippets on my site.

I'm planning on doing some tutorials and I'm wondering if anyone could point me in the right direction?

Thank you heaps in advance!
User: Paul-RAGESW 3 years ago
Hi Tom,

You don't actually need a widget for this.

You can use either the HTML Snippet or enter the code in the Inspector->Page Settings->Header/Footer code.

The way to implement it would depend on what code you want to add though so I can't provide specific advice without seeing what exactly you want to add.

-------------------------------
Paul
EverWeb Developer

Macworld.com ranks EverWeb as the top choice for Mac users wanting to build a website!
User: Tom V. 3 years ago
Hi @Paul-RAGESW
Thank you for your reply by I think you misunderstood my question :) (I didn't explain very well)

I would like to paste a java script snippet into the middle of an article/tutorial for people to copy.

Last edit 3 years ago
User: Roddy 3 years ago
Here's some info about what code goes where in EverWeb.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Tom V. 3 years ago
Hi @Paul-RAGESW
Thank you for your reply by I think you misunderstood my question :)

I would like to paste a java script snippet into the middle of an article/tutorial for people to copy.
User: Roddy 3 years ago
Basically you need to covert the opening and closing brackets of the tags into HTML. Use this Web Page to quickly convert your code.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Paul-RAGESW 3 years ago
On a blog page or a regular page?

If it is just a regular page you can paste the code in a separate text box as regular text.

-------------------------------
Paul
EverWeb Developer

Macworld.com ranks EverWeb as the top choice for Mac users wanting to build a website!
User: Tom V. 3 years ago
Hi @Paul-RAGESW

It's just a regular page, but I was hoping for correct colour coded formatting (e.g. java script) - that's why I was wondering whether there is a plugin for this.

Here is an example of what I'm taking about ...

https://wordpress.org/plugins/codecolorer/

Thanks again for your help :)
User: Roddy 3 years ago
There are a number of scripts for doing what you want. Here's a list of some of them.

I chose to use Rainbow which is very lightweight and has 20 themes.

I made two widgets to test it out - one uses the default dark theme and the other the Github theme.

I added option drop down to choose between CSS, HTML, java script and PHP and some controls for adding a border and changing the font size.

It doesn't add line numbers but then again who wants or needs them.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Tom V. 3 years ago
Hi @Roddy

Awesome, that's exactly what I was looking for - would you make these widgets available for purchase?

PS. LUA option would be awesome too :)
User: Roddy 3 years ago
Quote:
would you make these widgets available for purchase?

I doubt if there would be too many EverWeb users needing a widget like this!

To keep down the "weight" of scripts, the plugin loads a separate JS file for each programming language and a separate stylesheet for each theme. There are 20 themes and 21 language types. This is ideal for those using code injection since they only need to laod the ones required for any given page.

As far as themes are concerned, you need a widget for each theme and you can't mix themes on any single page. Unfortunately, you can't preview them all unless you set up the plugn using code and switch out the stylesheets - very time consuming.

To give a choice of language, a JS file needs to be loaded for each type so a widget needs to contain all the requires JS files - whether they are need or not in a particular situation. It's not a big deal since the files are compact but it does make sense just include the ones you really need. The other option is to make a widget for each language type but this shouldn't be necessary as long as the number is kept low.

So, from the point of view of efficiency, the widget needs to be tailored to suit the situation. Contact me and let me know which languages you need and which theme you would prefer.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Tom V. 3 years ago
Hi @Roddy

Thank you for the explanation, I completely understand.

I only really need

HTML
CSS
java script
Lua

and I love the dark theme + the borders you've used :) (perhaps lua border could be green lol)

PS. How much would you charge for this widget? (since you're not looking at selling it on your site - at least thats what I understood).

Last edit 3 years ago
User: Roddy 3 years ago
I just spent some time adding support for line numbers and then decided to test it out in all browsers. The plugin support is shown HERE but it doesn't work for me in the latest version of Google's Chrome. Presumably it doesn't work in Android either?

I have sent feedback to Google about this but won't hold my breath waiting for an answer. It does work in IE 10 and up, Firefox, Safari and iOS. If you decide to use it, you would need to notify visitors about this bug in Chrome.

The border width and color can be adjusted in the widgets settings. Contact me and I will send you a copy of the widget modified for HTML. CSS, JS and Lua.

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Roddy 3 years ago
I was about to give up on this since Google Chrome is the most popular browser on the planet. I had one last look at the scripts before trashing it and eventually found a clue as to why it's not working in that browser. A couple of quick hacks to defeat the default JS and it now works.

Here's the latest version and note the info about using line numbers

-------------------------------
Roddy

Website: http://everwebwidgets.com
Contact: http://everwebwidgets.com/ewWidgets-home/contact.html
NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own.
User: Tom V. 3 years ago
Hi @Roddy

Awesome, thanks heaps for doing this :) I really appreciate the effort!

I've e-mailed you as per your request, with the details you've asked for.

Thanks again! You rock :)


Post Reply
You must login or signup to post.