Comments (15)
@fidoboy to inject javascript (and css) programitically into a (v3) form created with the visual form builder you can use the givewp_donation_form_enqueue_scripts
action and the native WordPress wp_enqueue
functions, example:
add_action('givewp_donation_form_enqueue_scripts', function() {
wp_enqueue_script();
wp_enqueue_style();
});
from givewp.
Hey @fidoboy, with 3.0 you can add custom CSS to your form right in the Visual Form Builder. While in Design Mode you can view changes in real time and have access to a "Custom Styles" setting.
from givewp.
@fidoboy to inject javascript (and css) programitically into a (v3) form created with the visual form builder you can use the
givewp_donation_form_enqueue_scripts
action and the native WordPresswp_enqueue
functions, example:add_action('givewp_donation_form_enqueue_scripts', function() { wp_enqueue_script(); wp_enqueue_style(); });
Thanks a lot. I'll try and report back if it works.
from givewp.
@fidoboy to inject javascript (and css) programitically into a (v3) form created with the visual form builder you can use the
givewp_donation_form_enqueue_scripts
action and the native WordPresswp_enqueue
functions, example:add_action('givewp_donation_form_enqueue_scripts', function() { wp_enqueue_script(); wp_enqueue_style(); });
It doesn't seems to work. I'm doing this into functions.php
add_action('givewp_donation_form_enqueue_scripts', function() { wp_add_inline_script( 'give_custom', 'console.log( "TESTING FUNCTION" ); ' ); });
I've looked at console and there is nothing. Also into the page source code. It doesn't work at all. I'm using an iFrame to display the form
from givewp.
@fidoboy In order to use wp_add_inline_script
- you would need to hook into an already registered script. I would not recommend hooking into an existing givewp script at this time, however you could register your own script using wp_enqueue_script()
and then use wp_add_inline_script
using the registered script name.
Example:
add_action("givewp_donation_form_enqueue_scripts", function(){
wp_enqueue_script('fidoboy-givewp-custom-script', plugin_dir_url(__FILE__) . 'custom.js', [], '', true);
wp_add_inline_script('fidoboy-givewp-custom-script', 'console.log("Hello World")');
});
from givewp.
@fidoboy In order to use
wp_add_inline_script
- you would need to hook into an already registered script. I would not recommend hooking into an existing givewp script at this time, however you could register your own script usingwp_enqueue_script()
and then usewp_add_inline_script
using the registered script name.Example:
add_action("givewp_donation_form_enqueue_scripts", function(){ wp_enqueue_script('fidoboy-givewp-custom-script', plugin_dir_url(__FILE__) . 'custom.js', [], '', true); wp_add_inline_script('fidoboy-givewp-custom-script', 'console.log("Hello World")'); });
But I don't need to load a JS file, just do inline code. What's the problem with "give_custom"? Is it already registered by the plugin? I choosed a random one name
from givewp.
From the WordPress docs about wp_add_inline_script
Code will only be added if the script is already in the queue.
The only way to add inline would be to use an already registered script (name). This is why I suggested enqueue'ing your own script first. Out of curiosity, what you trying to accomplish with inline js?
from givewp.
From the WordPress docs about wp_add_inline_script
Code will only be added if the script is already in the queue.
The only way to add inline would be to use an already registered script (name). This is why I suggested enqueue'ing your own script first. Out of curiosity, what you trying to accomplish with inline js?
I've a small code which sends a message to parent and then page is automatically scrolled up when user push on the CONTINUE button. It was working with no problem in previous versions, using a already registered handler from GiveWP. But now it doesn't work.
What it's a nonsense is to enqueue a empty script just to add a small piece of JS code. So there must be a better solution.
from givewp.
@fidoboy got it thanks, also is this for an existing (v2) form or one that uses the visual donation form builder (v3)? I think we were under the impression it was for the latter which would not apply to the older style of forms (GiveWP v2).
What it's a nonsense is to enqueue a empty script just to add a small piece of JS code. So there must be a better solution.
This is honestly not something we anticipated folks would be doing - but if it is, we are open to creating a solution.
from givewp.
This is honestly not something we anticipated folks would be doing - but if it is, we are open to creating a solution.
Well, there is a very annoying behaviour when using mobile devices then you can press the CONTINUE button because if the next step is smaller than current, screen is left empty so you need to suppose that the content is slided up. I created a small javascript to solve the issue, so when the user clic on the button the page is automagically scrolled to the form top position.
from givewp.
@fidoboy got it thanks, also is this for an existing (v2) form or one that uses the visual donation form builder (v3)? I think we were under the impression it was for the latter which would not apply to the older style of forms (GiveWP v2).
What it's a nonsense is to enqueue a empty script just to add a small piece of JS code. So there must be a better solution.
This is honestly not something we anticipated folks would be doing - but if it is, we are open to creating a solution.
My code was working fine until v3. And now I'm trying to make it work again. All I need is to inject a small piece of javascript into the iframed page to get it working. But it seems that the WordPress guys make the things a bit complicated. Can understand why you need to enqueue a JS file just to put a small snippet
from givewp.
@fidoboy does this form in question use the "Visual Form Builder" or is it using the pre-3.0 form settings?
from givewp.
Now it's using the new visual form build
from givewp.
This issue is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 14 additional days. Note, if this Issue is reporting a bug, please reach out to our support at https://givewp.com/support. If this is a feature request, please see our feedback board at feedback.givewp.com — that’s the best place to make feature requests, unless you’re providing a PR.
from givewp.
This issue was closed because it has been stalled for an additional 14 days with no activity.
from givewp.
Related Issues (20)
- [Broken functionality] Hidden input for donor's choice funds not appearing HOT 1
- [Broken functionality] Issue with Styling/Missing CC Fields When Fee Recovery Add-On is enabled HOT 2
- Fatal error: Uncaught TypeError: Return value of Give\Donors\CustomFields\Controllers\DonorDetailsController::getUniqueDonationFormsForDonor() must be of the type array, null returned HOT 3
- Legacy form - Display options not working anymore (from version 3.1.2) HOT 4
- PHP 8.2 deprecation notices HOT 4
- Legacy form button not changing label HOT 1
- New donation listing amount should have the correct currency HOT 3
- bulk action in legacy give-payment-history page broken HOT 6
- Donation Reports: Payment Methods widget HOT 3
- Funds dropdown in Donation Form: UI is broken HOT 2
- Form Field Manager - Action Hook bug HOT 1
- Form Field Manager - HTML and Action Hook cause bugs HOT 2
- Multi-form goal block should have formatted donation number total HOT 2
- README.txt should have a shorter changelog to address new .org limitations
- Donation-note not updated when checkbox checked and Donation status change from complete to refunded. HOT 5
- More PHP 8.2+ deprecation notices HOT 3
- Issue on Hook HOT 1
- Fatal error importing donations in multisite (network) HOT 3
- 403 error while exporting donations: too long URL
- Fee recovery problems with (custom) zero based currency
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from givewp.