Jump to content

Archived

This topic is now archived and is closed to further replies.

flourishdesignstudio

Adding Scripts to Specific Pages

Recommended Posts

flourishdesignstudio

Website URL: http://flourishdesignstudio.biz/wordpress1/
Framework Version: 1.1.2
 

I am working on a site where there are 2 pages that need to have scripts. I do not want to put the scripts in the Custom Scripts editor area because I do not want every single page on the site to load the scripts, just the two specific pages. Can you please advise on the best way to accomplish this?

 

I was thinking that if I made two new page templates (one for each page that requires a special script) I could somehow insert the script just for that page and then apply that template to the specific page. I have searched the forums and documentation but cannot find the best way to accomplish this. How can I best accomplish this is DMS?

 

Thank you in advance for your help! It is much appreciated!

 

Share this post


Link to post
Share on other sites
Simon

There is no way to do it in the scripts area, it is not page specific.

 

You will have to use a PHP/WordPress action. Something like this in your child theme functions.php file:

 

https://gist.github.com/Pross/8058421

Share this post


Link to post
Share on other sites
flourishdesignstudio

Hi Simon,

 

Thank you for the help on this. I am currently using a child theme and I used your example above as a base for adding the scripts. Once I save and uploaded the new functions.php the site broke and I had to revert back to a backup of the function.php file.

 

Here is the entire functions.php file document that did not work. I am completely new to javascript so any help would be extremely appreciated! I have inserted my page IDs and pasted the old javascript from another site into the code you see below:

 

<?php


// Load Framework - don't delete this
require_once( dirname(__FILE__) . '/setup.php' );


// Load our shit in a class cause we're awesome
class YourTheme {


function __construct() {


// Constants
$this->url = sprintf('%s', PL_CHILD_URL);
$this->dir = sprintf('/%s', PL_CHILD_DIR);


// Add a filter so we can build a few custom LESS vars
add_filter( 'pless_vars', array(&$this,'custom_less_vars'));


$this->init();
}


function init(){


// Run the theme options
$this->theme_options();


// Send the user to the Theme Config panel after they activate.
add_filter('pl_activate_url', array(&$this,'activation_url'));
}


// Send the user to the Theme Config panel after they activate. Note how link=nb_theme_config is the same name of the array settings. This must match.
function activation_url( $url ){


   $url = home_url() . '?tablink=theme&tabsublink=nb_theme_config';
   return $url;
}


// Custom LESS Vars
function custom_less_vars($less){


// Adding a custom LESS var, use this in LESS as @my-var. In this example, its linked to a custom color picker in options. We also must set a default or else it's going to error.
// pl_hashify must be used with color pickers so that it appends the # symbol to the hex code
// pl_setting is being used because this is a global option used in the theme
$less['my-var']   =  pl_setting('my_custom_color') ? pl_hashify(pl_setting('my_custom_color')) : '#07C';


return $less;
}


    // WELCOME MESSAGE - HTML content for the welcome/intro option field
function welcome(){


ob_start();


?><div style="font-size:12px;line-height:14px;color:#444;"><p><?php _e('You can have some custom text here.','nicks-base-theme');?></p></div><?php


return ob_get_clean();
}


// Theme Options
function theme_options(){


$options = array();


$options['nb_theme_config'] = array(
  'pos'                  => 50,
  'name'                 => __('Nicks Base Theme','nicks-base-theme'),
  'icon'                 => 'icon-rocket',
  'opts'                 => array(
   array(
           'type'        => 'template',
             'title'       => __('Welcome to My Theme','nicks-base-theme'),
             'template'    => $this->welcome()
       ),
       array(
          'type'         => 'color',
          'title'        => __('Sample Color','nicks-base-theme'),
          'key'          => 'my_custom_color',
          'label'        => __('Sample Color','nicks-base-theme'),
          'default'      =>'#FFFFFF'
       ),
  )
);
pl_add_theme_tab($options);
}


add_action( 'wp_head', 'add_my_head_scripts' );
function add_my_head_scripts() {


   $allowed = array( 1201 ); // <= add page ID's here where you want the script.


   // if NOT an allowed page do nothing.
   if( ! is_page( $allowed ) )
       return;


   // now show the script code...
   ?>
   <!--- scripts action from functions.php --->
   <script language="JavaScript">
function round(number,X) {
// rounds number to X decimal places, defaults to 2
X = (!X ? 2 : X);
return Math.round(number*Math.pow(10,X))/Math.pow(10,X);
}
                            
function Calculate_Density(){
var CoreDEP
var CoreWT
var DryMatter
var i


for (i = 0;i < window.document.frmCalculator.radDEPTH.length;i++){
if (window.document.frmCalculator.radDEPTH[i].checked){
break
}
}




if (window.document.frmCalculator.radDEPTH[i].value == "INCHES") {
CoreDEP = Math.floor(window.document.frmCalculator.txtDepth.value)


if ((window.document.frmCalculator.txtDepth.value % 1) < .125) 
CoreDEP = CoreDEP;
else if ( ((window.document.frmCalculator.txtDepth.value % 1) >= .125) && ((window.document.frmCalculator.txtDepth.value % 1) <= .324) )
CoreDEP = CoreDEP + ".25";
else if ( ((window.document.frmCalculator.txtDepth.value % 1) >= .325) && ((window.document.frmCalculator.txtDepth.value % 1) <= .624) )
CoreDEP = CoreDEP + ".5";
else if ( ((window.document.frmCalculator.txtDepth.value % 1) >= .625) && ((window.document.frmCalculator.txtDepth.value % 1) <= .824) )
CoreDEP = CoreDEP + ".75";
else
CoreDEP = CoreDEP;


CoreDEP = (window.document.frmCalculator.txtDepth.value / 12);
}
else if (window.document.frmCalculator.radDEPTH[i].value == "CM") {


CoreDEP = Math.floor(window.document.frmCalculator.txtDepth.value)
if ((window.document.frmCalculator.txtDepth.value % 1) < .25) 
CoreDEP = CoreDEP;
else if ( ((window.document.frmCalculator.txtDepth.value % 1) >= .25) && ((window.document.frmCalculator.txtDepth.value % 1) < .75) )
CoreDEP = CoreDEP + ".5";
else
CoreDEP = CoreDEP;
CoreDEP = ((window.document.frmCalculator.txtDepth.value * .3937) / 12);


}


CoreWT = (window.document.frmCalculator.txtWeight.value * .0022046);
DryMatter = window.document.frmCalculator.txtDryMatter_Percentage.value;


window.document.frmCalculator.txtAsSampled.value = round((CoreWT / (CoreDEP * .0190726)),1)
window.document.frmCalculator.txtDryMatter.value = round((window.document.frmCalculator.txtAsSampled.value * (DryMatter /100)),1)




}


function ChangeCase(){


window.document.frmCalculator.txtFarm.value = window.document.frmCalculator.txtFarm.value.toUpperCase();


}


</script>
   <!--- end scripts action from functions.php --->
   <?php
}


add_action( 'wp_head', 'add_my_head_scripts' );
function add_my_head_scripts() {


   $allowed = array( 1410 ); // <= add page ID's here where you want the script.


   // if NOT an allowed page do nothing.
   if( ! is_page( $allowed ) )
       return;


   // now show the script code...
   ?>
   <!--- scripts action from functions.php --->
   <script language="JavaScript">
function round(number,X) {
// rounds number to X decimal places, defaults to 2
X = (!X ? 2 : X);
return Math.round(number*Math.pow(10,X))/Math.pow(10,X);
}
                            
function Calculate_Density(){
var CoreDEP1
var CoreWT1
var DryMatter1


var CoreDEP2
var CoreWT2
var DryMatter2


var CoreDEP3
var CoreWT3
var DryMatter3


var AsSampled
var DryMatter


var EnteredSites
var i


AsSampled = 0
DryMatter = 0
EnteredSites = 0




if (window.document.frmCalculator.txtDepth1.value.length > 0) {


for (i = 0;i < window.document.frmCalculator.radDEPTH1.length;i++){
if (window.document.frmCalculator.radDEPTH1[i].checked){
break
}
}




if (window.document.frmCalculator.radDEPTH1[i].value == "INCHES") {
CoreDEP1 = Math.floor(window.document.frmCalculator.txtDepth1.value)


if ((window.document.frmCalculator.txtDepth1.value % 1) < .125) 
CoreDEP1 = CoreDEP1;
else if ( ((window.document.frmCalculator.txtDepth1.value % 1) >= .125) && ((window.document.frmCalculator.txtDepth1.value % 1) <= .324) )
CoreDEP1 = CoreDEP1 + ".25";
else if ( ((window.document.frmCalculator.txtDepth1.value % 1) >= .325) && ((window.document.frmCalculator.txtDepth1.value % 1) <= .624) )
CoreDEP1 = CoreDEP1 + ".5";
else if ( ((window.document.frmCalculator.txtDepth1.value % 1) >= .625) && ((window.document.frmCalculator.txtDepth1.value % 1) <= .824) )
CoreDEP1 = CoreDEP1 + ".75";
else
CoreDEP1 = CoreDEP1;


CoreDEP1 = (window.document.frmCalculator.txtDepth1.value / 12);
}
else if (window.document.frmCalculator.radDEPTH1[i].value == "CM") {


CoreDEP1 = Math.floor(window.document.frmCalculator.txtDepth1.value)
if ((window.document.frmCalculator.txtDepth1.value % 1) < .25) 
CoreDEP1 = CoreDEP1;
else if ( ((window.document.frmCalculator.txtDepth1.value % 1) >= .25) && ((window.document.frmCalculator.txtDepth1.value % 1) < .75) )
CoreDEP1 = CoreDEP1 + ".5";
else
CoreDEP1 = CoreDEP1;
CoreDEP1 = ((window.document.frmCalculator.txtDepth1.value * .3937) / 12);


}


CoreWT1 = (window.document.frmCalculator.txtWeight1.value * .0022046);
DryMatter1 = window.document.frmCalculator.txtDryMatter_Percentage1.value;


AsSampled += (CoreWT1 / (CoreDEP1 * .0190726))
DryMatter += ((CoreWT1 / (CoreDEP1 * .0190726)) * (DryMatter1/100))
EnteredSites++;


window.document.frmCalculator.txtAsSampled1.value = round((CoreWT1 / (CoreDEP1 * .0190726)),1)
window.document.frmCalculator.txtDryMatter1.value = round(((CoreWT1 / (CoreDEP1 * .0190726)) * (DryMatter1/100)),1)


}


if (window.document.frmCalculator.txtDepth2.value.length > 0) {


for (i = 0;i < window.document.frmCalculator.radDEPTH2.length;i++){
if (window.document.frmCalculator.radDEPTH2[i].checked){
break
}
}




if (window.document.frmCalculator.radDEPTH2[i].value == "INCHES") {
CoreDEP2 = Math.floor(window.document.frmCalculator.txtDepth2.value)


if ((window.document.frmCalculator.txtDepth2.value % 1) < .125) 
CoreDEP2 = CoreDEP2;
else if ( ((window.document.frmCalculator.txtDepth2.value % 1) >= .125) && ((window.document.frmCalculator.txtDepth2.value % 1) <= .324) )
CoreDEP2 = CoreDEP2 + ".25";
else if ( ((window.document.frmCalculator.txtDepth2.value % 1) >= .325) && ((window.document.frmCalculator.txtDepth2.value % 1) <= .624) )
CoreDEP2 = CoreDEP2 + ".5";
else if ( ((window.document.frmCalculator.txtDepth2.value % 1) >= .625) && ((window.document.frmCalculator.txtDepth2.value % 1) <= .824) )
CoreDEP2 = CoreDEP2 + ".75";
else
CoreDEP2 = CoreDEP2;


CoreDEP2 = (window.document.frmCalculator.txtDepth2.value / 12);
}
else if (window.document.frmCalculator.radDEPTH2[i].value == "CM") {


CoreDEP = Math.floor(window.document.frmCalculator.txtDepth2.value)
if ((window.document.frmCalculator.txtDepth2.value % 1) < .25) 
CoreDEP2 = CoreDEP2;
else if ( ((window.document.frmCalculator.txtDepth2.value % 1) >= .25) && ((window.document.frmCalculator.txtDepth2.value % 1) < .75) )
CoreDEP2 = CoreDEP2 + ".5";
else
CoreDEP2 = CoreDEP2;
CoreDEP2 = ((window.document.frmCalculator.txtDepth2.value * .3937) / 12);


}


CoreWT2 = (window.document.frmCalculator.txtWeight2.value * .0022046);
DryMatter2 = window.document.frmCalculator.txtDryMatter_Percentage2.value;


AsSampled += (CoreWT2 / (CoreDEP2 * .0190726))
DryMatter += ((CoreWT2 / (CoreDEP2 * .0190726)) * (DryMatter2/100))
EnteredSites++;


window.document.frmCalculator.txtAsSampled2.value = round((CoreWT2 / (CoreDEP2 * .0190726)),1)
window.document.frmCalculator.txtDryMatter2.value = round(((CoreWT2 / (CoreDEP2 * .0190726)) * (DryMatter2/100)),1)


}


if (window.document.frmCalculator.txtDepth3.value.length > 0) {


for (i = 0;i < window.document.frmCalculator.radDEPTH3.length;i++){
if (window.document.frmCalculator.radDEPTH3[i].checked){
break
}
}




if (window.document.frmCalculator.radDEPTH3[i].value == "INCHES") {
CoreDEP3 = Math.floor(window.document.frmCalculator.txtDepth3.value)


if ((window.document.frmCalculator.txtDepth3.value % 1) < .125) 
CoreDEP3 = CoreDEP3;
else if ( ((window.document.frmCalculator.txtDepth3.value % 1) >= .125) && ((window.document.frmCalculator.txtDepth3.value % 1) <= .324) )
CoreDEP3 = CoreDEP3 + ".25";
else if ( ((window.document.frmCalculator.txtDepth3.value % 1) >= .325) && ((window.document.frmCalculator.txtDepth3.value % 1) <= .624) )
CoreDEP3 = CoreDEP3 + ".5";
else if ( ((window.document.frmCalculator.txtDepth3.value % 1) >= .625) && ((window.document.frmCalculator.txtDepth3.value % 1) <= .824) )
CoreDEP3 = CoreDEP3 + ".75";
else
CoreDEP3 = CoreDEP3;


CoreDEP3 = (window.document.frmCalculator.txtDepth3.value / 12);
}
else if (window.document.frmCalculator.radDEPTH3[i].value == "CM") {


CoreDEP = Math.floor(window.document.frmCalculator.txtDepth3.value)
if ((window.document.frmCalculator.txtDepth3.value % 1) < .25) 
CoreDEP3 = CoreDEP3;
else if ( ((window.document.frmCalculator.txtDepth3.value % 1) >= .25) && ((window.document.frmCalculator.txtDepth3.value % 1) < .75) )
CoreDEP3 = CoreDEP3 + ".5";
else
CoreDEP3 = CoreDEP3;
CoreDEP3 = ((window.document.frmCalculator.txtDepth3.value * .3937) / 12);


}


CoreWT3 = (window.document.frmCalculator.txtWeight3.value * .0022046);
DryMatter3 = window.document.frmCalculator.txtDryMatter_Percentage3.value;


AsSampled += (CoreWT3 / (CoreDEP3 * .0190726))
DryMatter += ((CoreWT3 / (CoreDEP3 * .0190726)) * (DryMatter3/100))
EnteredSites++;


window.document.frmCalculator.txtAsSampled3.value = round((CoreWT3 / (CoreDEP3 * .0190726)),1)
window.document.frmCalculator.txtDryMatter3.value = round(((CoreWT3 / (CoreDEP3 * .0190726)) * (DryMatter3/100)),1)


}
window.document.frmCalculator.txtAsSampled.value = round((AsSampled / EnteredSites),1)
window.document.frmCalculator.txtDryMatter.value = round((DryMatter / EnteredSites),1)




}


function ChangeCase(){


window.document.frmCalculator.txtFarm.value = window.document.frmCalculator.txtFarm.value.toUpperCase();


}
</script>
   <!--- end scripts action from functions.php --->
   <?php
}


}
new YourTheme;

Share this post


Link to post
Share on other sites
flourishdesignstudio

Simon_P Hm, I am still having a problem and when I use the code that you provided I get this error Message:

 

Parse error: syntax error, unexpected T_STRING, expecting T_FUNCTION in /homepages/27/d225986320/htdocs/wordpress1/wp-content/themes/CBRE-Theme/functions.phpon line 85

 

Line 85 has this part of the code: 

add_action( 'wp_head', 'add_my_head_scripts' );

 

Is there any chance you could double check and see if you/I left something out? I am completely new to JS and adding actions to a functions.php file so I am not really sure what the problem is or what I should be looking for.

 

Thank you in advance for all your help!

Share this post


Link to post
Share on other sites
Simon
Can you paste your code to somewhere where its readable. Like the pastebin link at the top of the forum.

Share this post


Link to post
Share on other sites
flourishdesignstudio

Here is the Paste Bin: http://forum.pagelines.com/pst/p/9-suydqx/

 

The line numbers are slightly different here so now the part that is having a problem is farther down, line 107. Mighty the problem be something with the php tags?

 

Thank you!

Share this post


Link to post
Share on other sites
Simon
Ok problem there is..

1. you are in a php class you have to paste code into functions.
2. you have 2 functions by the same name.

https://gist.github.com/Pross/8340210

This is better code, untested mind you.

Share this post


Link to post
Share on other sites
flourishdesignstudio

Thanks Simon_P!

 

I have changed the name of the two functions since I need one function to insert JS on one page and a second function to insert different JS on the second page. I think the following code does not solve problem #1 that you mentioned - the php class issue. Can you please advise?

 

I greatly appreciate your help with this!

 

http://forum.pagelines.com/pst/p/10-cramfe/

Share this post


Link to post
Share on other sites
Simon
the code i posted will add the js to two pages

$allowed = array( 1201, 1410 ); // <= add page ID's here where you want the script.

you can add a 1000 pages to that array if you want

Share this post


Link to post
Share on other sites
flourishdesignstudio

But each pages needs a different script to be added. There are two calculators - one for single samples and one for multiple samples. Each page uses a different script to run the specific calulator. The two scripts are different from one another so I need to specify which script goes to which page.

 

Would a live link be helpful for you to look at? Clearly the calculators are not currently working since the scripts are not up but it might help to see it?

 

Thanks!

Share this post


Link to post
Share on other sites
Simon
oh right, there was so much javascript i couldnt see any difference.

Share this post


Link to post
Share on other sites
Simon
Right if your going to use this code:

you have to move the add_action lines you added into the __construct() function and add $this because you are using a class, look at my example.

Share this post


Link to post
Share on other sites
flourishdesignstudio

I adjusted the code to match yours. For the sake of simplictiy I will only post the 'Single' JS here. Once we get this to work I think it will probably be easy to then add in the second "Multiple" JS. Here is the resulting PHP:

 

http://forum.pagelines.com/pst/rw/11-my0xwm/

 

So, that works but it then somehow messes up all the php after the script to that I get the following error at the top of my  page:

 

//END ANNAS CODE // Constants $this->url = sprintf('%s', PL_CHILD_URL); $this->dir = sprintf('/%s', PL_CHILD_DIR); // Add a filter so we can build a few custom LESS vars add_filter( 'pless_vars', array(&$this,'custom_less_vars')); $this->init(); } function init(){ // Run the theme options $this->theme_options(); // Send the user to the Theme Config panel after they activate. add_filter('pl_activate_url', array(&$this,'activation_url')); } // Send the user to the Theme Config panel after they activate. Note how link=nb_theme_config is the same name of the array settings. This must match. function activation_url( $url ){ $url = home_url() . '?tablink=theme&tabsublink=nb_theme_config'; return $url; }

 

Here is a screenshot:

Screen-Shot-2014-01-09-at-5.40.00-PM.png

 

Thank you for all your help! I really appreciate your time and effort!

Share this post


Link to post
Share on other sites
Simon
heres a simple version
https://gist.github.com/Pross/8340210

Share this post


Link to post
Share on other sites
flourishdesignstudio

Thanks Simon_P!

 

That worked perfectly! I greatly appreciate you taking the time to help me solve this! I am so grateful for the forum and all those who help make it the valuable resource that it is!

Share this post


Link to post
Share on other sites

  • Similar Content

    • IDdigital
      By IDdigital+
      Hi,
      A site of ours irregularly does not finish loading. The page in question is https://rw360.org/grievance-process/
      In Safari, I'll occasionally get the following error:
      [Error] TypeError: undefined is not an object (evaluating 'a.plModel.init')
          (anonymous function) (site.js:5:91)
          i (jquery.js:2:27455)
          add (jquery.js:2:27750)
          ready (jquery.js:2:29819)
          (anonymous function) (site.js:5)
          Global Code (site.js:5:3421)
      This seems to be a bug in PageLines as far as I can tell. Any suggestions or a fix coming?
      Thanks,
    • Michael Kummer
      By Michael Kummer+
      Hi guys!
      I am using a plugin called Speed Booster Pack to speed up the load time of michaelkummer.com. One of the plugin settings, Minimize HTML and JavaScript causes an error that I only get with Pagelines. With other themes, such as WordPress' Twenty Seventeen, I do not get that error.
      I have reproduced the problem on my staging site and if you look at the JavaScript console, you will see the following error:
      SyntaxError: Unexpected end of script
      Any clue what PageLines may be doing differently to be contributing to this issue? I contacted the plugin developer and they, of course, pointed me to the theme developer
      Thanks
      Michael
    • flourishdesignstudio
      By flourishdesignstudio+
      Hello,
      We are working on a site and the customers are complaining that the site loads too slowly. They contacted their host who mentioned that the Java Script is all loading at the beginning. Is it possible to delay the load of the less important Java Script until after the initial load to speed up the site? The goal is to load the page faster by minimizing the initial javascript calls.
      Are there any preferred plugins that you would recommend or does this end up causing excessive problems with plugins, etc.?
      Thanks for the help!
    • chamois_blanc
      By chamois_blanc+
      I am trying to clone a container on a page. It throws the following javascript error:
      function l(b, c, e, f) { var g = m.a.f.get(b, p); if (!c) { if (g) throw Error("You cannot apply bindings multiple times to the same element."); m.a.f.set(b, p, !0) } I would appreciate guidance and a fix. Thank you
    • Jeremiah
      By Jeremiah+
      Error: editing.js?ver=930684:5 Uncaught TypeError: Cannot read property 'getData' of undefined
      I have all of the plugins disabled and I still receive the error.
      Page Editor will not load on page.
       
×