How can i remove billing address field in stripe checkout form? - wordpress

I am using a custom code in WordPress for redirecting to checkout page of stripe but stripe checkout form is showing billing address
var data = {
action:'sendpayment',
currency:currency,
amount:amount,
payment_method_types:["card"]
};
jQuery.post(window.location.origin+'/wp-admin/admin-ajax.php', data, function(response) {
response= JSON.parse(response);
if(response.sessionId){
stripe.redirectToCheckout({
sessionId: response.sessionId,
}).then(handleResult);
}else{
handleResult(response);
}
});

You can specify billing_address_collection as required which will only collect it if it's necessary (at Stripe's determination). There is not an option to tell Stripe to never collect it, though.

Related

Get emails of users from the email field of Hubspot contact from

On my WordPress website I have a contact form built in Hubspot. I got the script of this form from Hubspot and past it in my contact page (https://stagezero.ai/contact/).
<script>
hbspt.forms.create({
region: "na1",
portalId: "20085053",
formId: "412d2c51-95f1-4a6c-b3f3-f71c5852ac98"
});
</script>
Whenever the form is submitted the user is redirected to our thank you page (https://stagezero.ai/thank-you/).
So, whenever someone submit the form I want to extract the Emails of our users from the email field on our contact from. So basically, the goal is to get the emails stored as a variable so that it can be hashed and sent to google analytics.
I have tried to do it by myself by writing and pasting this code in my contact page but unfortunately it did not work. Can some help me to achieve the goal which I have mentioned above?
Thank you.
<script>
//code to get email values from contact form’s email field
var form = document.getElementById("hsForm_412d2c51-95f1-4a6c-b3f3-f71c5852ac98");
var email_field=document.getElementById("email-412d2c51-95f1-4a6c-b3f3-f71c5852ac98");
form.onsubmit = function(){
var email = email_field.value();
//code to send email values to Google Analytics
dataLayer.push({
'event':'form_submit',
'enhanced_conversion_data': {
"email": email // replace 'yourEmailVariable' with email variable //
}
});
};
</script>

redux-beacon: enhanced ecommerce actions not being fired

I'm using redux-beacon to manage google analytics enhanced ecommerce actions. What I'm noticing is that pageview events are being fired off fine but the enhanced ecommerce actions are not being sent. It's like they are being stored in the datalayer but no network request is being triggered. I'm new to enhanced ecommerce tracking so perhaps I'm missing something?
For example, here I have the events which are triggered when viewing a product:
export const analyticsEcommerceProduct = trackEcommProduct((action) => {
const { product } = action;
return {
id: product.id,
name: product.title,
category: product.type
};
}, CLIENT_TAG);
export const analyticsEcommerceAction = trackEcommAction((action) => {
const { actionType, id, revenue } = action;
return {
actionName: actionType,
id,
revenue
};
}, CLIENT_TAG);
Which are added to my eventMap:
const eventsMap = {
CLIENT_ANALYTICS_PAGEVIEW: clientPageView,
CLIENT_ANALYTICS_ECOMM_PRODUCT: analyticsEcommerceProduct,
CLIENT_ANALYTICS_ECOMM_ACTION: analyticsEcommerceAction
};
const middleware = createMiddleware(eventsMap, GoogleAnalytics(), GoogleTagManager());
Now when I land on the product page the analyticsEcommerceProduct and analyticsEcommerceAction events are firing as expected but no network request is made to send this information:
Is there some sort of event to 'send' the data that I need to add?
Is there some sort of event to 'send' the data that I need to add?
Yes, I believe so. In reading the examples that Google provides here: https://developers.google.com/analytics/devguides/collection/analyticsjs/enhanced-ecommerce, it looks like the eCommerce actions set meta data that will be sent along with the next event or pageview. Each example either ends with a ga('send', 'pageview'); or an event call like:
ga('send', 'event', 'Checkout', 'Option', {
hitCallback: function() {
// Advance to next page.
}
});
I'd try going to a new page and inspecting the call made there to see if it includes the data you need. If it does, I'll think of a way to make this easier for redux-beacon users. At the very least I think some documentation/tips are in order. As always, I'm open to suggestions/pr's.

Stripe payment with JMSPaymentBundle "The source parameter is required"

I already integrated JMSPaymentBundle, with paypal every thing works fine!
When I tried to change with stripe from this link for JMS
and using ruudk/PaymentStripeBundle from github, it's actually the same.
But there is a thing. I'm receiving this error: The source parameter is required
In the issues of the bundle, I found that I must use stripe form
<form action=""
method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="MYPUBLISHEDKEY"
data-amount="999"
data-name="Demo Site"
data-description="Widget"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-locale="auto">
</script>
</form>
This form generates a Token. What I need to know is :
1- Where to put that published token used by JMSPaymentBundle?
2- What action in the form should I do? Is it the same for paypal?
it's hard to say what's going on here but it seems like https://github.com/ruudk/PaymentStripeBundle/ is lacking some necessary documentation.
From what I can tell it's adding a token hidden field to your forms:
https://github.com/ruudk/PaymentStripeBundle/blob/master/src/Form/CheckoutType.php#L12
However, the Checkout embed code you're using won't save the token to that field. I don't see any additional Javascript embedded in this library, so you'll need to build your own using the custom Stripe Checkout integration:
https://stripe.com/docs/checkout#integration-custom
Something like this should work:
var handler = StripeCheckout.configure({
key: 'pk_test_6pRNASCoBOKtIshFeQd4XMUh',
image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
locale: 'auto',
token: function(token) {
// NOTE: assuming that the field injected by the library has an ID of "token"--you'll have to check your DOM and possibly adjust this
var field = document.getElementById('token');
field.value = token.id;
// TODO: submit form and send to your backend
}
});
document.getElementById('customButton').addEventListener('click', function(e) {
// Open Checkout with further options:
handler.open({
name: 'Stripe.com',
description: '2 widgets',
zipCode: true,
amount: 2000
});
e.preventDefault();
});
// Close Checkout on page navigation:
window.addEventListener('popstate', function() {
handler.close();
});

Custom field publish for users collection is not working properly

I just added one custom field into default users table. we do publish the specific field and subscribed. when we tried to access the particular field value in the account methods "Accounts.onLogin" it has value on initial login but it lost on reactive refresh.
if (Meteor.isServer) {
Meteor.publish("users",function(){
return Meteor.users.find({_id:this.userId},{fields:{"customField":1}}); // Publish the user with custom fields
});
}
if (Meteor.isClient) {
Meteor.subscribe("users");
Accounts.onLogin(function(){
alert(Meteor.user().customField + ' Comes '); // it has value on initial login but it lost on reactive refresh.
});
}
I think you can only extend profile in Meteor.users.. See this discussion for more: https://forums.meteor.com/t/how-to-add-new-field-on-meteor-users/1065/2

Meteor: How to keep showing profile avatar after logged out?

After reading Discover Meteor, I'm trying to customize microscope to further practice my meteor skills.
I am using accounts-twitter and hope to display the user's twitter profile pic on each of their post submission. I user the following helper to get the post's author id in post_item.js
Template.postItem.helpers({
username: function () {
owner = this.userId;
var user = Meteor.users.findOne({
_id: owner
});
return user;
}
});
And then in post_item.html I use the following to display the profile pic:
<img class="pull-right" src="{{username.profile.avatar}}">
If I've logged in my account, I can see my profile pic next to all of my submitted posts. However, when I log out, all the profile pics will be disappeared.
Sorry for the newbie questions. Any pointers are welcome.
Thanks for your help.
Stupid me. I forgot that by default, Meteor only publishes the logged in user. Hopefully the following answer will help other meteor newbies.
Server:
Meteor.publish("allUsers", function () {
return Meteor.users.find({}, {
fields: {
profile: 1
}
});
});
Client:
Meteor.subscribe('allUsers');
Then you will be able to load all the user's profile pics using the following:
<img src="{{username.profile.avatar}}">

Resources