Javascript for one static page only ?

[jeronath]

I need to install JavaScript code on my website to be able to call a newsletter signup form. I know I could use the HTML Code plugin, but since this form will only be present on one page of my site, I'd like to know if someone has a trick to integrate this JavaScript into this single page only, so as not to slow down the loading of other pages... Thanks in advance for your help.

[arfa]

Hi jeronath,
I am not sure how extensive the code is but you could use my https://plugins.bludit.com/plugin/addcode2page

It creates a shortcode that can be added to a single page.
You say "call a newsletter signup form" — I don't know the extent of the code but I wonder why not just insert the form code directly?

[jeronath]

Hi arfa !
Thank you for your response!
I think your plugin can meet my needs, but unfortunately I have no PHP skills - I only know a little HTML and CSS, and I really don't see how to use it.

Here are more details about my technical issue.
I need to put the following code in the page:

Code: Select all

<div style="text-align: left" class="sender-form-field" data-sender-form-id="epYV6y"></div> 

and the following JavaScript code in the page head:

Code: Select all

<script> (function (s, e, n, d, er) { s['Sender'] = er; s[er] = s[er] || function () { (s[er].q = s[er].q || []).push(arguments) }, s[er].l = 1 * new Date(); var a = e.createElement(n), m = e.getElementsByTagName(n); a.async = 1; a.src = d; m.parentNode.insertBefore(a, m) })(window, document, 'script', 'https://cdn.sender.net/accounts_resources/universal.js', 'sender'); sender('6d34e034373723') </script>

This will display a form on the page, containing 3 fields: name, first name, email, and a "Submit" button that allows visitors to subscribe to the newsletter.
If you can help me, that would be wonderful. Thank you in advance!

[arfa]

Hi j.,
Assuming you have the plugin installed...
Go to 'build'
give your snippet a name
paste in:

Code: Select all

<?php 
// the variable $snipData has already been declared
// you need to extent it... $snipData .= 'your code/text'
// this entire textarea, including php tags, is saved in: ./codes/your_snipName.php
// be sure to retain opening and closing php tags

$snipData .= "<script> (function (s, e, n, d, er) { s['Sender'] = er; s[er] = s[er] || function () { (s[er].q = s[er].q || []).push(arguments) }, s[er].l = 1 * new Date(); var a = e.createElement(n), m = e.getElementsByTagName(n); a.async = 1; a.src = d; m.parentNode.insertBefore(a, m) })(window, document, 'script', 'https://cdn.sender.net/accounts_resources/universal.js', 'sender'); sender('6d34e034373723') </script>";

$snipData .= '<div style="text-align: left" class="sender-form-field" data-sender-form-id="epYV6y"></div>';
 ?>
 

Note the double quotes on the first $snipData declaration – to retain your single quotes. It shouldn't make any difference.

Save the snippet.
Back to 'Useage' and your snip should be there: [% snip=yourSnipName %]
copy and paste this into your page; it may carry some formatting so pasting in code mode is better.
Save and load the page.

As to code skills... they extend with practice. I am still waiting on mine
Let me know how this works.

cheers — kusalo

[jeronath]

Hello arfa and thank you for your help,
I tested the code following your instructions and here are the results. Unfortunately it doesn't work.
But if I keep the javascript code in the CodeHtml plugin, your plugin with your complete code and the line calling your snippet in my page, then it works.
When examining your code, I have a question, although I'm really not competent in php: you give two successive values to the variable $snipData, first the javascript code then the <div> . But it only works if I keep the javascript in the CodeHtml plugin, this makes me think that your plugin only keeps the second value of the variable.
I don't know if this gives a clue for resolution, but if you have time for a second try, that would be great!
Thank you in advance!

[arfa]

Hi Jeronath,
Great that you got it working.

Two items come to mind in reply...

keep the javascript code in the CodeHtml plugin

I am not sure what this means. I wonder if you nested the entire code in one declaration of $snipData

As to the "successive values to the variable $snipData"
the .= is php concatenation, it adds to the variable sequentially.
$snipData .= 'have';
$snipData .= 'a';
$snipData .= 'happy';
$snipData .= 'day';
saved as a snippet would write "have a happy day" to the page.

Javascript uses +