Home Forums Porto Template HTML Pop-Up

Viewing 23 posts - 1 through 23 (of 23 total)
  • Author
    Posts
  • #10030878
    mbv
    Participant

    Hey Rodrigo, can you provide any sample code for creating an html pop-up window. Right now we have an image for a pop-up but need to add a Vote Now button that we can make into an html link.


    #10030880
    Support2
    Keymaster

    Hello mbv,

    Here is the code you need:

    <a class="lightbox" href="#popupContent" data-plugin-options="{'type':'inline'}">
    	<img class="img-fluid" src="img/projects/project.jpg" alt="Project Image">
    </a>
    
    <div id="popupContent" class="dialog mfp-hide">
    	<img class="img-fluid" src="img/projects/project.jpg" alt="Project Image">
    	<p>Lorem ipsum dolot sit a met</p>
    	<a href="#" class="btn btn-primary">Button</a>
    </div>

    * Make sure you include the “MagnificPopup” JS and CSS on the page.

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    #10030882
    mbv
    Participant

    Good morning, looking for a sample for a pop-up on page load that we add to custom.js


    #10030884
    Support2
    Keymaster

    Hello mbv,

    To open on page load this is the code you need in (js/custom.js):

    $(window).on('load', function(){
    	var delay = 1000; // 1 seconds
    
        setTimeout(function(){
            $.magnificPopup.open({
                items: [
                	{
                		src: '<div class="dialog"><p>HTML CONTENT HERE</p></div>'
                	}
                ],
                type: 'inline'
            });
    	}, delay);
    
    });

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    #10030944
    mbv
    Participant

    Hey Rodrigo, need help aligning a drop down in the product dialog window. Can you visit http://www.stickykicksrc.com/purchase.html and click View Details on the SKRC Ti Screws 4 Pack Flat Head product. The widow opens – we are trying to better align the drop down so it is even/horizontal with the Close Window and Add to Cart Button.


    #10030946
    Support2
    Keymaster

    Hello mbv,

    Please follow the steps below:

    1) Add a margin on the close window button:

    <a href="#" class="btn btn-primary custom-close-button mb-xs">Close Window</a>

    2) Change the form to:

    <form action="https://www.paypal.com/cgi-bin/webscr" method="post" class="d-flex align-items-center">

    3) On the select add margin right and remove the margin bottom:

    <select name="os0" class="form-control custom-color-1 mr-xs" style="margin-bottom: 0 !important;">

    * Here the custom-color-1 is forcing a margin-bottom with “!important” on the custom CSS file. Because of that we need add this inline style. You also can do it trough the custom CSS file.

    4) Add in (css/custom.css):

    .d-flex {
    	display: flex !important;
    }
    
    .align-items-center {
    	align-items: center !important;
    }

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    • This reply was modified 3 months ago by Support2.
    #10031020
    mbv
    Participant

    Hi Rodrigo – we created a new form at https://www.mbvsites.net/partner.html

    All fields are being passed to the e-mail with exception to both the 1-10 questions, disciplined and accountable. We have the code added to the php and js files but we feel we might have the id= fields incorrect in the html. Can you help review. And we also would like a copy of the e-mail to also be sent to person filling out the form.

    Also, we have a pop-up window for the entire site but would like to block it on just this page. Any way to do that?


    #10031026
    Support2
    Keymaster

    Hello mbv,

    1) Regarding the contact form:
    In view.contact.js you need get the radios input in a different way. For example the disciplined:

    howsoon: $form.find('#howsoon').val(),
    accountable: $form.find('#accountable').val(),
    
    disciplined: $form.find('input[name="disciplined"]:checked').val(),
    
    trainer: $form.find('#trainer').val(),

    * Do the same for all other radios.

    To send a copy to the person that fills the form, uncomment the addCC in php/contact-form.php and change to:

    $mail->AddCC($_POST['email'], 'Person 3');          // Add a "Cc" address.

    2) For the popup only on partner page here is the code you need:

    // FOR ONE TIME HTML POP UP ON ENTIRE SITE
    
    var current_page = document.location.pathname.match(/[^\/]+$/)[0];
    
    if( current_page == 'partner.html' ) {
        $(window).on('load', function(){
        	var delay = 3000; // 3 seconds
    
            if( getCookie('popupCheck') != 'true' ) {
    
                setTimeout(function(){
                    $.magnificPopup.open({
                        items: [
                        	{
                        		src: '<div class="embed-responsive embed-responsive-custom"><iframe frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/DJlHmNrBwoU"></iframe></div>'
                        	}
                        ],
                        type: 'inline'
                    });
                    setCookie('popupCheck', 'true', 1); // Expires in 1 day
            	}, delay);
    
            }
        });
    }

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    #10031031
    mbv
    Participant

    Thank you for the response. Almost there. We did manage to get the pop-up working correctly. The form fields are also now passing correctly via the e-mail receipt however, the thank you response now shows the debug page and not the green bubble Thank you that should appear.

    And on the php, we copied our php/contact-form.php and named it php/partner-form.php. This is where we are posting the form to. We did not see the addCC code that you referenced. It is listed in our php/contact-form.php however. Not sure if we gave you ftp access and any changes were made? TY


    #10031035
    Support2
    Keymaster

    Hello mbv,

    1) This occurs because of JS syntax error:

    It’s missing the $ where the red arrow points.

    2) For now the FTP don’t is necessary. I think we can resolve this without the FTP access. Please send for us all your php/partner-form.php code probably you are using an old version of Porto then some things can change.

    Kind Regards,

    Rodrigo.


    #10031039
    mbv
    Participant

    Doh 🙂 copy paste error on my end. Ok, so everything is good with exception to the sender getting a copy. Here is the code we are using for partner-form.php https://pastebin.com/YVvTFsUs
    We kinda pieced this php file together so we must have missed something


    #10031046
    Support2
    Keymaster

    Hello mbv,

    Try changing the “Simple Mail” headers code to this new:

    ...
    ....
    ....
    	$headers = '';
    	$headers .= 'From: ' . $name . ' <' . $email . '>' . "\r\n";
    	$headers .= 'Cc: '. $_POST['email'] . "\r\n";
    	$headers .= "Reply-To: " .  $email . "\r\n";
    ...
    ...
    ..

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    • This reply was modified 2 months, 3 weeks ago by Support2.
    #10031051
    mbv
    Participant

    Morning! That did work. We are getting copies to both now. One small issue is the copy the sender receives comes across with <br>’s and the formatting is messy. The copy that comes to us does not get corrupted, however. We sent it to 3 different mail clients to test further but all 3 get the jumbled response:

    Name: Big Boy<br>
    Email: ray@ecxoc.com<br>
    State: CA<br>
    Phone: 9497836949<br>
    Rep Name: Kurt Higgins<br>
    Where you a Previous Business Owner: I don't have a business yet but want to start one<br> Capital to invest: 10k+<br> Computer Skills: I am not someone who likes technology and I do not use a computer<br> Hours to invest a week: 15+<br> Amount you want to make: 7k+<br> How many months can you go without a profit: I need to make money right away<br> Do you understand there are no guarantees of profit: No<br> Are you willing to work with our Trainer: No, I prefer to do things on my own<br> Level of Discipline: 10<br> Level of Accountability: 10<br> How soon are you looking to start: I currently have no real timetable established<br>


    #10031064
    Support2
    Keymaster

    Hello mbv,

    Probably the email client/software don’t allow html.

    Try removing the <br> html tag:

    $message .= $field['text'].": " . htmlspecialchars($field['val'], ENT_QUOTES) . "\n";

    Please try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    • This reply was modified 2 months, 3 weeks ago by Support2.
    #10031070
    mbv
    Participant

    Thanks, Rodrigo! This made the email like a run-on sentence since the formatting was removed be deleting the <br>

    Strange that it only does it for the sender, huh… our leads@ e-mail copy comes across perfectly.


    #10031074
    Support2
    Keymaster

    Hello mbv,

    Probably the sender email client software don’t allow html tags.
    What email software you are using to receive the sender email ? (like outlook, live, etc..)

    Kind Regards,

    Rodrigo.


    #10031079
    mbv
    Participant

    Strange, huh. We tested using a pop’d Outlook as well as an imap’d Outlook e-mail and also tested with a Gmail (checking via web-based email) and they all do the same showing the <br> code.


    #10031081
    Support2
    Keymaster

    Hello mbv,

    In that case we will need the access to your FTP to do some tests and discover where is the issue.

    Can you please send for us trough private message ? Host, Username and Password. If you prefer by email you can send for maaprote@gmail.com

    Kind Regards,

    Rodrigo.


    #10031089
    mbv
    Participant
    This reply has been marked as private.
    #10031090
    Support2
    Keymaster

    Hello Mbv,

    Sorry! I saw now your email in my inbox. I will reply for you in the next hours.

    Kind Regards,

    Rodrigo.


    #10031091
    Support2
    Keymaster

    Hello mbv,

    Was missing this code below on headers of email:

    $headers .= "Content-Type: text/html; charset=UTF-8\r\n";

    I already added this to the live website php file.

    Please check if it’s working now and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    #10031314
    mbv
    Participant

    Hey Rodrigo! Adding the Captcha to http://www.stickykicksrc.com/thank-you.html however, you can submit the form without checking the captcha. Did we miss a line of code somewhere? TY


    #10031318
    Support2
    Keymaster

    Hello Mbv,

    Probably is missing the recaptcha code on the PHP file php/thank-you-form.php.

    Here’s the tutorial where you can get the correct code:

    If the problem persists, please share the code of this file with us. So we can check for you.

    Kind Regards,

    Rodrigo.


    • This reply was modified 1 month, 3 weeks ago by Support2.
Viewing 23 posts - 1 through 23 (of 23 total)