im using a sign up form of mailchimp, its a pop up but it have a cookie to dont show it again even if the user reloads the page.
this is the script:
<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us15.list-manage.com","uuid":"3dd49f3f5fd6be7bc1be03226","lid":"049a3764fd"}) })</script>
But i want allways display, is there a form to do this?
the idea is to set their cookie as expired to have to possibility to display it next time.
Please check this page :
https://gist.github.com/scottmagdalein/259d878ad46ed6f2cdce
Related
I am using the Google login client API for JavaScript. The site I am working on has two relevant pages. It has a login page, and it has a user profile page. The login page obviously has a Google login button on it. You should only be able to view your profile page when you are logged in. When a user goes to their profile page without being logged in, it should redirect them to the login page.
Here is an approach I have tried that did not work:
// This does not work because this event is only fired when the user logs in or logs out, but not when the user is already logged out.
gapi.auth2.init().isSignedIn.listen(function(state) {
if(!state) location.href = "/login/";
});
I have also tried detecting the login status of the user when the script loads, but that did not work either. It always redirected to the login page because the Google API can never log the user in by the time the script is done loading.
Additionally, I am trying not to use setInterval or setTimeout in my code, though, if that is my only valid option, please inform me.
By the way, I have heard multiple times that I can just set a variable when the user logs in, and then simply redirect to the login page if the variable is false. When would I check for the value of said variable? This will not work because it requires me to set a specific delay with setTimeout. Google's loading time can vary greatly, so I am not going to use that.
I figured out that you can use this simple expression that returns either true or false depending on whether the user is logged into Google on your website.
gapi.auth2.init().isSignedIn.get()
I'm no expert in the Google login API, however from the what I do know the API is purely for verification purposes, and (as far as I'm aware, I could be wrong) not actual user sessions. Everything else relating to the user account (IE, storing and persisting the login session in your case) are handled by you, the developer. The basic auth supports calling a callback function on a successful login, via data-onsuccess, which calls a JavaScript function on the login with the relevant login information. When a user logins the standard practice is to verify the validity of the user token returned, then you can do what you need with the data. In this case, you'd start some kind of session for the user.
A very basic example is as follows:
home page
<!DOCTYPE html>
<html>
<head>
<title>Test Home</title>
</head>
<body>
Login<br>
Profile
</body>
</html>
This has 2 links, one for the profile and one for the login page.
login/index.php
<!DOCTYPE html>
<html>
<head>
<title>Test Login</title>
<meta name="google-signin-client_id" content="YOUR-CLIENT-ID.apps.googleusercontent.com">
</head>
<body>
<div class="g-signin2" data-onsuccess="onLoginSuccess"></div>
<script type="text/javascript">
function onLoginSuccess(user) {
var user_id_token = user.getAuthResponse().id_token,
request = new XMLHttpRequest();
request.open('POST', 'https://www.googleapis.com/oauth2/v3/tokeninfo');
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
request.onload = function() {
authUser(request.responseText);
};
request.send('id_token=' + user_id_token);
}
function authUser(userData) {
var request = new XMLHttpRequest();
request.open('POST', '/login/login.php');
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
request.onload = function() {
if (request.responseText == 'true') {
location.href = "/";
}
};
request.send('user_data=' + userData);
}
</script>
<script src="https://apis.google.com/js/platform.js" async defer></script>
</body>
</html>
What this is doing is creating a very basic login button. The button has a callback of onLoginSuccess which is called when the user logs in with Google. It then grabs the users token, via user.getAuthResponse().id_token and makes a post request to https://www.googleapis.com/oauth2/v3/tokeninfo to verify the token (this can be done locally on your backend, Google provides libraries for it. However it's much easier to use the API endpoint). Once it is verified, it sends the response data to authUser, another function, which then passes it to the backend (/login/login.php) to actually start the user session.
login/login.php
<?php
session_start();
$user_data = json_decode($_POST['user_data']);
$_SESSION['user_data'] = $user_data;
echo 'true';
login.php simply starts a session, grabs the posted data, and sets the user session to the data posted. It then echos true so that the JavaScript knows it is done. The JavaScript then sends the user back the home page.
profile/index.php
<?php
session_start();
if (!isset($_SESSION['user_data'])) {
header('Location: /login');
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Test Profile</title>
</head>
<body>
<img src=<?php echo $_SESSION['user_data']->picture; ?>><br>
<b>Welcome! <?php echo $_SESSION['user_data']->name; ?></b><br>
Sign out
</body>
</html>
What this page does is first check if the user_data session is set. IF it is not set (meaning the user has not logged in), it redirects them back to the home page. If it is set (meaning they are logged in) then it displays a picture and the users name, and has a logout button. When this is clicked it simply brings the user to /login/logout.php.
login/logout.php
<?php
session_start();
if (isset($_COOKIE[session_name()])) {
setcookie(session_name(), '', time()-3600, '/');
}
session_destroy();
header('Location: /');
All it does is remove all session data for the user, first getting rid of the session cookie and then destroying the actual session. It then leads them back to the home page. Clicking profile will now not allow them to view anything, because they are logged out, and will only display data when they log back in.
That is just a VERY basic and rough way of handling user sessions with the Google API. There are by far better ways (as this example has no real verification on the backend, and sessions are killed when the browser closes, so cookies may be better for you), however this is a general basis for handling user sessions.
I have a Wordpress website and would like to add a Mailchimp modal to sign up for a newsletter. However, I do not want it to just appear after a given time, which is the only code provided by Mailchimp. I have search for plugins that will get the job done but was unable to find a solid choice. I have found some information on Github, but none specific to Wordpress.
So far I have found this code:
<!-- This is the HTML element that, when clicked, will cause the popup to appear. -->
<button id="open-popup">Subscribe to our mailing list</button>
<!-- This is what I have tried putting in the header. -->
<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script>
<script>
function showMailingPopUp() {
require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.usXX.list-manage.com","uuid":"YOUR_UUID_GOES_HERE","lid":"YOUR_LID_GOES_HERE"}) })
document.cookie = "MCEvilPopupClosed=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
};
document.getElementById("open-popup").onclick = function() {showMailingPopUp()};
</script>
I have tried putting the second part of the code in several different areas, including the header and the widget that the button is in, none have worked. Any ideas about what I am doing wrong?
I solved the problem.
This is the code for my button, the code for this I input directly into a text widget:
<button id="open-mc-popup" onclick ="showMailingPopUp(); return false;">Subscribe</button>
This next section I put into the Theme's Header. If you are new to wordpress or do not know how to get there follow these steps. Appearance > Editor > Theme Header (header.php) if the Theme inherits from a parent theme you will have to click the link for that parent first. Once you are there you can put this code in between the <head> </head> section but be careful not to delete any existing code.
<!-- This is the Mailchimp Modal. -->
<script type="text/javascript" src="//s3.amazonaws.com/downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script>
<script>function showMailingPopUp() {
require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.usXX.list-manage.com","uuid":"YOUR_UUID_HERE",
"lid":"YOUR_LID_HERE"}) })
document.cookie = "MCEvilPopupClosed=; expires=Thu, 01 Jan 1970 00:00:00 UTC";
};</script>
Last make sure that you have updated the "baseUrl" "uuid" & "lid" to match what Mailchimp gives you for a popup form code. That can be found after selecting one of your Mailchimp lists (on the Mailchimp website) and selecting popup forms and clicking Get Code.
Objective: To hide an embedded Mailchimp subscribe form from subscribed users, by placing a cookie in their browser after subscribing, which causes the form to be hidden via JS.
What I have so far:
The Subscribe Form is configured, via Mailchimp's settings, to redirect users to a page that contains the following code:
<body>
<script type="text/javascript">
<!--
Cookies.set('subscriber', 'yes');
//-->
</script>
</body>
When the user returns to the homepage, this code should execute:
<script type="text/javascript">
<!--
if ($.cookie('subscriber')) {
mc_embed_signup.style.display = 'none';
}
//-->
</script>
However the form is still displaying. What am I doing wrong?
Site is http://dev.mistcalls.com
Page with cookie creation code is http://dev.mistcalls.com/subconfirm.html`
Cheers
When I am loading a login page,I am setting a sessionStorage value using
<script >
$(document).ready(function() {
window.sessionStorage.setItem("tab_value","test");
});
</script>
when login success page1.php loads and i am getting sessionStorage value using
<script >
$(document).ready(function() {
alert(window.sessionStorage.getItem("tab_value"));
});
</script>
but here,when new browser starts and after login it alerts 'null' and it alerts 'test' whenever I am login in the same tab after logout.
in my logout function I am trying to destroy session and calls the login page
$this->session->sess_destroy();
$this->load->view('login');
how to solve this thanks in advance
I'm trying to get the user to login using their Facebook account on the page but for some reason the button on the page does nothing. What the heck am I doing wrong? Link: http://friendsconnect.org/Main.php.
Pasting the FB.init call into my JavaScript console and then hitting the "connect" button got me the usual Facebook Connect window so you're probably having timing issues. Try changing your FB.init call to this:
<script type="text/javascript">
$(document).ready(function() {
FB.init({appId: '168032083219061', status: true, cookie: true, xfbml: true});
});
</script>
That way it won't be called until everything is all set up. Also, you don't need all three of these:
<script src="http://friendsconnect.org/jquery_custom/jquery.curvycorners.source.js" type="text/javascript"></script>
<script src="http://friendsconnect.org/jquery_custom/jquery.curvycorners.packed.js" type="text/javascript"></script>
<script src="http://friendsconnect.org/jquery_custom/jquery.curvycorners.min.js" type="text/javascript"></script>
You only need one of them, probably the jquery.curvycorners.min.js version.