Donate. I desperately need donations to survive due to my health

Get paid by answering surveys Click here

Click here to donate

Remote/Work from Home jobs

Why skype chat script is bugging my contact form?

I am trying to put the skype chat script on my website but when I put it there, my contact form goes down. What do I have to do?

This is the original skype code that I am using.

<div class="botones_sn" id="btel"><a class="skype-button bubble" data-contact-id="live:shinranamida" target="_blank"><img src="2012/imgs/n.png" border="0"/</a>
<script src="https://swc.cdn.skype.com/sdk/v1/sdk.min.js"></script>

This is my full code.

<html>


<meta http-equiv="content-type" content="text/html;charset=UTF-8" />

<head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">

    <title>SH Amida - Tecnologia Digital</title>
    <meta name="description" content="Tecnologia digital desde 2010, especialistas no desenvolvimento de Estratégias de Aplicativos Mobile, Ecommerce, Web, Design UI e UX.">

    <meta content="sh, sh amida, shamida, shinran amida, amida multimedia, amida design, sh design, sh desenho, ShinranAmida, amida, amida brasil, shamida brasil, desenho brasil, design brasil"
     name="keywords">
    <meta content="2018. Todos os direitos reservados." name="Copyright">
    <meta property="og:image" content="icono_n.jpg" />
    <meta itemprop="name" content="SH Amida - Tecnologia Digital">
    <meta itemprop="description" content="Tecnologia digital desde 2010, especialistas no desenvolvimento de Estratégias de Aplicativos Mobile, Ecommerce, Web, Design UI e UX.">

    <!-- METAS FACEBOOK -->
    <meta property="og:title" content="" />
    <meta property="og:url" content="/contacto" />
    <meta property="og:description" content="Tecnologia digital desde 2010, especialistas no desenvolvimento de Estratégias de Aplicativos Mobile, Ecommerce, Web, Design UI e UX." />
    <meta property="og:image" content="tester/rt_2014/index.html" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

    <title>. SH Amida - CONTATO .</title>
    <meta name="description" content=" shinranamida@gmail.com .">



    <link type="image/x-icon" href="favicon.ico" rel="shortcut icon">

    <!-- CSS -->
    <link rel="stylesheet" href="css/main.css" type="text/css" />
    <link rel="stylesheet" href="css/responsive.css" type="text/css" />
    <link rel="stylesheet" href="css/fonts.css" type="text/css" />
    <link rel="stylesheet" href="css/jquery.bxslider.css" type="text/css" />
    <link rel="stylesheet" type="text/css" href="css/awwwards.css">
    <link href="../netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

    <script type="text/javascript" src="scripts/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-migrate-1.2.1.min.js"></script>
    <script type="text/javascript" src="js/jquery.easing.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript" src="js/jquery.bxslider.min.js"></script>

    <!--<link rel="stylesheet" href="css/contacto.css" type="text/css"/>
        <script type="text/javascript" src="js/contacto.js"></script>
        <script type="text/javascript" src="js/main_sections.js"></script>

        <script type="text/javascript" src="js/servicios.js"></script>
        <script type="text/javascript" src="js/jquery.flip.min.js"></script>
        <script type="text/javascript" src="js/script_flip.js"></script>
        <script type="text/javascript" src="js/jquery.fs.shifter.js"></script>
        <link type="text/css" rel="stylesheet" href="css/jquery.fs.shifter.css"/>-->


    <link rel="stylesheet" href="css/contacto.css" type="text/css" />
    <script type="text/javascript" src="js/contacto.js"></script>
    <script type="text/javascript" src="js/overs.js"></script>





    <script type="text/javascript" src="js/jquery.fs.shifter.js"></script>
    <link type="text/css" rel="stylesheet" href="css/jquery.fs.shifter.css" />


    <script type="text/javascript">

        $(document).ready(function () {

            $.shifter({
                maxWidth: Infinity
            });




        });

        /***********************************************
        * GOOGLE ANALYTICS
        ***********************************************/

        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-130775021-1']);
        _gaq.push(['_trackPageview']);

        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();

    </script>


</head>

<body class="shifter">

    <nav class="shifter-navigation">
        <ul class="menu_mobile">
            <li><a>MENU</a></li>
            <li ><a href="index-2.html">ESTRATÉGIA</a></li>
            <li ><a href="servicios.html">SERVIÇOS</a></li>
            <li ><a href="trabajos.html">TRABALHOS</a></li>
            <li ><a href="contacto.html">CONTATO</a></li>
            <!-- <li ><a href="blog.html">BLOG</a></li> -->
        </ul>
    </nav>

    <div id="header"> <!--header: Start-->
        <a id="logo_rt" href="index.html"><img src="imgs/logo_rt_2014@2x.png" /></a>
        <a id="menu_m" class="shifter-handle">
            <span class="linea_menu_m"></span>
            <span class="linea_menu_m"></span>
            <span class="linea_menu_m"></span>
        </a>

          <ul id="navbar">
            <!--<li ><a class="item_navbar" id="blog" href="blog.html">BLOG<span class="current_btn_p "></span></a></li> -->
            <li ><a class="item_navbar" id="contacto" href="contacto.html">CONTATO<span class="current_btn_p current_active"></span></a></li>
            <li ><a class="item_navbar" id="proyectos" href="trabajos.html">TRABALHOS<span class="current_btn_p "></span></a></li>
            <li ><a class="item_navbar" id="servicios" href="servicios.html">SERVIÇOS<span class="current_btn_p "></span></a></li>
            <li ><a class="item_navbar" id="estrategia" href="index-2.html">ESTRATÉGIA<span class="current_btn_p  "></span></a></li>
          </ul>
    </div> <!--header: End-->


    <script type="text/javascript">
        $(document).ready(function () {



            // ASEGURAR QUE LES CAMPOS ESTÉN LLENOS ANTES DE MANDAR EL FORM

            var prevent = 0;

            $('#enviar').click(function () {
                $('#form_contacto').submit();
            });



            var nombre = $('#nombre');

            var div_mensaje = $('#div_mensaje');

            var mensaje = $('#mensaje');

            var email = $('#email');

            //var captcha = $('#captcha');

            $('#form_contacto').submit(function (a) {
                if (prevent == 0) {
                    a.preventDefault();
                    if (nombre.val() == "") {
                        div_mensaje.hide();
                        nombre.addClass('error');
                        mensaje.removeClass('error');
                        email.removeClass('error');
                        //captcha.removeClass('error');
                        div_mensaje.fadeIn(500).text("O CAMPO NOME NÃO PODE FICAR VAZIO");
                    } else if (email.val() == "" || !email.val().match(/([0-9a-zA-Z]+[-._+&])*[0-9a-zA-Z]+@([-0-9a-zA-Z]+[.])+[a-zA-Z]{2,6}/)) {
                        div_mensaje.hide();
                        email.addClass('error');
                        mensaje.removeClass('error');
                        nombre.removeClass('error');
                        //captcha.removeClass('error');
                        div_mensaje.fadeIn(500).text("INTRODUZA UM E-MAIL VÃLIDO");
                    } else if (mensaje.val() == "") {
                        div_mensaje.hide();
                        mensaje.addClass('error');
                        nombre.removeClass('error');
                        email.removeClass('error');
                        //captcha.removeClass('error');
                        div_mensaje.fadeIn(500).text("O CAMPO DE MENSAGENS NÃO PODE FICAR VAZIO");
                    } //else if ($('#captcha').val() == "") {
                        //div_mensaje.hide();
                        //mensaje.removeClass('error');
                        //nombre.removeClass('error');
                        //email.removeClass('error');
                        //captcha.addClass('error');
                        //div_mensaje.fadeIn(500).text("ENTRE COM O CÓDIGO CAPTCHA");
                    //} 
                    else {
                        // PREVENIR QUE SE MANDE MAS DE UNA VEZ
                        $(this).find("#enviar").attr("disabled", true);
                        prevent = 1;
                        nombre.removeClass('error');
                        email.removeClass('error');
                        mensaje.removeClass('error');
                        //captcha.removeClass('error');
                        div_mensaje.hide();
                        div_mensaje.fadeIn(500).text("PROCESSANDO SUA SOLICITAÇÃO, POR FAVOR AGUARDE");

                        $.ajax({
                            type: 'post',
                            url: 'send_contacto.php',
                            data: $(this).serialize(),
                            dataType: 'text',
                            success: function (output) {
                                response = output;
                                if (response != "1" && response != "2" && response != "3") { // BIEN
                                    div_mensaje.hide();

                                    div_mensaje.fadeIn(500).text("OBRIGADO POR ENTRAR EM CONTATO CONOSCO! RESPONDEREMOS EM BREVE");

                                    nombre.val("");
                                    mensaje.val("");
                                    email.val("");
                                    //captcha.val('');
                                    $("#enviar").attr("disabled", false);

                                } else if (response == "1") { // MAL
                                    div_mensaje.hide();
                                    div_mensaje.fadeIn(500).text("HOUVE UM ERRO AO PROCESSAR SUA REQUISIÇÃO, POR FAVOR TENTE NOVAMENTE");
                                    $("#enviar").attr("disabled", false);
                                    prevent = 0;
                                } else if (response == "2") { // DATOS INCOMPLETOS
                                    div_mensaje.hide();
                                    div_mensaje.fadeIn(500).text("POR FAVOR, CERTIFIQUE-SE DE PREENCHER TODOS OS CAMPOS");
                                    prevent = 0;
                                } //else if (response == "3") { // CODIGO CAPTCHA INCORRECTO
                                    //div_mensaje.hide();
                                    //$('#img_captcha').attr("src", "captcha/captcha.png");
                                    //div_mensaje.fadeIn(500).text("CÓDIGO CAPTCHA INCORRETO");
                                    //captcha.val('');
                                    //prevent = 0;
                                //} 
                                else { // ALGO MUY EXTRAÑO SUCEDIO
                                    div_mensaje.hide();
                                    div_mensaje.fadeIn(500).text("ERRO DESCONHECIDO, POR FAVOR, TENTE NOVAMENTE");
                                    prevent = 0;
                                }
                            }, // SUCCESS FUNCTION 
                            error: function (output) { alert(output); }
                        }); // AJAX          
                    } // REVISAR DATOS
                }  // IF PREVENT
            }); // SUBMIT FUNCTION

            // CAPTCHA

            //$('#refresh_captcha').click(function () {
                //$('#img_captcha').attr("src", "captcha/captcha.png");
            //});


        }); // DOC READY


    </script>
    <style>
        .error {
            border: 3px solid #d5b8ff !important;
            color: #000;
        }

        .error_block {
            width: 200px;
            height: 30px;
            background: #d5b8ff;
            color: #000;
            text-align: center;
            padding: 5px;
            line-height: 32px;
            position: absolute;
            top: 0px;
            right: 0px;
            display: none;
        }

        .error_block p {
            width: 100px;
        }
    </style>


    <div id="main_wrap" class="shifter-page">
        <!--main_wrap: Start-->

        <div class="cont_fix_map"><iframe src="mapa_full.html" bordercolor="0" frameborder="0" scrolling="no"></iframe></div>

        <div class="main_contacto">

            <!--main_contacto: Start-->
            <div class="pestana">
                <div class="etiqueta">
                    <div class="btn_desp"><span class="arrow"></span></div>
                    <span class="titulo_contacto">CONTATO</span>
                </div>
            </div>


            <div class="form_contacto">

                <!--form_contacto: Start-->
                <form id="form_contacto" action="https://formspree.io/shinranamida@gmail.com" method="POST">

                    <ul class="c_iconos">
                        <li class="nombre"><span class="iconos"></span></li>
                        <li class="email"><span class="iconos sobre"></span></li>
                        <li class="mensaje"><span class="iconos coments"></span></li>
                        <!-- <li class="captcha"><span class="iconos captcha"></span></li> -->
                    </ul>



                    <div class="formulario_c">
                        <!--formulario_c: Start-->

                        <div class="campo">
                            <div class="arrowform icon"></div>
                            <input name="nombre" id="nombre" placeholder="NOME *" class="">
                        </div>

                        <div class="campo">
                            <div class="arrowform icon"></div>
                            <input name="email" id="email" placeholder="E-MAIL *" class="">
                        </div>

                        <div class="campo">
                            <div class="arrowform icon"></div>
                            <textarea name="mensaje" id="mensaje" placeholder="MENSAGEM *" class=""></textarea>
                        </div>


                        <!-- COMIENZA CAPTCHA 

                        <div class="captcha_cont">
                            <div class="capt">
                                <img id="img_captcha" src="captcha/captcha.php" alt="captcha image">
                            </div>
                            <div id="refresh_captcha" class="refresh_captcha icon"></div>
                        </div>

                        <div class="campo">
                            <div class="arrowform icon"></div>
                            <input id="captcha" placeholder="CÓDIGO CAPTCHA" name="captcha">
                            <div style="display: none" class="icon_campo captchas">
                                <div class="tache icon"></div>
                            </div>
                        </div>

                        <!-- TERMINA CAPTCHA -->


                        <div id="enviar" class="enviar_bar">
                            <!-- <div class="enviar">ENVIAR </div>
                            <div class="circle"><span class="arrow icon"></span></div> -->
                            <input type="submit" class="circle"><span class="arrow icon"></span>
                        </div>

                        <div style="display: none" class="mensajes" id="div_mensaje"></div>

                    </div>
                    <!--formulario_c: End-->

            </div>
            <!--form_contacto: End-->

            </form>

            <div class="info_contacto">
                <!--info_contacto: Start-->

                <ul class="m_info">

                    <!-- <li class="f_datos lugar">
                        <span class="iconos_info "></span>
                        <span class="infor">
                            OBRERO MUNDIAL<span class="bold"> #919</span>
                            COL. ÃLAMOS
                            C.P. 03400
                            MÉXICO, CDMX
                        </span>
                    </li> -->


                    <li class="f_datos tel">
                        <span class="iconos_info"></span>
                        <span class="infor">
                            SH Amida
                        </span>
                    </li>

                    <a class="correo_ventas" href="mailto:shinranamida@gmail.com">
                        <li class="f_datos correo">
                            <span class="iconos_info"></span>
                            <span class="infor">
                                shinranamida<span class="bold">@</span>gmail.com
                            </span>
                        </li>
                    </a>

                    <li class="f_datos face" href="https://www.facebook.com/shamida0">
                        <span class="iconos_info"></span>
                        <span class="infor">
                            <span class="bold">/</span>shamida0
                        </span>
                    </li>

                    <li class="f_datos twit" href="https://twitter.com/sh_amida">
                        <span class="iconos_info"></span>
                        <span class="infor">
                            <span class="bold">@</span>sh_amida
                        </span>
                    </li>
                </ul>



            </div>


        </div>
        <!--info_contacto: End-->




    </div>
    <!--main_contacto: End-->


    </div>
    <!--main_wrap: End-->

    <div id="footer" class="mm-fixed-bottom footer_section">
        <!--footer: Start-->


        <div id="widgets">   

            <div id="fb"><!-- widget facebook --> 
              <div id="fb-root"></div>
                <script>(function (d, s, id) {
                  var js, fjs = d.getElementsByTagName(s)[0];
                  if (d.getElementById(id)) return;
                  js = d.createElement(s); js.id = id;
                  js.src = 'https://connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v3.2&appId=1967436750226237&autoLogAppEvents=1';
                  fjs.parentNode.insertBefore(js, fjs);
                  }(document, 'script', 'facebook-jssdk'));
                </script>
                  <div class="fb-like" data-href="https://www.facebook.com/pg/shamida0" data-layout="button" data-action="like" data-size="small" data-show-faces="true" data-share="false"></div> 
            </div>

                <div id="tw"><!-- widget twiter --> 
                    <a href="https://twitter.com/share" class="twitter-share-button" data-text="SH-Amida" data-lang="pt" data-related="sh_amida">Twitter</a>
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="../platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>    
                </div>

                <div id="legales_rt">
                  <span>SH Amida ®, Brasil 2014</span>
                  <a id="aviso" href="aviso_de_privacidad.html">AVISO DE PRIVACIDADE</a> 
                </div>
        </div><!-- widgets: End -->

            <div id="sn">
                <div class="botones_sn" id="bfb"><a href="https://www.facebook.com/shamida0" target="_blank"><img id="fb" src="2012/imgs/n.png" border="0"/></a></div>
                <div class="botones_sn" id="btw"><a href="https://twitter.com/sh_amida" target="_blank"><img id="tw" src="2012/imgs/n.png" border="0"/></a></div>
                <div class="botones_sn" id="bmail"><a href="mailto:shinranamida@gmail.com" target="_blank"><img id="mail" src="2012/imgs/n.png" border="0"/></a></div>
                <div class="botones_sn" id="btel"><a class="skype-button bubble" data-contact-id="live:shinranamida" target="_blank"><img src="2012/imgs/n.png" border="0"/></a>
                    <script src="https://swc.cdn.skype.com/sdk/v1/sdk.min.js"></script>
                </div>

            </div><!-- sn: End -->
    </div> <!--footer: End-->

</body>

</html>

On footer is where I am trying to show the icon for skype chat.

Comments